3. Just some
basics about
Wordpress
● Content Management System
● Good for blogs, eCommerce,
businesses and much more
● Easy to use, even for beginners.
● Fun fact: about 35% of all the
websites on the Internet are
powered by wordpress
4. The old editor
● Classic
● Has a lot of advocates
● Text based WYSIWYG editor
● No visual editing experience
5. The new editor:
Gutenberg
● Comes with block layout
● More flexible when creating a
page/post
● Allows developer to create
custom features
9. What’s the point in them ?
● By default there are the basics: paragraphs, headings,
buttons, images etc.
● With custom blocks you can create anything you
want!
WOW
!
11. Demo
● Let’s create an image of a person with a colorful block
attached to it with the name of the person.
● How is this possible ?
12. Demo
First we need to register the
custom block we want to
create in the functions.php file
13. Demo
● After registering the block, we
can go to the wordpress admin
panel, choose Custom Fields
and create a new one
● Here you can add fields to your
custom block
● Be sure to select in Location
that block is equals to the block
you just registered in the
functions.php file
14. Demo
● Now we need to create the
template that will render our
custom block.
● Create a new file, with the
same name as your custom
block
● Get the field you just created
and add them to the template
15. Demo
● You will now find your custom
block in the Gutenberg editor
blocks
● Now you can add your image
of choosing and the name of
the person!
● Publish the page, add some css
and you’re done!