Our Topics

Create Blogger AMP HTML template install & download Accelerated Mobile Pages themes for Blogspot platform.

How to Check Valid AMP HTML on Blogger Pages (Without #development=1)

How to Check Valid AMP HTML on Blogger Pages (Without #development=1)
When converting your Blogger blog templates & use Accelerated Mobile Pages HTML, constant blog page checking is needed, making sure your blog pages are AMP valid at all times.

To check a valid AMP Blogger page is pretty easy when you can append #development=1 at your browser URL bar & automatically view the errors at your browser console log.

But what if you need instant access to check for AMP validation? Below we will share how to easily create a link anywhere in your Blogger powered AMP template for you to check your page for AMP specific validation purposes.

Before doing so, backup your template to your computer.

Click Edit HTML and find <body> (or anywhere in your template that might be suitable to reach from your blogger page).

Copy below codes and save it in your template.

<a expr:href='&quot;https://validator.ampproject.org/#url=&quot; + data:blog.url + &quot;%3Fm%3D1&quot;' target='_blank'>CHECK VALID AMP</a>

Click Save Template

You can change the text highlighted yellow to whatever text require.

Refresh you blog pages, and a link will be displayed (in this case right at the top of your blog page) for users to click.

Once it is clicked, automatically a new window will appear at ampproject website & display either you blog page is valid or has errors.

You can remove or comment out the code above in your template HTML if it is not in use.

Added Features on BlogrAMP Blogger Template

Good news! On BlogrAMP templates, this built in feature is already installed for you. You can easily activate or deactivate your blog pages AMP validator link/button just by adding a simple line of code. Here's how.-

Go to Template HTML and find <body>

At class attribute add dev-mode and it should look like so:-

<body class='dev-mode' id='blogramp'>

Click Save Template & automatically a button is displayed for you to click & check your blog page is a valid AMP HTML page.

If you do want this button to display, then remove the dev-mode from the <body> class attribute. All made easy for users to maintain & making sure your Blogger blog pages are valid Accelerated Mobile Pages, even if you have made small changes.

Hope it helps. Tell us what you think in comment section below.

Blogr-AMP Blogger AMP HTML Template
Rated 5/5 based on 98 reviews
Instantly check Blogger template powered AMP HTML pages for errors without the usage of ?development=1 in web browser. Using ampproject website services instead to view possible modifications made at Blogger template HTML are valid & does not have errors. Works well during blog development when adding new HTML elements (from other sources) using blogger gadgets/widgets which may generate errors when it is applied & saved.
Blogr-AMP: How to Check Valid AMP HTML on Blogger Pages (Without #development=1)
5/ 5
Best AMP Blogger template, Blogr-AMP exceeded my expectations. Search engine friendly, easy to use, backed by great support How to Check Valid AMP HTML on Blogger Pages (Without #development=1).

Interesting Topics You Might Be Interested...

Disqus Comments

Facebook Comments

Google+ Comments

Code Parser

Have a code snippet to share? Format RAW codes here...

Users who needs to share code snippets in comments, use helper below to paste your codes & copy to comments body.

Contact Us