{"id":4906,"date":"2020-04-17T11:05:36","date_gmt":"2020-04-17T15:05:36","guid":{"rendered":"https:\/\/blog.uvm.edu\/manual-test\/?page_id=4906"},"modified":"2026-06-23T16:54:52","modified_gmt":"2026-06-23T20:54:52","slug":"getting-started","status":"publish","type":"page","link":"https:\/\/blog.uvm.edu\/manual\/getting-started\/","title":{"rendered":"Getting started"},"content":{"rendered":"\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-atomic-blocks-ab-columns ab-layout-columns-2 ab-2-col-wideright\"><div class=\"ab-layout-column-wrap ab-block-layout-column-gap-2 ab-is-responsive-column\">\n<div class=\"wp-block-atomic-blocks-ab-column ab-block-layout-column ab-is-vertically-aligned-top\"><div class=\"ab-block-layout-column-inner\">\n<h4 class=\"wp-block-heading\">Getting started with Gutenberg WordPress<\/h4>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-atomic-blocks-ab-column ab-block-layout-column\"><div class=\"ab-block-layout-column-inner\">\n<p>If you are new to working in WordPress Gutenberg or not sure where to start, iThemes offers a fantastic&nbsp;<a href=\"https:\/\/ithemes.com\/wordpress-gutenberg-blocks-explained\/\">introduction to Gutenberg blocks<\/a>&nbsp;&#8211; what they are and how to work with them.<\/p>\n\n\n\n<p>There are so many great websites, blogs and video tutorials out there to learn WordPress. We see no reason to write redundant content. Our intention is to provide enough information to get you started but we will also reference relevant third-party tutorials and articles as appropriate.<\/p>\n<\/div><\/div>\n<\/div><\/div>\n\n\n\n<div style=\"height:48px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-atomic-blocks-ab-columns ab-layout-columns-2 ab-2-col-wideright\"><div class=\"ab-layout-column-wrap ab-block-layout-column-gap-2 ab-is-responsive-column\">\n<div class=\"wp-block-atomic-blocks-ab-column ab-block-layout-column ab-is-vertically-aligned-top\"><div class=\"ab-block-layout-column-inner\">\n<h4 class=\"wp-block-heading\">Working with Gutenberg blocks<\/h4>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-atomic-blocks-ab-column ab-block-layout-column\"><div class=\"ab-block-layout-column-inner\">\n<p>Blocks in WordPress are components the provide specific functionality and display of content. There are blocks for setting text as a paragraph, a headline, a block quote, or in columns. There are blocks that display your images as hero banners, background images or in galleries. <\/p>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>Here are a few of the most commonly used blocks available. <\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1007\" height=\"265\" src=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/gutenberg-wp-blocks.png\" alt=\"\" class=\"wp-image-4912\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/gutenberg-wp-blocks.png 1007w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/gutenberg-wp-blocks-300x79.png 300w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/gutenberg-wp-blocks-768x202.png 768w\" sizes=\"auto, (max-width: 1007px) 100vw, 1007px\" \/><\/figure>\n\n\n\n<p>We have styled all of these blocks to adopt the UVM brand.<\/p>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>To add a block to your page, while you are in edit mode, just click on the &#8220;+&#8221; symbol at the top left of your page. Blocks are divided into various categories to help you reference what you need. You can also search for a specific block via a text search. A preview of the block  shows up on the right to help you identify what you are looking for in case the name of the block does not offer enough clarity.<\/p>\n\n\n\n<p>After clicking on the &#8220;+ symbol, the block will appear on your page where you can edit the content. If the block did not appear exactly where you want it on the page, you can change the order of the blocks by clicking on the up or down arrows that appear when you have the block activated. <\/p>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"858\" height=\"200\" src=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/training__up-down-block-arrows-2.jpg\" alt=\"\" class=\"wp-image-4917\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/training__up-down-block-arrows-2.jpg 858w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/training__up-down-block-arrows-2-300x70.jpg 300w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/training__up-down-block-arrows-2-768x179.jpg 768w\" sizes=\"auto, (max-width: 858px) 100vw, 858px\" \/><\/figure>\n<\/div><\/div>\n<\/div><\/div>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-atomic-blocks-ab-columns ab-layout-columns-2 ab-2-col-wideright\"><div class=\"ab-layout-column-wrap ab-block-layout-column-gap-2 ab-is-responsive-column\">\n<div class=\"wp-block-atomic-blocks-ab-column ab-block-layout-column ab-is-vertically-aligned-top\"><div class=\"ab-block-layout-column-inner\">\n<h4 class=\"wp-block-heading\">Adding a ready-made section or layout<\/h4>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-atomic-blocks-ab-column ab-block-layout-column\"><div class=\"ab-block-layout-column-inner\">\n<p>In addition to the native blocks that come with WordPress, there are  some sample layouts and larger components (like block collections) made by the WordPress community at large to speed up your production time and help you get your site launched faster.<\/p>\n\n\n\n<p>To browse through these offerings, while. you are in edit mode on a page or post, select the &#8220;+&#8221; icon at the top of the page and then select &#8220;Patterns&#8221; and &#8220;All&#8221; to browser through the ready-made layout offerings. <\/p>\n\n\n\n<div style=\"height:48px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div style=\"height:48px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n<\/div><\/div>\n<\/div><\/div>\n\n\n\n<div style=\"height:120px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":5625,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-4906","page","type-page","status-publish","hentry"],"featured_image_src":null,"featured_image_src_square":null,"rttpg_featured_image_url":null,"rttpg_author":{"display_name":"Susan Mason Lazarev","author_link":"https:\/\/blog.uvm.edu\/manual\/author\/smasonla\/"},"rttpg_comment":0,"rttpg_category":null,"rttpg_excerpt":null,"_links":{"self":[{"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages\/4906","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/users\/5625"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/comments?post=4906"}],"version-history":[{"count":18,"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages\/4906\/revisions"}],"predecessor-version":[{"id":5658,"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages\/4906\/revisions\/5658"}],"wp:attachment":[{"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/media?parent=4906"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}