How to make your Blogger website AMP (Accelerated Mobile Pages)
Hello, welcome to our blog. In today's blog, we will learn how to convert any blogger website into an AMP website for free without changing any theme or layout. We just need to do some changes to our code in order to convert it into an AMP website.
First, Let's Learn what is AMP?
AMP is an open-source HTML framework developed by the AMP Open Source Project. It was originally created by Google as a competitor to Facebook Instant Articles and Apple News. AMP is optimized for mobile web browsing and intended to help web pages load faster.
AMP or Google AMP is Accelerated Mobile Pages. As the name suggests, it helps to accelerate the site loading on slower internet devices. It is an open-source initiative supported by technology companies like Google and Twitter. Although it decreases the site user experience. It filters out the heavy scripts data which makes the site load faster. If you are OK to compromise user experience you can try Google AMP. You can easily add Google AMP in Blogger. This way you will be able to set up Google AMP in Blogger.
Steps to add AMP to your Blogger/Blogspot Website:
- First, Open your Blogger website dashboard where you want to make AMP
Open the dashboard of your blogger/Blogspot website in which you want to add AMP.
- Open theme >Edit HTML
- Search <head> in that HTML code
- Paste this code below <head> tag
1: <script async src="https://cdn.ampproject.org/v0.js"></script>
2: <script type="application/ld+json">
3: {
4: "@context": "http://schema.org",
5: "@type": "NewsArticle",
6: "headline": "Open-source framework for publishing content",
7: "datePublished": "2015-10-07T12:02:41Z",
8: "image": [
9: "logo.jpg"
10: ]
11: }
12: </script>
- Click on save theme
After pasting the above code in your blogger website with the given instruction, you can save them/changes yours have done in your Blogger code and visit your website once to check if everything works fine or not.
If you find everything "OK" on your site, then you can check that your website has been converted into AMP or not.
Checking website is AMP or not -
Now, let's learn how to check that your website is AMP or not. It's very simple to check, we just need an AMP checker tool.
There are mainly 2 tools available on the internet for AMP checking by the official developers of AMP
Here, I have embedded the AMP Validator which is from AMP Dev.
Just put your website's URL in the "URL Box" and hit "Validate". It will show if your website is an AMP or not. It also shows the code errors which have occurred that are not AMP.
Note: After using this code if your website is not converted into AMP then, its can be an error of your website theme/code which doesn't support AMP or have some problem with AMP.
In this case, remove the code that is given above and leave it as it was before.