<\/span><\/h3>\n\n\n\nThe Gutenberg block editor allows you to easily edit the content of blocks you’ve added. Simply click on the block content, a block toolbar will appear automatically, allowing you to make further adjustments as needed.<\/p>\n\n\n\nFor example, if you’ve added a table block in Gutenberg, you can customize it further by adjusting text alignment and adding or removing rows and columns.<\/p>\n\n\n\n
<\/span>How to Arrange Blocks<\/span><\/h3>\n\n\n\nRearranging the blocks is the primary action that you will be doing on the Gutenberg editor. To rearrange blocks in the Gutenberg editor, you can simply click on the six-dot icon and drag the block to your desired position.<\/p>\n\n\n\nAdditionally, you can group multiple blocks together by selecting them, then clicking the group icon. Once grouped, you can move the entire group as a single unit, allowing for more organized and efficient arrangement of content.<\/p>\n\n\n\n
<\/span>How to Group Multiple Blocks <\/span><\/h3>\n\n\n\nLet’s say you’re setting up a Testimonials section on a homepage. Here, you aim to display multiple testimonials, each containing a quote from a client, their name, and their position or company. Grouping blocks can assist in organizing each testimonial seamlessly.<\/p>\n\n\n\n
Create intended nested blocks by grouping multiple elements. These blocks are the blocks placed inside the parent block which creates a structured layout. <\/p>\n\n\n\n
For instance, a column block can be a parent containing other blocks like texts and images. <\/p>\n\n\n\n
Let’s illustrate using the column block as an example: <\/p>\n<\/div>\n\n\n\n
\nOpen the Block inserter > Design > Column.<\/strong><\/li>\n\n\n\nAdd the desired column you want to configure. <\/li>\n<\/ul>\n\n\n\n\nThen, click on the “+”<\/strong> sign to add more block to each column. <\/li>\n<\/ul>\n\n\n\n\n
After grouping the blocks, you can adjust how they look together. You can do this by using the alignment options in the toolbar or by going to the block settings on the side of the editor. <\/p>\n\n\n\n
Inside these settings, there’s a checkbox labeled “Inner blocks use content width.” This option helps ensure that the grouped blocks fit neatly within the overall layout of your page. You can turn this option on or off depending on how you want your content to appear.<\/p>\n\n\n\n
<\/span>How to Add Heading and Text <\/span><\/h3>\n\n\n\nTo make your post or page more engaging, you’ll need to include paragraphs and headings. With Gutenberg blocks, adding headings and writing paragraphs is easy, allowing you to create compelling articles or blog posts effortlessly. <\/p>\n\n\n\n
The easy way to start with your content is start writing as a paragraph or open the block inserter<\/strong> and add a Paragraph<\/strong>. <\/p>\n\n\n\nThis block allows you to further add footnotes, add subscript or superscript according to the need of your content. <\/p>\n\n\n\n
To ensure user engagement with your content, using a Heading<\/strong> block helps separate and organize the post\/page, making it more structured and appealing. You can choose from heading H1-H6, to match the need of your contents.<\/p>\n\n\n\n<\/span>How to Add Images and Media <\/span><\/h3>\n\n\n\nAdding images, videos, and other media to your content can enhance engagement and understanding among your target audience. To add such media, Gutenberg block editor has a separate Media section from where you can add what you want. It offers dynamic content block like:<\/p>\n\n\n\n
\nMedia and Text: This block allows the users to add images along with the text for a more comprehensive learning. <\/li>\n\n\n\n Image Gallery: This section allows one to add multiple images to the content. <\/li>\n\n\n\n Cover: A distinctive block for superimposing text on images or videos, ideal for crafting visually striking headers or focal points.<\/li>\n<\/ul>\n\n\n\nTo add images, select the Image<\/strong> block and add Upload<\/strong> the medias that you have saved in your device. <\/p>\n<\/div>\n\n\n\n<\/span>How to Embed Media<\/span><\/h3>\n\n\n\nWordPress supports embedding content from external sources such as tweets from Twitter, posts from Instagram or Facebook, maps from Google Maps, and more. Simply paste the URL of the content you want to embed, and WordPress will handle the rest.<\/p>\n\n\n\n
To embed media into your content:<\/p>\n\n\n\n
\nOpen the Block inserter<\/strong> > Embeds<\/strong>.<\/li>\n\n\n\nClick on the social media of the link which you want to add. <\/li>\n\n\n\n Paste the link and click on save changes. <\/li>\n<\/ul>\n\n\n\n<\/span>How to Create Synced Patterns <\/span><\/h3>\n\n\n\nCreating synced patterns are the reusable blocks which you can use to use it throughout the content to make sure that all your contents and pages align in the same pattern. <\/p>\n\n\n\n
Follow these simple steps to create a synced pattern: <\/p>\n\n\n\n
\nSelect the section of which you want to create a synced pattern. <\/li>\n\n\n\n Click on the three dots and then select Create Patterns. <\/li>\n<\/ul>\n\n\n\n\nName the pattern and make sure that you toggle the Synced option so that it synchronizes to every post that it is applied. Then click Create<\/strong>. <\/li>\n<\/ul>\n\n\n\nTo utilize a pattern you’ve created, navigate to the block inserter<\/strong>. From there, select Patterns.<\/strong> Here, you’ll find all the patterns you’ve previously crafted. You can then choose the desired pattern and apply it to any post or page within your WordPress site. <\/p>\n\n\n\n<\/span>How to Use the Block List View <\/span><\/h3>\n\n\n\nThe block list view gives you a neat list of all the different content blocks you’ve put into your post or page. This helps you arrange them just the way you want, making it easier to work with your content, especially when you have lots of different blocks stacked up or nested inside each other.<\/p>\n\n\n\n
To access the block list view, simply click on the icon with three horizontal lines stacked on top of each other, located at the top-left corner of the editor. <\/p>\n\n\n\n
Every block in the pattern is clickable which takes you to the blocks where you can make the changes when necessary in more convenient way. <\/p>\n\n\n\nNext to the list view, you’ll find an outline section that displays the structure of your content based on headings. This feature helps you ensure that your headings match the actual content of your post or page. If a heading doesn’t correspond correctly to the content outline, you can easily identify and correct it.<\/p>\n\n\n\n<\/span>Conclusion <\/span><\/h2>\n\n\n\nIn summary, Gutenberg block editor is a game-changer for WordPress editing. It offers an easy way to add and customize content blocks like text, images, and videos, making website creation simpler and more flexible. With features like saving custom blocks and creating synced patterns, Gutenberg ensures consistency across your site. Plus, tools like the block list view and content outline help you stay organized while editing. Gutenberg makes it easy for anyone to design a beautiful website and share their ideas online.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
Shifting the methods by which users generate content, whether through articles, blogs, or websites, the Gutenberg Block Editor has significantly simplified the process of crafting compelling content. Introduced in the 5.0 update, it has taken over from the classic editor as the default WordPress editor. Gutenberg is a block-based editor introduced by WordPress that revolutionizes […]<\/p>\n","protected":false},"author":772,"featured_media":55956,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"footnotes":"[]"},"categories":[10,36],"tags":[],"class_list":["post-54403","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-article-board","category-beginners-guide"],"_links":{"self":[{"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/posts\/54403","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/users\/772"}],"replies":[{"embeddable":true,"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/comments?post=54403"}],"version-history":[{"count":1,"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/posts\/54403\/revisions"}],"predecessor-version":[{"id":59128,"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/posts\/54403\/revisions\/59128"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/media\/55956"}],"wp:attachment":[{"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/media?parent=54403"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/categories?post=54403"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hashthemes.com\/wp-json\/wp\/v2\/tags?post=54403"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}