{"id":1011,"date":"2022-02-20T21:25:30","date_gmt":"2022-02-20T21:25:30","guid":{"rendered":"https:\/\/zapable.com\/docs\/?post_type=docs&#038;p=1011"},"modified":"2022-02-20T21:25:30","modified_gmt":"2022-02-20T21:25:30","password":"","slug":"grido","status":"publish","type":"docs","link":"https:\/\/zapable.com\/docs\/docs\/layouts\/grido\/","title":{"rendered":"Grido"},"content":{"rendered":"\n<p>In this layout overview we&#8217;ll be taking a look at <strong>Layout Grido<\/strong> that you can find inside your app builder.<\/p>\n\n\n\n<p>Here are the sections of this guide for quick reference.<\/p>\n\n\n\n<p><a href=\"#homepage\" data-type=\"internal\" data-id=\"#homepage\">Homepage Options<\/a><br><a href=\"#layout\" data-type=\"internal\" data-id=\"#layout\">Layout Options<br><\/a><a href=\"#preview\" data-type=\"internal\" data-id=\"#preview\">Previewing The Layout<\/a><br><a href=\"#colors\" data-type=\"internal\" data-id=\"#colors\">Homepage Colors<\/a><\/p>\n\n\n\n<p>Like with any other layout, you can choose to use this option from the layouts options panel by clicking the green change layout button from the homepage of the app builder when you are editing an app.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"678\" src=\"https:\/\/zapable.com\/docs\/wp-content\/uploads\/2022\/02\/layout_grido_options-1024x678.png\" alt=\"\" class=\"wp-image-1012\" srcset=\"https:\/\/zapable.com\/docs\/wp-content\/uploads\/2022\/02\/layout_grido_options-1024x678.png 1024w, https:\/\/zapable.com\/docs\/wp-content\/uploads\/2022\/02\/layout_grido_options-300x199.png 300w, https:\/\/zapable.com\/docs\/wp-content\/uploads\/2022\/02\/layout_grido_options-768x508.png 768w, https:\/\/zapable.com\/docs\/wp-content\/uploads\/2022\/02\/layout_grido_options.png 1082w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h5 class=\"gb-headline gb-headline-d433eaae\" id=\"homepage\"><span class=\"gb-icon\"><svg aria-hidden=\"true\" height=\"1em\" width=\"1em\" viewBox=\"0 0 256 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path fill=\"currentColor\" d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"><\/path><\/svg><\/span><span class=\"gb-headline-text\">Homepage Options<\/span><\/h5>\n\n\n\n<p>This particular layout does not offer any homepage options.<\/p>\n\n\n\n<h5 class=\"gb-headline gb-headline-f7fe24b0\" id=\"layout\"><span class=\"gb-icon\"><svg aria-hidden=\"true\" height=\"1em\" width=\"1em\" viewBox=\"0 0 256 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path fill=\"currentColor\" d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"><\/path><\/svg><\/span><span class=\"gb-headline-text\">Layout Options<\/span><\/h5>\n\n\n\n<p>This particular layout does not offer any homepage options.<\/p>\n\n\n\n<h5 class=\"gb-headline gb-headline-15d11547\" id=\"preview\"><span class=\"gb-icon\"><svg aria-hidden=\"true\" height=\"1em\" width=\"1em\" viewBox=\"0 0 256 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path fill=\"currentColor\" d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"><\/path><\/svg><\/span><span class=\"gb-headline-text\">Previewing The Layout<\/span><\/h5>\n\n\n\n<p>Here&#8217;s a quick look at the how the app looks with this layout.<\/p>\n\n\n<div class=\"gb-grid-wrapper gb-grid-wrapper-3d0dffce\">\n<div class=\"gb-grid-column gb-grid-column-9d7317e7\"><div class=\"gb-container gb-container-9d7317e7\"><div class=\"gb-inside-container\">\n\n<p class=\"gb-headline gb-headline-92b54286 gb-headline-text\"><strong>Application Homescreen<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"451\" height=\"783\" src=\"https:\/\/zapable.com\/docs\/wp-content\/uploads\/2022\/02\/layout_grido_preview.png\" alt=\"\" class=\"wp-image-1015\" srcset=\"https:\/\/zapable.com\/docs\/wp-content\/uploads\/2022\/02\/layout_grido_preview.png 451w, https:\/\/zapable.com\/docs\/wp-content\/uploads\/2022\/02\/layout_grido_preview-173x300.png 173w\" sizes=\"auto, (max-width: 451px) 100vw, 451px\" \/><\/figure>\n\n<\/div><\/div><\/div>\n<\/div>\n\n\n<h5 class=\"gb-headline gb-headline-d1fc5506\" id=\"colors\"><span class=\"gb-icon\"><svg aria-hidden=\"true\" height=\"1em\" width=\"1em\" viewBox=\"0 0 256 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path fill=\"currentColor\" d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"><\/path><\/svg><\/span><span class=\"gb-headline-text\">Homepage Colors<\/span><\/h5>\n\n\n\n<p>Please note that all color changes for the homepage are found under the main left menu, under <strong>Colors<\/strong> and then select the <strong>Homepage<\/strong> option.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/zapable.co\/academyblog\/wp-content\/uploads\/2021\/06\/layout-color-options-homepage-1024x265.png\" alt=\"\" class=\"wp-image-2746\"\/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>In this layout overview we&#8217;ll be taking a look at Layout Grido that you can find inside your app builder. Here are the sections of this guide for quick reference. Homepage OptionsLayout OptionsPreviewing The LayoutHomepage Colors Like with any other layout, you can choose to use this option from the layouts options panel by clicking &#8230; <a title=\"Grido\" class=\"read-more\" href=\"https:\/\/zapable.com\/docs\/docs\/layouts\/grido\/\" aria-label=\"More on Grido\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"doc_category":[80],"doc_tag":[],"class_list":["post-1011","docs","type-docs","status-publish","hentry","doc_category-layouts"],"year_month":"2026-04","word_count":139,"total_views":"293","reactions":{"happy":"0","normal":"0","sad":"1"},"author_info":{"name":"zapdocs","author_nicename":"zapdocs","author_url":"https:\/\/zapable.com\/docs\/author\/zapdocs\/"},"doc_category_info":[{"term_name":"Layouts","term_url":"https:\/\/zapable.com\/docs\/docs-category\/layouts\/"}],"doc_tag_info":[],"_links":{"self":[{"href":"https:\/\/zapable.com\/docs\/wp-json\/wp\/v2\/docs\/1011","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zapable.com\/docs\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/zapable.com\/docs\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/zapable.com\/docs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/zapable.com\/docs\/wp-json\/wp\/v2\/comments?post=1011"}],"version-history":[{"count":2,"href":"https:\/\/zapable.com\/docs\/wp-json\/wp\/v2\/docs\/1011\/revisions"}],"predecessor-version":[{"id":1016,"href":"https:\/\/zapable.com\/docs\/wp-json\/wp\/v2\/docs\/1011\/revisions\/1016"}],"wp:attachment":[{"href":"https:\/\/zapable.com\/docs\/wp-json\/wp\/v2\/media?parent=1011"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/zapable.com\/docs\/wp-json\/wp\/v2\/doc_category?post=1011"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/zapable.com\/docs\/wp-json\/wp\/v2\/doc_tag?post=1011"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}