{"id":1118,"date":"2026-07-31T16:47:21","date_gmt":"2026-07-31T16:47:21","guid":{"rendered":"https:\/\/www.mtsu.edu\/style-guide\/?page_id=1118"},"modified":"2026-08-20T03:30:01","modified_gmt":"2026-08-20T03:30:01","slug":"working-with-blocks","status":"publish","type":"page","link":"https:\/\/www.mtsu.edu\/web-training\/getting-started-with-wordpress\/working-with-blocks\/","title":{"rendered":"Working with Blocks"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Now that you&#8217;ve learned how to edit content, it&#8217;s time to learn how WordPress organizes content using blocks.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Learning Objectives<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">After completing this module, you will be able to:<\/p>\n\n\n\n<ul class=\"wp-block-list is-style-compact-list\">\n<li>Understand what blocks are and how they work<\/li>\n\n\n\n<li>Add new blocks to a page<\/li>\n\n\n\n<li>Search for available blocks<\/li>\n\n\n\n<li>Rearrange blocks within a layout<\/li>\n\n\n\n<li>Access common block settings<\/li>\n\n\n\n<li>Locate additional block documentation<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-gray-color has-alpha-channel-opacity has-gray-background-color has-background is-style-wide\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">What Are Blocks?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Blocks are the individual content elements that make up a page. Everything from a paragraph to an image, button, or accordion is added using a block.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Common examples include:<\/p>\n\n\n\n<ul class=\"wp-block-list is-style-columns-two-compact\">\n<li>Heading<\/li>\n\n\n\n<li>Paragraph<\/li>\n\n\n\n<li>Image<\/li>\n\n\n\n<li>Button<\/li>\n\n\n\n<li>List<\/li>\n\n\n\n<li>Group<\/li>\n\n\n\n<li>Columns<\/li>\n\n\n\n<li>Accordion<\/li>\n<\/ul>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Why Blocks Matter<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Blocks allow you to create structured, flexible content without needing to write code.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-gray-color has-alpha-channel-opacity has-gray-background-color has-background is-style-wide\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Understanding the Block Inserter<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The Block Inserter provides access to WordPress blocks, patterns, media, and MTSU-specific custom blocks.<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-7387b849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:70%\">\n<ul class=\"wp-block-list\">\n<li><strong>Blocks<\/strong>\n<ul class=\"wp-block-list is-style-compact-list\">\n<li>Browse and insert individual content blocks, such as headings, paragraphs, images, and buttons.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>Patterns<\/strong>\n<ul class=\"wp-block-list is-style-compact-list\">\n<li>Insert pre-designed layouts made up of multiple blocks.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>Media<\/strong>\n<ul class=\"wp-block-list is-style-compact-list\">\n<li>Access images and other media available for use on your page.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>Search<\/strong>\n<ul class=\"wp-block-list is-style-compact-list\">\n<li>Quickly locate a block by entering its name.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>MTS<\/strong>U Custom Blocks\n<ul class=\"wp-block-list is-style-compact-list\">\n<li>Access custom blocks created specifically for MTSU websites.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Adding a Block<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">To add a block:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Select the <strong>+ Block Inserter<\/strong>.<\/li>\n\n\n\n<li>Search for a block or browse the available options.<\/li>\n\n\n\n<li>Select the desired block.<\/li>\n\n\n\n<li>Add your content.<\/li>\n<\/ol>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"699\" height=\"827\" src=\"https:\/\/www.mtsu.edu\/style-guide\/wp-content\/uploads\/sites\/2\/2026\/07\/blockinserter.png\" alt=\"screenshot of block inserter\" class=\"wp-image-1230\" srcset=\"https:\/\/www.mtsu.edu\/web-training\/wp-content\/uploads\/sites\/2\/2026\/07\/blockinserter.png 699w, https:\/\/www.mtsu.edu\/web-training\/wp-content\/uploads\/sites\/2\/2026\/07\/blockinserter-254x300.png 254w\" sizes=\"auto, (max-width: 699px) 100vw, 699px\" \/><\/figure>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-gray-color has-alpha-channel-opacity has-gray-background-color has-background is-style-wide\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Moving and Rearranging Blocks<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-7387b849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\">Blocks can be reorganized at any time.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">To move a block:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Select the block.<\/li>\n\n\n\n<li>Use the <strong>Move Up<\/strong> or <strong>Move Down<\/strong> controls in the block toolbar.<\/li>\n\n\n\n<li>Or drag and drop the block to a new location within the page.<\/li>\n<\/ol>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p class=\"wp-block-paragraph\"><strong>Tip:<\/strong> Moving a block does not affect the content within the block. It only changes where the block appears on the page.<\/p>\n<\/blockquote>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"950\" height=\"120\" src=\"https:\/\/www.mtsu.edu\/style-guide\/wp-content\/uploads\/sites\/2\/2026\/07\/toolbar-move.png\" alt=\"move icon highlighted on block toolbar\" class=\"wp-image-1242\" style=\"aspect-ratio:7.917205770250306;width:308px;height:auto\" srcset=\"https:\/\/www.mtsu.edu\/web-training\/wp-content\/uploads\/sites\/2\/2026\/07\/toolbar-move.png 950w, https:\/\/www.mtsu.edu\/web-training\/wp-content\/uploads\/sites\/2\/2026\/07\/toolbar-move-300x38.png 300w, https:\/\/www.mtsu.edu\/web-training\/wp-content\/uploads\/sites\/2\/2026\/07\/toolbar-move-768x97.png 768w\" sizes=\"auto, (max-width: 950px) 100vw, 950px\" \/><\/figure>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-gray-color has-alpha-channel-opacity has-gray-background-color has-background is-style-wide\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Block Settings<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Many blocks include settings that allow you to customize their appearance, layout, and behavior. Available settings vary depending on the selected block.<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-7387b849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h3 class=\"wp-block-heading\">Opening the Settings Panel<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">If the Settings panel is not visible:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Select any block within the editor.<\/li>\n\n\n\n<li>Select the <strong>Settings<\/strong> icon in the upper-right corner of the editor. <\/li>\n\n\n\n<li>The Settings panel will open on the right side of the screen.<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">Accessing Block Settings<\/h3>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Select a block within the editor.<\/li>\n\n\n\n<li>Open the Settings panel if needed.<\/li>\n\n\n\n<li>Adjust the available settings.<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">Common Settings<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Depending on the selected block, you may see options for:<\/p>\n\n\n\n<ul class=\"wp-block-list is-style-compact-list\">\n<li>Alignment and layout<\/li>\n\n\n\n<li>Color and style settings<\/li>\n\n\n\n<li>Visibility and display options<\/li>\n\n\n\n<li>Links and button settings<\/li>\n\n\n\n<li>Spacing and sizing controls<\/li>\n<\/ul>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p class=\"wp-block-paragraph\">Available settings vary depending on the selected block. Refer to the Block Documentation Library for detailed information about specific blocks.<\/p>\n<\/blockquote>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"561\" height=\"977\" src=\"https:\/\/www.mtsu.edu\/style-guide\/wp-content\/uploads\/sites\/2\/2026\/07\/settingspanel.png\" alt=\"screenshot of settings panel\" class=\"wp-image-1294\" srcset=\"https:\/\/www.mtsu.edu\/web-training\/wp-content\/uploads\/sites\/2\/2026\/07\/settingspanel.png 561w, https:\/\/www.mtsu.edu\/web-training\/wp-content\/uploads\/sites\/2\/2026\/07\/settingspanel-172x300.png 172w\" sizes=\"auto, (max-width: 561px) 100vw, 561px\" \/><\/figure>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-gray-color has-alpha-channel-opacity has-gray-background-color has-background is-style-wide\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Block Documentation<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The Block Documentation Library is organized into <a href=\"https:\/\/www.mtsu.edu\/style-guide\/wordpress-blocks\/\" data-type=\"page\" data-id=\"771\"><strong>WordPress Core Blocks<\/strong><\/a> and <a href=\"https:\/\/www.mtsu.edu\/style-guide\/mtsu-custom-blocks\/\" data-type=\"page\" data-id=\"20\"><strong>MTSU Custom Blocks<\/strong><\/a>, making it easy to locate guidance for the block you&#8217;re using.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Use the library to learn:<\/p>\n\n\n\n<ul class=\"wp-block-list is-style-compact-list\">\n<li>When to use a specific block<\/li>\n\n\n\n<li>Available settings and configuration options<\/li>\n\n\n\n<li>Accessibility considerations<\/li>\n\n\n\n<li>Examples and best practices<\/li>\n<\/ul>\n\n\n\n<div class=\"wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-09d3b6f4 wp-block-group-is-layout-flex\">\n<i class=\"wp-block-mtsu-blocks-icon-block has-mtsublue-color has-text-color has-link-color far fa-lightbulb wp-elements-9bec766b7f7253a8a7fd83ec3c9c4738\" style=\"font-size:2em\"><\/i>\n\n\n\n<p class=\"wp-block-paragraph\"><em>You do not need to memorize every block. Focus on understanding how blocks work and use the documentation library when you need help with a specific block.<\/em><\/p>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-gray-color has-alpha-channel-opacity has-gray-background-color has-background is-style-wide\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Before Moving On<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-7fe1d597 wp-block-columns-is-layout-flex\" style=\"margin-top:var(--wp--preset--spacing--50)\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:15px\"><\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-container-core-column-is-layout-2130f694 wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<div class=\"wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-09d3b6f4 wp-block-group-is-layout-flex\">\n<i class=\"wp-block-mtsu-blocks-icon-block has-mtsublue-color has-text-color has-link-color far fa-circle-check wp-elements-1ee4c62a9b3eb8e7379e24cbf11bf756\" style=\"font-size:1em\"><\/i>\n\n\n\n<p class=\"wp-block-paragraph\">Add a block to a page<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-09d3b6f4 wp-block-group-is-layout-flex\">\n<i class=\"wp-block-mtsu-blocks-icon-block has-mtsublue-color has-text-color has-link-color far fa-circle-check wp-elements-1ee4c62a9b3eb8e7379e24cbf11bf756\" style=\"font-size:1em\"><\/i>\n\n\n\n<p class=\"wp-block-paragraph\">Search for a block<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-09d3b6f4 wp-block-group-is-layout-flex\">\n<i class=\"wp-block-mtsu-blocks-icon-block has-mtsublue-color has-text-color has-link-color far fa-circle-check wp-elements-1ee4c62a9b3eb8e7379e24cbf11bf756\" style=\"font-size:1em\"><\/i>\n\n\n\n<p class=\"wp-block-paragraph\">Rearrange blocks<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-09d3b6f4 wp-block-group-is-layout-flex\">\n<i class=\"wp-block-mtsu-blocks-icon-block has-mtsublue-color has-text-color has-link-color far fa-circle-check wp-elements-1ee4c62a9b3eb8e7379e24cbf11bf756\" style=\"font-size:1em\"><\/i>\n\n\n\n<p class=\"wp-block-paragraph\">Access block settings<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-09d3b6f4 wp-block-group-is-layout-flex\">\n<i class=\"wp-block-mtsu-blocks-icon-block has-mtsublue-color has-text-color has-link-color far fa-circle-check wp-elements-1ee4c62a9b3eb8e7379e24cbf11bf756\" style=\"font-size:1em\"><\/i>\n\n\n\n<p class=\"wp-block-paragraph\">Locate block documentation<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-gray-color has-alpha-channel-opacity has-gray-background-color has-background is-style-wide\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Next Module: Images &amp; Documents<\/h2>\n\n\n\n<ul class=\"wp-block-list is-style-compact-list\">\n<li>Upload images and documents to the Media Library<\/li>\n\n\n\n<li>Add images to pages and posts<\/li>\n\n\n\n<li>Write effective alternative text<\/li>\n\n\n\n<li>Link to documents accessibly<\/li>\n\n\n\n<li>Understand the purpose of media slugs<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/www.mtsu.edu\/style-guide\/images-documents\/\" data-type=\"page\" data-id=\"1120\">\u2192 Continue to Images and Documents<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Now that you&#8217;ve learned how to edit content, it&#8217;s time to learn how WordPress organizes content using blocks. Learning Objectives After completing this module, you will be able to: What Are Blocks? Blocks are the individual content elements that make up a page. Everything from a paragraph to an image, button, or accordion is added [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":0,"parent":1110,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1118","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.mtsu.edu\/web-training\/wp-json\/wp\/v2\/pages\/1118","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mtsu.edu\/web-training\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.mtsu.edu\/web-training\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.mtsu.edu\/web-training\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mtsu.edu\/web-training\/wp-json\/wp\/v2\/comments?post=1118"}],"version-history":[{"count":3,"href":"https:\/\/www.mtsu.edu\/web-training\/wp-json\/wp\/v2\/pages\/1118\/revisions"}],"predecessor-version":[{"id":1733,"href":"https:\/\/www.mtsu.edu\/web-training\/wp-json\/wp\/v2\/pages\/1118\/revisions\/1733"}],"up":[{"embeddable":true,"href":"https:\/\/www.mtsu.edu\/web-training\/wp-json\/wp\/v2\/pages\/1110"}],"wp:attachment":[{"href":"https:\/\/www.mtsu.edu\/web-training\/wp-json\/wp\/v2\/media?parent=1118"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}