Gutenberg Création custom blocks sans Node

WordPress :5.8
Statut : hors support

Ce sujet contient 1 réponse, 2 participants et a été mis à jour pour la dernière fois par mathieu42, le il y a 1 année et 2 mois.

2 sujets de 1 à 2 (sur un total de 2)

Auteur

Messages
31 mars 2022 à 14 h 43 min #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 1 année et 2 mois par mathieu42.
- Ce sujet a été modifié le il y a 1 année et 2 mois par PhiLyon.
31 mars 2022 à 16 h 18 min #2399304
mathieu42
Participant

Maître WordPress
1982 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/
Auteur

Messages