How to write amp post in blogger

 

how to write amp post in blogger site
Blogger AMP Post 

AMP in Blogger - If you don't know how to publish a blogger entry or post correctly in AMP and so the AMP code validates us and does not give us a single error, you can follow this tutorial, created for Blogger users who are using Blogger Templates in AMP.


How to Write a Blogger Post in Amp?


In this Blogger on AMP tutorial, you will learn the following:

  • How to write a post with validated text in AMP?
  • How to write the first cover image in AMP?
  • How to upload a new image?
  • How to upload a small image?
  • How to add a "Link" URL to a word or phrase?
  • How to add URL to an image in AMP Version?
  • How to center a text or title in AMP?
  • How to add H2 heading to a title Tag?
  • How to add H3 subtitle to a text?
  • How to make the text "bold"?
  • How to mark the text in "Italic"?
  • How to mark the text "Underlined"?
  • How to mark text "numbered list"?
  • How to mark text "bulleted list"?
  • How to mark text "blockquote - quote"?
  • How to publish YouTube videos in AMP?
  • How to create a text table in AMP?
  • How to create new widgets and delete a code to validate the code in AMP?

Well if you have any other questions, you can leave a comment on this post and I will immediately update this tutorial as requested and thus have an excellent blogger experience at Amp.

Start Now 

Follow the instructions in the video tutorial and the content of this post

Video-tutorial


1. Upload an image by clicking the "Insert image" button

Upload image in blogger
Upload image in post

2.One click in HTML mode

One click in HTML mode
One click in HTML Mode

3. Insert the following code

<noscript> <img src = "#" width = "600" height = "350" alt = "" /> </noscript>

Example :-

Amp blogger code
Amp blogger code 

Eliminate the pound symbol and add the URL of your image, also adding a title in the text alt = "" will be as follows

Example 

<noscript> <img src = " https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggc5XvegPdUH3SOfuEawGMswxb1i4SDwLF5EMsk3dTT919b5_TeIr658IsN7622Uvvxp6pn-tEGoKyOm4PCYJbYSU66TaGVCObinDvu5EmaBMZFnvyr3KzsAWNzfSJYNJCyPZOF2hRQss/s640/publicar-una-entrada-de-blogger-en-amp.png " width = " 640 "height =" 356 "alt =" What is Blogging and why is it Popular? "/> </noscript>

Note: remember to change the values and Delete Non AMP Upload Image 

width = " 640 " width

Height = " 356 " height

 Implementation example:

Amp post example
Change Value

Second Image Add Code

<amp-img alt = "" layout = "responsive" src = "#" height = "320" width = "500"> </ amp -img>

Example 

<amp-img alt = " What is Blogging and why is it Popular? " layout = "responsive" src = " https://3.bp.blogspot.com/-TzCM-4D-yy8/WHV9n5R_4tI/AAAAAAAAN1E/XhwZmjeuTdIy6_Tnv3vYDcHc /s500/24.jpg "height =" 334 "width =" 500 "> </amp-img>

 Note: remember to change the values width = " 500 " width 

height = " 334 " height

YouTube Video Auto AMP Code:-

<amp-youtube width = " 300 " height = " 200 " layout = responsive data-videoid = " oaWMCtWh0oc " autoplay> </amp-youtube>

YouTube video static code in AMP

<amp-youtube data-videoid = " oaWMCtWh0oc " height = " 200 " layout = "responsive" width = " 300 "> </amp-youtube>

Download Amp Template 

Next Post Previous Post