How To Setup Google AMP HTML in Blogger

As I've discussed in the previous article, it's rather difficult to create xml-based pages like bloggers for valid AMP. But nothing is impossible on the internet, as long as trying and patience. Let's just discuss one of us how to make our blogger page valid.

Using Valid AMP Templates

How to distinguish a template that uses custom HTML language AMP is actually not too difficult. Blogger templates that use AMP have been flagged from the beginning of the HTML language. If a blogging blog page uses the amp language, the HTML language opening tag will be as below:

<HTML amp='amp' lang='id'>

I'm not very expert in creating blogger templates. So in order to shorten your work, you just search for and download a valid blogger template. After you download, try to backup your blog template first now, and replace it with a special template blogger amp.

Note: Use the AMP Validator Extension in Google Chrome or Mozilla, to let you know which parts are errors.

Change Blog Articles

Indeed we need a lot of patience and tenacity for all blog pages cms blogger. Even though your blog template is valid AMP, but not all your post pages are valid AMP. You must change your article manually one by one in order for valid amp.

The most common is the error amp in the image. This is because the hmtl language for image placement is different from the AMP hmtl language.

If the basic html language for the image is <img> then you must change it one by one into <amp-img>. In addition you should also ensure that the width and height codes are installed in the image.

In addition, you should not use style code, scripts, onclicks, and more. I am still confused, how? We've covered the article completely: Make Articles Valid AMP.

Removing Widgets That Create Invalid AMP Templates

There is some code on the widget that makes your template invalid. One of them is the OnClick code that errors all the pages. If an error occurs, you simply delete the following code on every content widget:

<b:include name='quickedit'/>

The code is located on every widget you add. Please find the code in the template editor in your blogger and delete it.

Follow the Basic Guidelines of AMP Project

Here are the basic guidelines for keeping your blog valid AMP:

Not Using Any Javascript

Please make sure that your template does not use any javascript to avoid errors. The use of custom CSS is only allowed in between the amp-custom code only.

Do not use basic HTML Code that AMP is not allowed

Example code not allowed:

<iframe>* | <style> | OnClick | <img>* | etc

Well that's some way for your blogger blog valid AMP html. Anyone want to add?

Saturday, September 30, 2017

How To Setup Google AMP HTML in Blogger