Gutenberg Création custom blocks sans Node (Créer un compte)

  • WordPress :5.8
  • Statut : hors support
2 sujets de 1 à 2 (sur un total de 2)
  • Auteur
    Messages
  • #2399296
    Benzouye
    Participant
    Maître WordPress
    577 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL : PHP 8.1 / MariaDB 10.4
    • Thème utilisé : 2022
    • Extensions en place : Aucune
    • Nom de l’hébergeur : localhost
    • Adresse du site : localhost

    Problème(s) rencontré(s) :

    Bonjour à tous,

    Avec la montée en puissance de Gutenberg je commence à me pencher sur la migration de mes anciens widgets vers le système de bloc.

    En lisant la documentation et plusieurs articles sur le sujet, je suis un peu perplexe … Tout semble passer par une logique JavaScript compilé (de préférence ESNext), via npm, donc Node.js.

    Cela signifie-t-il que je ne pourrais pas migrer mes anciens widgets sans passer par une compilation JS ?

    Avez-vous des pistes pour « esquiver » cette compilation en générant mon propre code à la mimine « old fashion way » ?

    D’avance merci pour vos retours !

    • Ce sujet a été modifié le il y a 5 mois et 3 semaines par mathieu42.
    • Ce sujet a été modifié le il y a 5 mois et 3 semaines par PhiLyon.
    #2399304
    mathieu42
    Participant
    Maître WordPress
    1515 contributions

    en effet, les outils proposés servent surtout pour la compilation du code donc il est possible de s’en passer.
    je suis parti d’un exemple qui fonctionne pour avoir une base de la création d’un nouveau bloc. je ne suis pas spécialiste en javascript donc je ne sais pas si c’est déconseillé de faire comme cela.

    voilà le code javascript :

    
    jQuery(function ($) {
    	
    	const { __ } = wp.i18n;
    	const { registerBlockType } = wp.blocks; //from wp.blocks
    	const { Fragment } = wp.element;
    	
    	const { InspectorControls } = wp.blockEditor;
    	const { ServerSideRender } = wp;
    	const {
    		PanelBody, SelectControl, TextControl, ToggleControl,
    	} = wp.components;
    	
    	var el = wp.element.createElement;
    		
    	registerBlockType(
    		"code_extention/code_bloc",
    		{
    			"title" : __("titre du bloc"),
    			"icon" : "location-alt",
    			"category" : "common",
    			"attributes" : {
    				"adAlignment" : {
    					"type" : "string",
    					"default" : "center-align",
    				},
    				"isWrapper" : {
    					"type": "boolean",
    					"default" : true,
    				},
    			},
    			"edit" : (props) => {
    				const { setAttributes, attributes } = props;
    				const { adAlignment, isWrapper } = attributes;
    				
    				return "résultat édition";
    			},
    			"save" : (props) => {
    				const { attributes, className = "" } = props;
    				
    				return "résultat enregistrement";
    			},
    		}
    	);
    	
    	
    	
    });

    ensuite, il est possible de modifier d’autre parties de gutenberg comme expliqué dans cette discussion au sujet de la fenêtre d’édition des liens :
    https://wpfr.net/support/sujet/plugin-pour-afficher-une/

2 sujets de 1 à 2 (sur un total de 2)
  • Vous devez être connecté pour répondre à ce sujet.