{"id":23825,"date":"2021-08-17T11:06:50","date_gmt":"2021-08-17T15:06:50","guid":{"rendered":"https:\/\/plumrocket.com\/docs\/?p=23825"},"modified":"2021-11-18T05:34:37","modified_gmt":"2021-11-18T10:34:37","slug":"how-to-edit-cms-pages-for-magento-2-amp-website","status":"publish","type":"post","link":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages","title":{"rendered":"How to Edit AMP Content for Magento 2 CMS Pages"},"content":{"rendered":"\n

The Magento 2 AMP extension<\/a> automatically converts the HTML content of your website pages to AMP format. It perfectly deals with About Us and similar CMS pages that do not use JavaScript code or contain complex HTML elements. Otherwise, you should specify the AMP content manually and replace complex elements with AMP components. <\/p>\n\n\n\n

Additionally, the extension comes with AMP Theme One that provides a template for AMP Homepage along with many templates and configurations. Please check the separate article about Magento 2 AMP Homepage configuration<\/a>.<\/p>\n\n\n\n

In this article, you will learn how to edit CMS pages and set AMP content manually. Please follow the instructions below.<\/p>\n\n\n\n

Editing Content for CMS Pages<\/h2>\n\n\n\n
\n

Step-by-step guide:<\/p>\n\n\n\n

  1. In the main Magento menu, go to Content<\/strong> -> Elements -> Pages<\/strong>. You will find a grid with the available CMS pages.<\/li>
  2. In the CMS Pages<\/strong> grid, find the needed page, and click clicking Select<\/strong> -> Edit<\/strong> in the corresponding record. You will get to the CMS edit page.<\/li><\/ol>\n\n\n\n

    <\/p>\n<\/div><\/div>\n\n\n\n

    \"Magento<\/figure>\n\n\n\n
    \n

    Step-by-step guide:<\/p>\n\n\n\n

    1. In the WYSIWYG editor under the Content<\/strong> tab, you can edit the page’s content that will be automatically converted into AMP format. Please note that the AMP Content<\/a> <\/strong>field must be empty for the content to be automatically converted.<\/li>
    2. Do not forget to click Save<\/strong> after changes have been made.<\/li><\/ol>\n<\/div><\/div>\n\n\n\n
      \"Editing<\/figure>\n\n\n\n

      Editing AMP Content for CMS Pages<\/h2>\n\n\n\n

      In this section, learn how to set AMP content manually for pages with JavaScript and other complex elements. <\/p>\n\n\n\n

      \n

      Step-by-step guide:<\/p>\n\n\n\n

      1. In the main Magento menu, go to Content<\/strong> -> Elements -> Pages<\/strong>. In the CMS Pages<\/strong> grid, find the needed page, and click clicking Select<\/strong> -> Edit<\/strong> in the corresponding record. You will get to the CMS edit page.<\/li>
      2. Scroll down to the AMP Content<\/strong> field, and enter the content for the CMS page. Currently, the WYSIWYG editor is not supported in this field, so we recommend using the online AMP playground<\/a> to write valid AMP HTML code and paste it here. Additionally, check the guide on how to add AMP widgets<\/a> if you want to insert one.<\/li>
      3. Click Save<\/strong> to apply changes.<\/li><\/ol>\n<\/div><\/div>\n\n\n\n
        \"Editing<\/figure>\n\n\n\n

        Validating CMS Pages<\/h2>\n\n\n\n

        After you set AMP Content and saved the CMS page, make sure it is valid. To check it, click AMP Validation<\/strong> on the Edit CMS Page or check the AMP validation<\/a> article.<\/p>\n\n\n\n

        \n

        Step-by-step guide:<\/p>\n\n\n\n

        1. On the Edit CMS Page, click AMP Validation<\/strong> to check if the page is valid. <\/li><\/ol>\n<\/div><\/div>\n\n\n\n
          \"Validating<\/figure>\n\n\n\n
          \n\n\n\n

          Related page: How to Edit AMP Content for CMS Blocks in Magento 2<\/a>.<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"

          The Magento 2 AMP extension automatically converts the HTML content of your website pages to AMP format. It perfectly deals with About Us and similar CMS pages that do not use JavaScript code or contain complex HTML elements. Otherwise, you should specify the AMP content manually and replace complex elements with AMP components. Additionally, the … <\/p>\n

          Continue reading “How to Edit AMP Content for Magento 2 CMS Pages”<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"_mi_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0},"categories":[330],"tags":[],"yoast_head":"\nHow to Edit AMP Content for Magento 2 CMS Pages - Plumrocket Documentation<\/title>\n<meta name=\"description\" content=\"The Magento 2 AMP extension automatically converts the HTML content of your website pages to AMP format. It perfectly deals with About Us and similar CMS\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Edit AMP Content for Magento 2 CMS Pages\" \/>\n<meta property=\"og:description\" content=\"The Magento 2 AMP extension automatically converts the HTML content of your website pages to AMP format. It perfectly deals with About Us and similar CMS\" \/>\n<meta property=\"og:url\" content=\"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages\" \/>\n<meta property=\"og:site_name\" content=\"Plumrocket Documentation\" \/>\n<meta property=\"article:published_time\" content=\"2021-08-17T15:06:50+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-11-18T10:34:37+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2021\/08\/magento-2-amp-extension-editing-cms-pages-1.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Plumrocket\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to Edit AMP Content for Magento 2 CMS Pages - Plumrocket Documentation","description":"The Magento 2 AMP extension automatically converts the HTML content of your website pages to AMP format. It perfectly deals with About Us and similar CMS","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages","og_locale":"en_US","og_type":"article","og_title":"How to Edit AMP Content for Magento 2 CMS Pages","og_description":"The Magento 2 AMP extension automatically converts the HTML content of your website pages to AMP format. It perfectly deals with About Us and similar CMS","og_url":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages","og_site_name":"Plumrocket Documentation","article_published_time":"2021-08-17T15:06:50+00:00","article_modified_time":"2021-11-18T10:34:37+00:00","og_image":[{"url":"https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2021\/08\/magento-2-amp-extension-editing-cms-pages-1.png"}],"twitter_card":"summary_large_image","twitter_misc":{"Written by":"Plumrocket","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/plumrocket.com\/docs\/#website","url":"https:\/\/plumrocket.com\/docs\/","name":"Plumrocket Documentation","description":"Extensions docs, troubleshootings etc.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/plumrocket.com\/docs\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages#primaryimage","inLanguage":"en-US","url":"https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2021\/08\/magento-2-amp-extension-editing-cms-pages-1.png","contentUrl":"https:\/\/plumrocket.com\/docs\/wp-content\/uploads\/2021\/08\/magento-2-amp-extension-editing-cms-pages-1.png","width":1206,"height":762},{"@type":"WebPage","@id":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages#webpage","url":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages","name":"How to Edit AMP Content for Magento 2 CMS Pages - Plumrocket Documentation","isPartOf":{"@id":"https:\/\/plumrocket.com\/docs\/#website"},"primaryImageOfPage":{"@id":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages#primaryimage"},"datePublished":"2021-08-17T15:06:50+00:00","dateModified":"2021-11-18T10:34:37+00:00","author":{"@id":"https:\/\/plumrocket.com\/docs\/#\/schema\/person\/c96fccdb89342ae6804272265723eca8"},"description":"The Magento 2 AMP extension automatically converts the HTML content of your website pages to AMP format. It perfectly deals with About Us and similar CMS","breadcrumb":{"@id":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides\/cms-pages#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Magento 2 Extensions","item":"https:\/\/plumrocket.com\/magento-extensions"},{"@type":"ListItem","position":2,"name":"Magento 2 AMP","item":"https:\/\/plumrocket.com\/magento-amp"},{"@type":"ListItem","position":3,"name":"Documentation","item":"https:\/\/plumrocket.com\/docs\/magento-amp"},{"@type":"ListItem","position":4,"name":"v3","item":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3"},{"@type":"ListItem","position":5,"name":"How-to Guides","item":"https:\/\/plumrocket.com\/docs\/magento-amp\/v3\/userguides"},{"@type":"ListItem","position":6,"name":"How to Edit AMP Content for Magento 2 CMS Pages"}]},{"@type":"Person","@id":"https:\/\/plumrocket.com\/docs\/#\/schema\/person\/c96fccdb89342ae6804272265723eca8","name":"Plumrocket","image":{"@type":"ImageObject","@id":"https:\/\/plumrocket.com\/docs\/#personlogo","inLanguage":"en-US","url":"https:\/\/secure.gravatar.com\/avatar\/10c44aa45aab391250913d982e552e53?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/10c44aa45aab391250913d982e552e53?s=96&d=mm&r=g","caption":"Plumrocket"}}]}},"_links":{"self":[{"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/posts\/23825"}],"collection":[{"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/comments?post=23825"}],"version-history":[{"count":18,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/posts\/23825\/revisions"}],"predecessor-version":[{"id":25106,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/posts\/23825\/revisions\/25106"}],"wp:attachment":[{"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/media?parent=23825"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/categories?post=23825"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/plumrocket.com\/docs\/wp-json\/wp\/v2\/tags?post=23825"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}