• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WriteNowDesign - Wordpress and Ecommerce Website Design

WordPress, Joomla, Ecommerce Website Design

  • Home
  • Prices/Packages
  • WordPress
  • Services
  • Portfolio
  • Blog
  • About
    • Testimonials
    • Locations
    • Online Payment
  • Contact
  • Show Search
Hide Search

Call 303-907-6133 Email

Configure WordPress Posts for AMP: Accelerated Mobile Pages

September 29, 2016 by Pat Fortino

I just got around to configuring my site for AMP: Accelerated Mobile Pages. While it was pretty easy, I had to dig to find out how to get Google Analytics on my AMP pages. The following post describes how to configure WordPress Posts for AMP: Accelerated Mobile Pages.

If you’re not familiar with AMP, it’s Google’s technology to speed up page load time on mobile devices. Basically, the AMP format strips out a lot of formatting and bloat to create super fast loading pages. Unfortunately, it will also strip out most of your website styling. But like it or not, you probably need to use it because Google will favor AMP pages in search results.

Configure WordPress Posts for AMP: Accelerated Mobile Pages

Install the Plugins

  1. If you don’t already have it, download and install the Yoast SEO plugin.
    This plugin has a LOT of settings. For help with the setup, see this setup guide for the Yoast SEO plugin.
    Click here for instructions on how to install WordPress plugins.
  2. Download and install the AMP plugin. There are no settings for this plugin
    Click here for instructions on how to install WordPress plugins.
  3. Download and install the Glue for Yoast SEO & AMP plugin.
    Click here for instructions on how to install WordPress plugins.
  4. Go to Settings > Permalinks and click Save Changes. It is necessary to do this so your AMP urls will work.

Configure Glue for Yoast SEO & AMP plugin

The Glue for Yoast SEO & AMP plugin allows you to specify some basic styling like header color, link and text color, logo and default image.

  1. From the WordPress admin screen, go to SEO > AMP.
    The Post types tab is displayed.
    Yoast Glue for AMP Post Types
    By default, Posts are enabled. Leave these settings as is since there is no support yet in the AMP plugin for pages.
  2. Click the Design tab.
    Yoast Glue for AMP Design
    Here you can specify design colors. You also upload an AMP logo and default image that is used when the page or post does not have an image associated with it. With both images, pay attention to the image size specified for each of those images.
  3. Click the Analytics tab. Here you can enter a special AMP analytics code.
    Important: You cannot use the standard Google Tracking Code. See Adding Analytics to your AMP pages for details.
    yoast-glue-for-amp-analytics
    Below is the AMP analytics code you need to insert into the Analytics code field.
    Change UA-XXXXX-Y to your google property code

  4. In order to get this code, go to your Google Analytics account and get the tracking ID for your Google Analytics Account. Google recommends that you create a new Property so you can specifically track AMP pages, but you don’t have to.
  5. In order to get the AMP Google Analytics to work, you need to add the AMP Analytics script to the AMP template header. To do this, add the following code you your theme’s functions.php file:

    Click here for more information on modifying the AMP template.

  6. Save the functions.php file.
  7. If you have a cache plugin installed, clear your cache now.
  8. To test a post for AMP styling, add /amp to the end of the post url; for example:
    https://writenowdesign.com/blog/wordpress/wordpress-how-to/change-wordpress-user-role-capabilities/amp/
    Below is an example of an AMP page on my site. Notice that I changed the header color, the header logo, the link and text color.
    Wordpress AMP Formatting
  9. Go to https://validator.ampproject.org/ to test your AMP page and make sure it’s valid. You need to use the amp url structure; for example, http://mysite.com/new-post/amp
    For more details about validating AMP pages, see Validate AMP Pages

Filed Under: Search Engine Optimization, Wordpress How To Leave a Comment

Previous Post: « Change WordPress User Role Capabilities
Next Post: WooCommerce Product Add-ons Review »

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Related

Primary Sidebar

Blog Categories

Call Today

Get a Free Quote

303-907-6133

Subscribe to News

News about WordPress, WooCommerce, & Technology

What’s New

  • WPForms Not Sending Notifications
  • Add Terms and Conditions WooCommerce
  • Fix WordPress AMP Validation Errors
  • Use the Classic Editor with Gutenberg Block Editor
  • Add a Message at Top or Bottom of WooCommerce Checkout Page
  • How to Link to a PDF in WordPress

Find Us On…

  • Facebook
  • LinkedIn
  • RSS

Call 303-907-6133 Email

© 2004–2023 · WriteNowDesign · Sitemap · Log in · Return to Top

 

Loading Comments...