{"id":7519,"date":"2019-04-20T11:52:59","date_gmt":"2019-04-20T11:52:59","guid":{"rendered":"https:\/\/ampforwp.com\/tutorials\/?post_type=ht_kb&#038;p=7519"},"modified":"2019-07-15T12:11:52","modified_gmt":"2019-07-15T12:11:52","slug":"how-to-import-and-export-amp-page-builder-layout","status":"publish","type":"ht_kb","link":"https:\/\/ampforwp.com\/tutorials\/article\/how-to-import-and-export-amp-page-builder-layout\/","title":{"rendered":"How to import and export AMP Page Builder Layout"},"content":{"rendered":"\n<p><strong>Follow the simple steps:<\/strong><\/p>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">Step 1:<\/mark><\/strong> Go to WordPress dashboard -&gt; select the Pages in which you want to use <strong>AMP page builder<\/strong>  -&gt;<strong>Use Builder <\/strong>here you need to check this option.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"546\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-111-1-1024x546.png\" alt=\"\" class=\"wp-image-7571\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-111-1-1024x546.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-111-1-300x160.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-111-1-768x409.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-111-1-50x27.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-111-1-60x32.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-111-1-100x53.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-111-1.png 1047w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption><br><\/figcaption><\/figure>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">Step 2:<\/mark><\/strong> Next, click on the <strong>Pre-built AMP Layouts button.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"479\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-222-1024x479.png\" alt=\"\" class=\"wp-image-7572\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-222-1024x479.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-222-300x140.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-222-768x359.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-222-50x23.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-222-60x28.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-222-100x47.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-222.png 1046w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">Step 3:<\/mark> <\/strong>Once you click on this then the page will appear on the screen select the <strong>Import\/ Export option.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"454\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-3-1024x454.png\" alt=\"\" class=\"wp-image-7537\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-3-1024x454.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-3-300x133.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-3-768x341.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-3-50x22.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-3-60x27.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-3-100x44.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-3.png 1282w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">Step 4:<\/mark> <\/strong>If you want to export the current layout (design) than you need to click on the export button then JSON file will be downloaded. <\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"470\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-4-1024x470.png\" alt=\"\" class=\"wp-image-7543\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-4-1024x470.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-4-300x138.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-4-768x353.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-4-50x23.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-4-60x28.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-4-100x46.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-4.png 1326w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">Step 5:<\/mark> <\/strong>Once you download the JSON file then go to that particlar page where you want the same design or layout then you need to import JSON file which you have downloaded.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"858\" height=\"571\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-5.png\" alt=\"\" class=\"wp-image-7557\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-5.png 858w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-5-300x200.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-5-768x511.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-5-50x33.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-5-60x40.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/page-5-100x67.png 100w\" sizes=\"(max-width: 858px) 100vw, 858px\" \/><\/figure>\n\n\n\n<p style=\"background-color: #ffdddd; border-left: 2px solid #f44336;padding:10px;\" > <strong > Note:<\/strong>\nOnce you imported the JSON file then it will be replaced by the current design.<\/p>\n\n\n\n<p><strong>That\u2019s it for this tutorial!<\/strong><\/p>\n\n\n\n<p>We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.<\/p>\n<div id=\"div-1\" class=\"hkb-feedback\">\n\t\t\t<strong class=\"ht-mobile-exit__title\">Ask your Questions Directly!<\/strong><br>\n\t\t\t<div class=\"hkb_widget_exit__content\" style=\"font-size: 14px;\">If you can't find the solutions in this article, then just ask us in the comments and we will answer it for you!<\/div>\n\t\t\t<a href=\"https:\/\/ampforwp.com\/support\/#contact\" id=\"button\" target=\"_blank\" rel=\"noopener noreferrer\"><button>Yes, I have a Question<\/button><\/a>\n\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Follow the simple steps: Step 1: Go to WordPress dashboard -&gt; select the Pages in which you want to use AMP page builder -&gt;Use Builder here you need to check this option. Step 2: Next, click on the Pre-built AMP Layouts button. Step 3: Once you click on this then&#8230;<\/p>\n","protected":false},"author":18,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":[],"ht-kb-category":[34],"ht-kb-tag":[],"_links":{"self":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/7519"}],"collection":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/comments?post=7519"}],"version-history":[{"count":40,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/7519\/revisions"}],"predecessor-version":[{"id":12596,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/7519\/revisions\/12596"}],"wp:attachment":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/media?parent=7519"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-category?post=7519"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-tag?post=7519"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}