Great News! Try our new tool to convert img to amp-img. Try Now!

Wednesday, December 6, 2017

How to Fix Warning JavaScript in AMP Blogger Template

How to Fix Warning JS AMP Blogger. amp-* extension .js script was found on this page but is unused. How to Fix Warning JavaScript in AMP Blogger Template

How to Fix Warning JS AMP Blogger.  amp-* extension .js script was found on this page but is unused


Blogger AMP HTML integrated Blogspot templates are caught off guard with "warnings  amp-* extension .js script was found on this page" or "This may become an error in the future" when checking their AMP blog posts/pages using AMP Project validator tool.

As we know that if we store AMP elements like amp-youtube, amp-audio, and others (except amp-img because it's built-in) then we have to keep the corresponding js in order for the element to appear.

And if we put a js but there are no elements corresponding to the js, it will appear warning on AMP.


As with amp-youtube, if amp-youtube is not displayed on all pages, then for pages that do not display amp-youtube AMP warning will appear for amp-youtube.js.

Actually this could use conditional tags for certain pages so that amp-youtube.js only appears on certain pages that use the amp-youtube element.

But of course it would be inconvenient to use the amp-youtube element on a new page, we would have to add the new page url into the conditional tag for amp-youtube.js in the edit HTML to allow the amp-youtube element to show.

Well so as not to bother, we can use the following trick:

Please save amp-youtube.js above the code </ head> then please save the following code under <body> code.

<amp-youtube
     data-videoid="sY524jY1tBQ"
     height="270"
     layout="nodisplay"
     width="480"></amp-youtube>


With layout="nodisplay" then the element will not appear but will be detected on all pages. Next we are free to save the amp-youtube element in any post page with the following code:

<amp-youtube
     data-videoid="VIDEOID"
     height="270"
     layout="responsive"
     width="480"></amp-youtube>


It's easy, right? Of course this can be used also for other elements such as amp-audio, amp-facebook, amp-image-lightbox, and others.