Development, WordPress
How to create custom Gutenberg blocks in WordPress
WordPress 5.0 is out, and with it comes the new block-based editor, Gutenberg. Out of the box, it packs in a decent selection of blocks you can use across your pages and posts. However, since this is WordPress, there’s always room for more custom functionality.
In other words, it’s possible to build your own custom blocks. To do so, you’ll need to know at least a bit about coding, but the process itself is relatively straightforward. Plus, creating custom blocks for functionality you want to reuse can save you a lot of time down the road!
Note: When testing the Gutenberg editor or creating custom blocks, be sure to make changes in a staging or local environment, like Local. Click here to learn more about testing WordPress 5.0!
For this article, I’ll talk a bit more about the current state of the Block Editor. Then, I’ll go over how to create new blocks manually, and introduce you to a couple of plugins that can simplify the process. Let’s get to it!
Why you might need to create custom blocks for the new WordPress editor
Of course, blocks are central to the functionality of the new editor. The idea is that you can add blocks anywhere you want and arrange them usings rows and columns. Here’s what the editor looks like without any makeup:
Here’s what you’ll see when you add a new block to one of your posts or pages:
While the functionality of each block is different, adding and editing them usually works much the same. The problem is, at the moment, the Block Editor is still relatively new – so the selection of blocks at your disposal isn’t too impressive right now.
Of course, the collection of blocks available to you will surely increase over time. WordPress’ core will add new elements, and plugin developers will fill in the blanks (as they usually do). In fact, there are already a handful of plugins that add new blocks to the Block Editor, including Atomic Blocks and Stackable.
However, if there’s a particular block you’d like to utilize but can’t find, there’s only one option at your disposal – creating a custom block you can use with the Gutenberg Editor.
How to manually create custom blocks (in 2 steps)
The Gutenberg Editor’s Block API is the tool you’re going to need. In this section, I’ll help you set up a new plugin to add a block to your editor. To do so, all you’ll need are two files (and some code).
Step 1: Create a plugin to call up your block files
The cleanest way to create a custom Gutenberg Editor block is by setting up a plugin that ‘enqueues’ or calls up your block scripts, and adds them to the editor.
To get started, access your website via SFTP using a client such as FileZilla. Once you’re in, navigate to your WordPress root folder and into the wp-content/plugins directory. Inside, you’ll find folders for all the plugins on your website:
Now, right-click anywhere you want within the directory and create a new folder. I’ll call mine test-block, but yours can be relevant to you:
Open the folder, create a new plugin.php file (which can be given a more relevant name), then open the empty file, and add the following code:
<?php
/**
* Plugin Name: Test Plugin
* Author: John Doe
* Version: 1.0.0
*/
function loadMyBlock() {
wp_enqueue_script(
'my-new-block',
plugin_dir_url(__FILE__) . 'test-block.js',
array('wp-blocks','wp-editor'),
true
);
}
add_action('enqueue_block_editor_assets', 'loadMyBlock');
This creates a function to enqueue your block script – test-block.js, in this case. Of course, this file doesn’t exist yet (but will soon).
In addition, the function also includes two script dependencies – wp-blocks and wp-editor. The former handles block registration among other functionality, whereas wp-editor includes several basic components you might need, such as Rich Text.
Step 2: Register your block and configure its attributes
With the PHP file ready, it’s time to set up the test-block.js JavaScript file. Go ahead and create this file within the same plugin directory as plugin.php:
When the file is ready, open it using a text editor, and prepare to code! This example is a very simple block to let you add a text box with a border to your pages:
/* This section of the code registers a new block, sets an icon and a category, and indicates what type of fields it'll include. */
wp.blocks.registerBlockType('brad/border-box', {
title: 'Simple Box',
icon: 'smiley',
category: 'common',
attributes: {
content: {type: 'string'},
color: {type: 'string'}
},
/* This configures how the content and color fields will work, and sets up the necessary elements */
edit: function(props) {
function updateContent(event) {
props.setAttributes({content: event.target.value})
}
function updateColor(value) {
props.setAttributes({color: value.hex})
}
return React.createElement(
"div",
null,
React.createElement(
"h3",
null,
"Simple Box"
),
React.createElement("input", { type: "text", value: props.attributes.content, onChange: updateContent }),
React.createElement(wp.components.ColorPicker, { color: props.attributes.color, onChangeComplete: updateColor })
);
},
save: function(props) {
return wp.element.createElement(
"h3",
{ style: { border: "3px solid " + props.attributes.color } },
props.attributes.content
);
}
})
As you can see, this uses JavaScript with React to set everything up. I also added a couple of comments to the code, but to summarize, it registers and configures the basic block attributes. After the initial section, I configured the way the fields would work. This example included a text field and a color picker for the border.
After saving the test-block.js file, activate the plugin from within WordPress:
Next, open the Block Editor and add a new block in order to check how it displays:
Here’s what the block’s interface looks like:
This simple block comprises of the most important fundamentals to take forward into your own projects. Of course, you can make your blocks as simple or complex as you want, but broadly speaking, this is all you need to publish a block.
However, getting to the publishing stage will require you to develop your coding skills. For example, you’ll want to brush up on your JavaScript, since the Block Editor uses the language extensively. It’s a bit of a change from working mostly with PHP, but you can do some equally great stuff, and maybe more!
2 plugins you can use to create custom blocks
Learning how to manually create custom blocks is great if you want to understand how the Block API works. However, there are WordPress plugins you can use to help you create blocks more quickly. Here are two top contenders!
1. Block Lab
Simply put, Block Lab enables you to create custom blocks directly from your WordPress dashboard. The plugin lets you set up as many blocks as you like, and you can set a name, category, icon, description, and indicate what fields you want to include for each of them.
However, be aware that you still need to do some light coding to set up each block’s template. Even so, you do get to skip most of the legwork of registering each block and enqueueing its script.
2. Lazy Blocks
If you’d rather not deal with any code at all, Lazy Blocks might be up your alley. This plugin enables you to create custom blocks using a list of pre-built elements, including text, password, and image fields, as well as color and date pickers, among others.
The selection of useable elements is broad enough that you can put together some cool blocks, but if you want to create something highly specific, you’ll likely be better served with a more advanced solution.
Conclusion
If you’ve been using WordPress for a while, chances are you’ve tried to expand the now Classic Editor’s functionality with plugins. Creating custom Block Editor elements is a similar situation, only there are new tools and languages to leverage. In any case, extending what the editor can do has a lot of potential to make your work easier, so it’s worth exploring your options.
You can boil down the process of creating a custom Block Editor block to two steps:
- Create a plugin that calls up your block’s JavaScript.
- Use a JavaScript file to register your new block and set its attributes.
And remember, always use a test environment like Local to safely experiment away from your live site!
What’s next?
Create and test your custom Gutenberg blocks with Local for free!
Learn more about Local here!
Do you have any questions about how to set up custom Block Editor blocks? Ask away in the comments section below!
Comments ( 178 )
FrankieLar
May 14, 2025
https://tadalaccess.com/# how much does cialis cost per pill
Scottdroca
May 14, 2025
cialis online without prescription: what cialis - cialis 20mg for sale
Lorenhag
May 14, 2025
where can i buy cialis: TadalAccess - cialis wikipedia
JosephTes
May 14, 2025
india pharmacy cialis [url=https://tadalaccess.com/#]Tadal Access[/url] cialis not working
FrankieLar
May 14, 2025
https://tadalaccess.com/# were can i buy cialis
RogerCouct
May 13, 2025
http://clomhealth.com/# can i get generic clomid online
MatthewTom
May 13, 2025
order cheap clomid no prescription [url=https://clomhealth.com/#]Clom Health[/url] get clomid tablets
Oscargef
May 13, 2025
how can i get generic clomid price: can you buy generic clomid online - how can i get clomid without a prescription
Russellfeeve
May 13, 2025
buy clomid: cost generic clomid no prescription - cost of cheap clomid tablets
RogerCouct
May 13, 2025
https://amohealthcare.store/# Amo Health Care
MatthewTom
May 13, 2025
prednisone capsules [url=https://prednihealth.shop/#]PredniHealth[/url] PredniHealth
Oscargef
May 13, 2025
Amo Health Care: amoxicillin discount - generic amoxicillin over the counter
Russellfeeve
May 13, 2025
prednisone 2 mg daily: PredniHealth - 60 mg prednisone daily
RogerCouct
May 13, 2025
http://prednihealth.com/# 10 mg prednisone
MatthewTom
May 13, 2025
can i order generic clomid online [url=https://clomhealth.com/#]where can i buy cheap clomid pill[/url] clomid buy
Russellfeeve
May 13, 2025
Amo Health Care: Amo Health Care - how to get amoxicillin over the counter
Oscargef
May 13, 2025
PredniHealth: PredniHealth - where can i get prednisone over the counter
RogerCouct
May 13, 2025
https://prednihealth.com/# PredniHealth
JudsonZoown
May 13, 2025
how to buy clomid without prescription: order generic clomid no prescription - can you get clomid for sale
Russellfeeve
May 13, 2025
can you get cheap clomid price: Clom Health - where can i buy cheap clomid without rx
Oscargef
May 12, 2025
prednisone pak: buy prednisone 20mg - PredniHealth
RogerCouct
May 12, 2025
https://clomhealth.shop/# cheap clomid price
JudsonZoown
May 12, 2025
prednisone cream: prednisone brand name - PredniHealth
Russellfeeve
May 12, 2025
where can you buy amoxicillin over the counter: Amo Health Care - buying amoxicillin online
MatthewTom
May 12, 2025
PredniHealth [url=http://prednihealth.com/#]PredniHealth[/url] PredniHealth
Oscargef
May 12, 2025
can i buy amoxicillin over the counter: buy amoxicillin from canada - Amo Health Care
RogerCouct
May 12, 2025
https://amohealthcare.store/# Amo Health Care
JudsonZoown
May 12, 2025
cost of clomid without a prescription: Clom Health - how can i get cheap clomid price
Russellfeeve
May 12, 2025
Amo Health Care: amoxicillin brand name - amoxicillin 500mg price canada
Oscargef
May 12, 2025
can i buy cheap clomid without dr prescription: Clom Health - can i get cheap clomid prices
MatthewTom
May 12, 2025
Amo Health Care [url=https://amohealthcare.store/#]amoxicillin 500mg no prescription[/url] amoxicillin for sale online
RogerCouct
May 12, 2025
http://clomhealth.com/# order clomid without a prescription
JudsonZoown
May 12, 2025
PredniHealth: PredniHealth - prednisone 10 mg over the counter
Oscargef
May 12, 2025
can you buy prednisone over the counter in canada: prednisone pharmacy prices - PredniHealth
RogerCouct
May 12, 2025
http://prednihealth.com/# PredniHealth
MatthewTom
May 12, 2025
PredniHealth [url=https://prednihealth.shop/#]online prednisone 5mg[/url] PredniHealth
JudsonZoown
May 12, 2025
where to buy cheap clomid without rx: Clom Health - clomid pill
Russellfeeve
May 12, 2025
can i order cheap clomid tablets: Clom Health - how to get generic clomid online
LorenzoBlize
May 11, 2025
reliable online pharmacy Cialis [url=https://zipgenericmd.com/#]FDA approved generic Cialis[/url] best price Cialis tablets
Jeremyfax
May 11, 2025
best price Cialis tablets: generic tadalafil - Cialis without prescription
Albertoseino
May 11, 2025
secure checkout Viagra: order Viagra discreetly - buy generic Viagra online
LorenzoBlize
May 11, 2025
best price Cialis tablets [url=https://zipgenericmd.com/#]buy generic Cialis online[/url] best price Cialis tablets
RonaldFOEFS
May 11, 2025
https://maxviagramd.com/# fast Viagra delivery
Albertoseino
May 10, 2025
doctor-reviewed advice: modafinil 2025 - modafinil legality
RobertKet
May 10, 2025
reliable online pharmacy Cialis: buy generic Cialis online - affordable ED medication
Albertoseino
May 10, 2025
FDA approved generic Cialis: generic tadalafil - online Cialis pharmacy
Albertoseino
May 10, 2025
Cialis without prescription: buy generic Cialis online - Cialis without prescription
RonaldFOEFS
May 10, 2025
http://zipgenericmd.com/# buy generic Cialis online
Albertoseino
May 10, 2025
affordable ED medication: best price Cialis tablets - buy generic Cialis online
Jeremyfax
May 10, 2025
affordable ED medication: discreet shipping ED pills - buy generic Cialis online
RonaldFOEFS
May 9, 2025
https://zipgenericmd.shop/# buy generic Cialis online
Albertoseino
May 9, 2025
best price for Viagra: no doctor visit required - legit Viagra online
LorenzoBlize
May 9, 2025
modafinil 2025 [url=https://modafinilmd.store/#]modafinil 2025[/url] legal Modafinil purchase
RonaldFOEFS
May 9, 2025
https://zipgenericmd.shop/# affordable ED medication
Albertoseino
May 9, 2025
purchase Modafinil without prescription: modafinil legality - modafinil 2025
LorenzoBlize
May 9, 2025
buy generic Viagra online [url=https://maxviagramd.shop/#]generic sildenafil 100mg[/url] fast Viagra delivery
Jeremyfax
May 9, 2025
modafinil 2025: doctor-reviewed advice - safe modafinil purchase
RobertKet
May 9, 2025
Viagra without prescription: fast Viagra delivery - buy generic Viagra online
RonaldFOEFS
May 9, 2025
https://maxviagramd.com/# safe online pharmacy
Albertoseino
May 9, 2025
doctor-reviewed advice: modafinil 2025 - verified Modafinil vendors
RobertKet
May 9, 2025
safe modafinil purchase: purchase Modafinil without prescription - modafinil pharmacy
Jeremyfax
May 9, 2025
same-day Viagra shipping: cheap Viagra online - Viagra without prescription
LorenzoBlize
May 9, 2025
modafinil pharmacy [url=http://modafinilmd.store/#]safe modafinil purchase[/url] modafinil pharmacy
RonaldFOEFS
May 9, 2025
https://modafinilmd.store/# modafinil legality
ZackaryCaush
May 8, 2025
http://pinuprus.pro/# pin up вход
ZackaryCaush
May 6, 2025
https://vavadavhod.tech/# вавада официальный сайт
Richardmat
May 6, 2025
pin up az [url=https://pinupaz.top/#]pin up[/url] pin-up
Richardmat
May 6, 2025
вавада официальный сайт [url=https://vavadavhod.tech/#]вавада[/url] vavada casino
Richardmat
May 5, 2025
пин ап казино официальный сайт [url=https://pinuprus.pro/#]pin up вход[/url] пин ап казино официальный сайт
ZackaryCaush
May 4, 2025
http://pinuprus.pro/# пин ап казино
Richardmat
May 3, 2025
pin up az [url=http://pinupaz.top/#]pinup az[/url] pin-up
ZackaryCaush
May 2, 2025
http://vavadavhod.tech/# вавада
ZackaryCaush
May 2, 2025
https://pinuprus.pro/# pin up вход
Richardmat
May 1, 2025
pin up casino [url=http://pinupaz.top/#]pin up az[/url] pin-up casino giris
ZackaryCaush
May 1, 2025
http://pinuprus.pro/# pin up вход
Kennethsheby
April 30, 2025
вавада зеркало: вавада официальный сайт - vavada
Richardmat
April 30, 2025
вавада официальный сайт [url=https://vavadavhod.tech/#]вавада официальный сайт[/url] вавада казино
ZackaryCaush
April 30, 2025
http://pinuprus.pro/# пин ап вход
ElmerSip
April 30, 2025
pin up casino: pin up az - pin-up
Kennethsheby
April 30, 2025
вавада: вавада зеркало - vavada casino
Richardmat
April 30, 2025
пинап казино [url=https://pinuprus.pro/#]пин ап казино[/url] пинап казино
ZackaryCaush
April 30, 2025
http://vavadavhod.tech/# вавада
Kennethsheby
April 30, 2025
вавада: vavada - вавада казино
Richardmat
April 30, 2025
pinup az [url=https://pinupaz.top/#]pin-up casino giris[/url] pin up azerbaycan
ZackaryCaush
April 30, 2025
http://pinuprus.pro/# пин ап вход
Kennethsheby
April 30, 2025
вавада: вавада зеркало - вавада официальный сайт
Richardmat
April 30, 2025
pin up вход [url=http://pinuprus.pro/#]пин ап зеркало[/url] пин ап казино официальный сайт
ZackaryCaush
April 30, 2025
http://vavadavhod.tech/# вавада казино
ElmerSip
April 30, 2025
пин ап вход: пин ап вход - пин ап вход
Kennethsheby
April 30, 2025
пин ап казино официальный сайт: pin up вход - пин ап казино официальный сайт
Richardmat
April 30, 2025
пин ап казино официальный сайт [url=http://pinuprus.pro/#]пин ап вход[/url] пин ап вход
MichaelFaulp
April 30, 2025
Medicine From India: indian pharmacy - Medicine From India
Michaeljouch
April 29, 2025
Medicine From India [url=https://medicinefromindia.shop/#]indian pharmacy online[/url] indian pharmacy online
Dannysit
April 29, 2025
pharmacy rx world canada: ExpressRxCanada - canadian medications
Stevendrype
April 29, 2025
canadian drugstore online: ExpressRxCanada - drugs from canada
Dannysit
April 29, 2025
canada drugs online: ExpressRxCanada - best canadian pharmacy to order from
Stevendrype
April 29, 2025
MedicineFromIndia: indian pharmacy online - Medicine From India
Michaeljouch
April 29, 2025
mexican rx online [url=http://rxexpressmexico.com/#]mexico drug stores pharmacies[/url] Rx Express Mexico
Dannysit
April 29, 2025
canadapharmacyonline: Canadian pharmacy shipping to USA - my canadian pharmacy
Stevendrype
April 29, 2025
mexican online pharmacy: mexican rx online - mexican online pharmacy
Michaeljouch
April 29, 2025
Medicine From India [url=https://medicinefromindia.shop/#]indian pharmacy online[/url] Medicine From India
MichaelFaulp
April 29, 2025
canadian pharmacy online: Buy medicine from Canada - cheap canadian pharmacy online
Walterhap
April 29, 2025
http://expressrxcanada.com/# canadian pharmacy 24h com
Dannysit
April 29, 2025
pharmacy website india: MedicineFromIndia - indian pharmacy online
Stevendrype
April 29, 2025
canadian pharmacies: Generic drugs from Canada - canadian world pharmacy
Michaeljouch
April 29, 2025
medication from mexico pharmacy [url=http://rxexpressmexico.com/#]mexico pharmacies prescription drugs[/url] mexico drug stores pharmacies
MichaelFaulp
April 29, 2025
RxExpressMexico: mexico pharmacies prescription drugs - mexico drug stores pharmacies
Walterhap
April 29, 2025
http://expressrxcanada.com/# canadian pharmacy checker
Dannysit
April 29, 2025
indian pharmacy: indian pharmacy online - indian pharmacy online
Stevendrype
April 29, 2025
canadian pharmacy world reviews: Buy medicine from Canada - legit canadian online pharmacy
Michaeljouch
April 28, 2025
Rx Express Mexico [url=http://rxexpressmexico.com/#]mexican online pharmacy[/url] Rx Express Mexico
MichaelFaulp
April 28, 2025
canadian pharmacy near me: Canadian pharmacy shipping to USA - canada pharmacy 24h
Walterhap
April 28, 2025
https://rxexpressmexico.com/# medication from mexico pharmacy
Stevendrype
April 28, 2025
indian pharmacy online: medicine courier from India to USA - indian pharmacy online
Dannysit
April 28, 2025
canada drugs online reviews: Canadian pharmacy shipping to USA - best canadian pharmacy
MichaelFaulp
April 28, 2025
indian pharmacy: indian pharmacy online - MedicineFromIndia
Michaeljouch
April 28, 2025
canadian pharmacy 365 [url=https://expressrxcanada.com/#]Express Rx Canada[/url] buy canadian drugs
Dannysit
April 28, 2025
canada pharmacy 24h: Canadian pharmacy shipping to USA - canadian 24 hour pharmacy
Stevendrype
April 28, 2025
best canadian online pharmacy reviews: ExpressRxCanada - adderall canadian pharmacy
Walterhap
April 28, 2025
http://expressrxcanada.com/# prescription drugs canada buy online
MichaelFaulp
April 28, 2025
RxExpressMexico: mexican online pharmacy - mexico pharmacy order online
Dannysit
April 28, 2025
Rx Express Mexico: mexico pharmacies prescription drugs - Rx Express Mexico
Walterhap
April 28, 2025
https://medicinefromindia.com/# top online pharmacy india
Stevendrype
April 28, 2025
canadian pharmacy oxycodone: Canadian pharmacy shipping to USA - onlinecanadianpharmacy 24
Michaeljouch
April 28, 2025
Medicine From India [url=https://medicinefromindia.shop/#]MedicineFromIndia[/url] indian pharmacy
Bradleyfup
April 28, 2025
Acheter Kamagra site fiable: kamagra oral jelly - kamagra gel
PeterUnomb
April 28, 2025
pharmacie en ligne pas cher [url=http://pharmafst.com/#]Livraison rapide[/url] Achat mГ©dicament en ligne fiable pharmafst.shop
BernardVeida
April 28, 2025
Tadalafil 20 mg prix sans ordonnance: Acheter Viagra Cialis sans ordonnance - Cialis sans ordonnance pas cher tadalmed.shop
BilliesniCt
April 28, 2025
kamagra livraison 24h: kamagra pas cher - kamagra oral jelly
Robertmut
April 27, 2025
http://kamagraprix.com/# acheter kamagra site fiable
Robertmut
April 27, 2025
https://kamagraprix.com/# kamagra livraison 24h
PeterUnomb
April 27, 2025
kamagra 100mg prix [url=https://kamagraprix.com/#]Kamagra Commander maintenant[/url] Achetez vos kamagra medicaments
Bradleyfup
April 27, 2025
Kamagra pharmacie en ligne: kamagra gel - kamagra en ligne
PeterUnomb
April 26, 2025
kamagra livraison 24h [url=https://kamagraprix.shop/#]kamagra en ligne[/url] kamagra livraison 24h
BilliesniCt
April 26, 2025
vente de mГ©dicament en ligne: Meilleure pharmacie en ligne - acheter mГ©dicament en ligne sans ordonnance pharmafst.com
Bradleyfup
April 26, 2025
Kamagra Oral Jelly pas cher: kamagra pas cher - kamagra en ligne
BernardVeida
April 26, 2025
pharmacie en ligne france livraison internationale: pharmacie en ligne pas cher - pharmacie en ligne avec ordonnance pharmafst.com
Robertmut
April 26, 2025
https://kamagraprix.com/# Kamagra Oral Jelly pas cher
BilliesniCt
April 26, 2025
cialis prix: cialis prix - cialis generique tadalmed.shop
Bradleyfup
April 26, 2025
Pharmacie Internationale en ligne: pharmacie en ligne pas cher - pharmacie en ligne livraison europe pharmafst.com
PeterUnomb
April 26, 2025
cialis sans ordonnance [url=http://tadalmed.com/#]Tadalafil 20 mg prix sans ordonnance[/url] Cialis sans ordonnance 24h tadalmed.com
Robertmut
April 26, 2025
http://pharmafst.com/# vente de mГ©dicament en ligne
BernardVeida
April 26, 2025
Kamagra Oral Jelly pas cher: kamagra gel - achat kamagra
BilliesniCt
April 26, 2025
Pharmacie en ligne livraison Europe: pharmacie en ligne - pharmacie en ligne fiable pharmafst.com
BernardVeida
April 25, 2025
Pharmacie en ligne Cialis sans ordonnance: Achat Cialis en ligne fiable - Tadalafil achat en ligne tadalmed.shop
PeterUnomb
April 25, 2025
pharmacie en ligne livraison europe [url=https://pharmafst.shop/#]Pharmacie en ligne France[/url] pharmacie en ligne france livraison belgique pharmafst.shop
BernardVeida
April 25, 2025
pharmacie en ligne livraison europe: pharmacie en ligne sans ordonnance - pharmacie en ligne pas cher pharmafst.com
Robertmut
April 25, 2025
https://tadalmed.com/# Cialis sans ordonnance 24h
BilliesniCt
April 25, 2025
acheter kamagra site fiable: kamagra livraison 24h - kamagra en ligne
PeterUnomb
April 25, 2025
acheter mГ©dicament en ligne sans ordonnance [url=https://pharmafst.shop/#]Pharmacie en ligne France[/url] Pharmacie en ligne livraison Europe pharmafst.shop
Robertmut
April 25, 2025
https://pharmafst.com/# Pharmacie en ligne livraison Europe
Bradleyfup
April 25, 2025
Tadalafil 20 mg prix en pharmacie: Cialis sans ordonnance 24h - Tadalafil achat en ligne tadalmed.shop
BilliesniCt
April 25, 2025
pharmacie en ligne pas cher: Pharmacie en ligne France - Pharmacie Internationale en ligne pharmafst.com
PeterUnomb
April 25, 2025
pharmacie en ligne fiable [url=https://pharmafst.com/#]pharmacie en ligne pas cher[/url] acheter mГ©dicament en ligne sans ordonnance pharmafst.shop
BernardVeida
April 25, 2025
pharmacie en ligne france livraison belgique: Meilleure pharmacie en ligne - pharmacie en ligne pas cher pharmafst.com
BernardVeida
April 25, 2025
pharmacie en ligne pas cher: Pharmacie en ligne France - pharmacie en ligne france livraison belgique pharmafst.com
DavidSaisp
April 24, 2025
achat kamagra: kamagra en ligne - kamagra gel
Drift Boss unblocked 66
April 18, 2025
drift boss new game site. thanks for article
https://drift-boss-76.github.io/
unblocked
March 21, 2025
It was amasing post. Lets try to plau unblocked games
https://unblocked.symbaloo.com/
unblocked games
March 18, 2025
thanks for details. Must visit unblocked web site
https://gogithub.xyz/
cookie clicker
March 17, 2025
thanks for all. Unblocked always good.
https://diepio.app/
unblocked games 76
March 17, 2025
thanks for all. Unblocked always good.
https://diepio.app/
livros de dark romances
March 11, 2025
You have a great site and content, I'm glad you liked it here. 71858114
https://livrodetodos.com.br
create a binance account
March 4, 2025
Your article helped me a lot, is there any more related content? Thanks!
livro antiotario
March 2, 2025
You have a great site and content, I'm glad you liked it here. 25502590
https://livroantiotario.com.br
unblocked 76
March 1, 2025
good post for unblocked games. thanks
https://unblocked-games-76.symbaloo.com
paper io 2 unblocked
February 26, 2025
paper.io unblocked games. thanks for your post
https://www.symbaloo.com/mix/paper-io-unblocked-here
Alex
August 21, 2020
Sad that is not working
james
October 23, 2019
Thanks for sharing this tutorial. Can you also please guide me how can I create a block template? I am doing the same using this resource https://wpitech.com/create-wordpress-gutenberg-block-templates/ but it’s giving an error and I am having some programming lines in front end. This is the code
add_action( ‘init’, function() {
$args = array(
‘public’ => true,
‘label’ => ‘News’,
‘show_in_rest’ => true,
‘template_lock’ => ‘all’,
‘template’ => array(
array( ‘core/paragraph’, array(
‘placeholder’ => ‘Breaking News’,
Rob
October 21, 2019
Hey, thanks for the Block Lab shout out. :)
We've been busy making the plugin even better, so if anyone has any questions, we'd love to help out.
Rushax
October 9, 2019
ACF now gives you the functionality to create custom Gutenberg blocks too.
Phuc Le
June 30, 2019
Nice tutorial, I am developing my custom gutenberg block but having problems to create a dropdown list with styles. I want to add the class to the container, depending on the chosen style.
Do you have any experience, how to create a dropdown list in the inspector in es5?
Alvina
June 25, 2019
Can you please guide me how can I create a block template as I have seen a tutorial https://www.cloudways.com/blog/create-wordpress-gutenberg-block-templates/ and trying to implement the same but I am having error in registering code
add_action( ‘init’, function() {
$args = array(
‘public’ => true,
‘label’ => ‘News’,
‘show_in_rest’ => true,
‘template_lock’ => ‘all’,
‘template’ => array(
array( ‘core/paragraph’, array(
‘placeholder’ => ‘Breaking News’,
) ),
array( ‘core/image’, array(
‘align’ => ‘right’,
) ),
),
);
} );
Can you please help me?
Valerie Way
June 5, 2019
Hello Will! Thanks for the to-the-point guide. Hopefully, my knowledge of WordPress will eventually evolve to let me build custom Gutenberg blocks (and your guide truly contributes to this a lot!)
But yes, as you stated above, the market of ready-made Gutenberg blocks plugin is expanding constantly so that no-novice-already-but still-not-savvy-enough users like me can still get some additional blocks. P.S. one that I currently use myself, except the ones mentioned, is Getwid plugin, 24 blocks as of now - https://wordpress.org/plugins/getwid/ (hopefully, this can be of use for someone too).
But surely, the ability to create one's own blocks truly gives you free rein, so thank you for bringing the knowledge to us!
Wayne
August 2, 2019
Yeah, it is really cool. This is my first time exploring blocks. But luckily I know React JS. So this makes life so sweet.
Karoliene
March 24, 2019
My first contact with Gutenberg wasn't promising, however after following this guide I find the new editor quite useful. It gives many additional features in comparison to the old one. It only requires some patience.
ghdsports
March 15, 2019
More of the people don't know how to create Gutenberg blocks in WordPress site. You made some nice points there and It’s an awesome piece of writing in favor of all the web people.
Rachel L. Green
March 14, 2019
Thanks for this awesome guide.
This guide helps me a lot in creating Gutenberg blocks on my website.
Again thanks a lot.
شرکت حسابداری
March 7, 2019
i realy happy to see wordpress grown fast soon . in drupal and joomla hav a free page builder and huge config it's too wordpress and grow fast with gutenberg