{"id":4077,"date":"2019-09-20T13:27:55","date_gmt":"2019-09-20T13:27:55","guid":{"rendered":"https:\/\/wptest.sdelling.w3.uvm.edu\/?page_id=4077"},"modified":"2022-03-08T10:14:06","modified_gmt":"2022-03-08T15:14:06","slug":"home-page-layout-options","status":"publish","type":"page","link":"https:\/\/blog.uvm.edu\/manual\/home-page-layout-options\/","title":{"rendered":"Home Page Layout Options"},"content":{"rendered":"\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"intro--left\">To help speed up your website production, we&#8217;ve created some ready-made layouts that you can load and re-use with your content. <\/p>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"02 Bio home page from existing layout\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/cU0m3pmfSf0?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>This video shows how to take an existing bio page layout (a resume \/ CV layout), change the content and make it the home page of your WordPress website. Working with an existing layout is the fasted way to getting a profile page ready to go live.<\/p>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Ready-made layouts<\/h2>\n\n\n\n<p>The following layouts are ready-made and available for you to work with. Click on any of these thumbnail images to view larger. <\/p>\n\n\n\n<figure class=\"wp-block-gallery has-nested-images columns-default is-cropped wp-block-gallery-1 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_02.png\"><img loading=\"lazy\" decoding=\"async\" width=\"500\" height=\"1024\" data-id=\"4707\" src=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_02-500x1024.png\" alt=\"Home page 02\" class=\"wp-image-4707\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_02-500x1024.png 500w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_02-147x300.png 147w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_02-768x1572.png 768w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_02-750x1536.png 750w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_02-1000x2048.png 1000w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_02.png 1510w\" sizes=\"auto, (max-width: 500px) 100vw, 500px\" \/><\/a><figcaption><a href=\"https:\/\/blog.uvm.edu\/manual\/l__hero02-2\/\">View Home page layout 02<\/a><\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-05.png\"><img loading=\"lazy\" decoding=\"async\" width=\"574\" height=\"1024\" data-id=\"4711\" src=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-05-574x1024.png\" alt=\"Home Page layout 05\" class=\"wp-image-4711\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-05-574x1024.png 574w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-05-168x300.png 168w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-05-768x1371.png 768w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-05-860x1536.png 860w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-05-1147x2048.png 1147w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-05.png 1510w\" sizes=\"auto, (max-width: 574px) 100vw, 574px\" \/><\/a><figcaption><a href=\"https:\/\/blog.uvm.edu\/manual\/l__hp05\/\">View Home page layout 05<\/a><\/figcaption><\/figure>\n<\/figure>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-media-text alignwide is-stacked-on-mobile\"><figure class=\"wp-block-media-text__media\"><img loading=\"lazy\" decoding=\"async\" width=\"712\" height=\"394\" src=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/AB-block-layouts.png\" alt=\"\" class=\"wp-image-4741 size-full\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/AB-block-layouts.png 712w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/04\/AB-block-layouts-300x166.png 300w\" sizes=\"auto, (max-width: 712px) 100vw, 712px\" \/><\/figure><div class=\"wp-block-media-text__content\">\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">How to use a home page layout<\/h3>\n\n\n\n<p>Select &#8220;Layouts&#8221; at the top of your page when in edit mode.<br \/>Navigate to the &#8220;Layotus&#8221; tab and select &#8220;Home Page Layout 02&#8221;.  The layout will load into your page. <\/p>\n\n\n\n<p>You are now ready to edit the ready-made layout. Just replace text and images as needed. You can also remove or add additional blocks depending on your content and functionality needs.<\/p>\n\n\n\n<div style=\"height:48px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"has-silver-lighter-50-background-color has-background wp-block-heading\">Important<br \/><br \/>Please see the <a href=\"https:\/\/blog.uvm.edu\/manual\/updates-log\/\">WordPress Update Notes.<\/a> The location of the Layouts icon to choose layouts has moved.<\/h3>\n<\/div><\/div>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Other profile page layout ideas<\/h3>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>And here are some home page layout ideas that you can put together with existing Gutenberg blocks or components we&#8217;ve built for you.<\/p>\n\n\n\n<figure class=\"wp-block-gallery aligncenter columns-2 is-cropped wp-block-gallery-2 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><a href=\"https:\/\/blog.uvm.edu\/manualfiles\/2020\/03\/layout_HP_03.png\"><img loading=\"lazy\" decoding=\"async\" width=\"582\" height=\"1024\" src=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_03-582x1024.png\" alt=\"Home page layout 03\" data-id=\"4708\" data-full-url=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_03.png\" data-link=\"https:\/\/blog.uvm.edu\/manual\/layout_hp_03-2\/\" class=\"wp-image-4708\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_03-582x1024.png 582w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_03-170x300.png 170w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_03-768x1352.png 768w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_03-872x1536.png 872w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_03-1163x2048.png 1163w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP_03.png 1510w\" sizes=\"auto, (max-width: 582px) 100vw, 582px\" \/><\/a><figcaption class=\"blocks-gallery-item__caption\"><a href=\"https:\/\/blog.uvm.edu\/manual\/l__hero-03\/\">View home page layout 03<\/a><\/figcaption><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><a href=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-04.png\"><img loading=\"lazy\" decoding=\"async\" width=\"480\" height=\"1024\" src=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-04-480x1024.png\" alt=\"Home page layout 04\" data-id=\"4710\" data-full-url=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-04.png\" data-link=\"https:\/\/blog.uvm.edu\/manual\/layout_hp-04-2\/\" class=\"wp-image-4710\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-04-480x1024.png 480w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-04-141x300.png 141w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-04-768x1637.png 768w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-04-721x1536.png 721w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-04-961x2048.png 961w, https:\/\/blog.uvm.edu\/manual\/files\/2020\/03\/layout_HP-04.png 1510w\" sizes=\"auto, (max-width: 480px) 100vw, 480px\" \/><\/a><figcaption class=\"blocks-gallery-item__caption\">View home page layout 04<\/figcaption><\/figure><\/li><\/ul><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>To help speed up your website production, we&#8217;ve created some ready-made layouts that you can load and re-use with your content. This video shows how to take an existing bio page layout (a resume \/ CV layout), change the content and make it the home page of your WordPress website. Working with an existing layout &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/blog.uvm.edu\/manual\/home-page-layout-options\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Home Page Layout Options&#8221;<\/span><\/a><\/p>\n","protected":false},"author":5625,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-4077","page","type-page","status-publish","hentry","entry"],"featured_image_src":null,"featured_image_src_square":null,"rttpg_featured_image_url":null,"rttpg_author":{"display_name":"smasonla","author_link":"https:\/\/blog.uvm.edu\/manual\/author\/smasonla\/"},"rttpg_comment":0,"rttpg_category":null,"rttpg_excerpt":"To help speed up your website production, we&#8217;ve created some ready-made layouts that you can load and re-use with your content. This video shows how to take an existing bio page layout (a resume \/ CV layout), change the content and make it the home page of your WordPress website. Working with an existing layout&hellip;","_links":{"self":[{"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages\/4077","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=4077"}],"version-history":[{"count":36,"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages\/4077\/revisions"}],"predecessor-version":[{"id":5500,"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages\/4077\/revisions\/5500"}],"wp:attachment":[{"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/media?parent=4077"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}