Friday, October 20, 2017

How to Show Thumbnails In AMP HTML Blogger Templates

    Tutorial How To Show Thumbnails In AMP HTML Blogger Templates

    I use the blogger AMP template and changed all the articles including the <img> so <amp-img> code, but how come the thumbnail does not appear? I wonder why?

    It turns out that blogger templates will not read thumbnails if all images in an article are changed to <amp-img>.

    As we know, that img tag in AMP HTML is changed to amp-img. If we write in a post like this:
    <img alt='image text' src='url-image'/>
    it will result in AMP HTML validation error. The correct writing is like this: :
    <amp-img src="url-image.png"
        width="1080"
        height="610"
        layout="responsive"
        alt="AMP HTML"></amp-img>
    Image will appear well on post. However it will not appear on the thumbnail on the main page / homepage. To outsmart, to have the image appear on Homepage add a noscript tag so the code becomes like this:

    <noscript><img alt='gambar' src='url-image'/></noscript>

    That's How to Generate Thumbnails on AMP HTML Blogger Templates. May be the solution of your "confusion": D