Home Arrow Icon Knowledge base Arrow Icon Global Arrow Icon Crearea de pluginuri bloc pentru WordPress cu Node.js


Crearea de pluginuri bloc pentru WordPress cu Node.js


Pentru a crea pluginuri bloc pentru WordPress folosind Node.js, urmați acești pași:

1. Instalați Node.js și npm:
- Asigurați-vă că aveți Node.js instalat pe computer. Dacă nu, descărcați și instalați-l de pe site-ul web oficial Node.js[1][2].

2. Configurați un plugin Starter Block:
- Navigați la directorul `wp-content/plugins` al instalării de dezvoltare locală. Apoi, rulați comanda `npx @wordpress/create-block` pentru a crea un plugin pentru blocuri. Această comandă generează tot codul necesar pentru a porni un proiect și integrează o configurație modernă de construcție JavaScript fără configurare necesară[3][4].

3. Configurați pluginul Block:
- Comanda `create-block` vă solicită introducerea pas cu pas. De asemenea, puteți utiliza modul de pornire rapidă pentru a trece anumite opțiuni direct în linia de comandă, eliminând nevoia de solicitări interactive[4].

4. Construiți și rulați pluginul Block:
- Rulați `npm start` pentru a porni un server de dezvoltare și reconstruiți automat blocul ori de câte ori este detectată orice modificare a codului. Când sunteți gata să vă implementați blocul, utilizați `npm run build` pentru a vă optimiza codul și a-l face gata de producție[4].

5. Integrați-vă cu WordPress:
- Activați pluginul generat în WordPress. Acest lucru va face blocul disponibil în Editor[4].

6. Personalizați și extindeți blocul:
- Modificați codul standard pentru a personaliza și extinde blocul după cum este necesar. Acest lucru implică utilizarea JavaScript modern (ESNext și JSX) și utilizarea pachetului `wp-scripts` pentru sarcinile de compilare și listing[4].

Urmând acești pași, puteți crea și gestiona pluginuri de bloc personalizate pentru WordPress folosind Node.js și pachetul `@wordpress/create-block`.

Citate:
[1] https://wpdevelopment.courses/articles/wordpress-create-block/
[2] https://kinsta.com/courses/gutenberg-block-development/setting-up-a-block-plugin/
[3] https://www.npmjs.com/package/%40wordpress/create-block
[4] https://developer.wordpress.org/block-editor/getting-started/devenv/get-started-with-create-block/
[5] https://www.youtube.com/watch?v=-aa4F4Dn9GY