{"id":13575,"date":"2019-08-08T11:06:36","date_gmt":"2019-08-08T11:06:36","guid":{"rendered":"https:\/\/ampforwp.com\/tutorials\/?post_type=ht_kb&#038;p=13575"},"modified":"2019-08-08T11:14:11","modified_gmt":"2019-08-08T11:14:11","slug":"how-to-convert-your-non-amp-website-to-amp","status":"publish","type":"ht_kb","link":"https:\/\/ampforwp.com\/tutorials\/article\/how-to-convert-your-non-amp-website-to-amp\/","title":{"rendered":"How to convert your non-amp website to AMP"},"content":{"rendered":"\n<p>It makes your AMP &amp; Non-AMP Same! AMP will output AMP Compatible code, while WordPress will have the WP code Once you enable this option Frontend and backend source code are different but with the same design of AMP.  <\/p>\n\n\n\n<p>You will find this option in the <strong>WordPress Dashboard <\/strong>-> <strong>AMP Option Panel<\/strong> -> <strong>Settings<\/strong> -> <strong>Advance Settings<\/strong> -> Enable &#8220;<strong>Convert AMP to WP theme (Beta)<\/strong>&#8221; option and then click on the &#8220;<strong>Save Changes<\/strong>&#8221; button.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"484\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/19-1024x484.png\" alt=\"\" class=\"wp-image-13576\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/19-1024x484.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/19-300x142.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/19-768x363.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/19-50x24.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/19-60x28.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/19-100x47.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/19.png 1313w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h4>AMP version will be displayed in non-amp also<\/h4>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"529\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/20-1024x529.png\" alt=\"\" class=\"wp-image-13584\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/20-1024x529.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/20-300x155.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/20-768x396.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/20-50x26.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/20-60x31.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/20-100x52.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/08\/20.png 1356w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\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>It makes your AMP &amp; Non-AMP Same! AMP will output AMP Compatible code, while WordPress will have the WP code Once you enable this option Frontend and backend source code are different but with the same design of AMP. You will find this option in the WordPress Dashboard -> AMP&#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\/13575"}],"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=13575"}],"version-history":[{"count":9,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/13575\/revisions"}],"predecessor-version":[{"id":13586,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/13575\/revisions\/13586"}],"wp:attachment":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/media?parent=13575"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-category?post=13575"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-tag?post=13575"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}