Questions tagged [amp-html]

AMP HTML (Accelerated Mobile Pages HTML) is a project to make the web faster as well as easier to develop. It is a set of HTML tags, a JavaScript library, and a cache for AMP-compliant pages.

The project homepage is at https://amp.dev/, and the framework source code can be found at https://github.com/ampproject/amphtml.

AMP HTML is HTML with some restrictions for reliable performance and some extensions for building rich content beyond basic HTML. The AMP JS library ensures the fast rendering of AMP HTML pages.

An easy-to-follow tutorial can be found on the project's homepage.

Validating AMP pages

There are five ways to validate an AMP page:

  1. Browser Developer Console - Add #development=1 to the URL, for example http://localhost:8000/released.amp.html#development=1, then check the browser console for validation errors.
  2. Web Interface - Paste the URL (or the page code) at https://validator.ampproject.org/
  3. Browser Extension - Use the AMP Validator extension for Chrome.
  4. NPM Packages for CI - Example
  5. Command Line Tool - Example

You can also use the Structured Data Testing Tool to validate Schema.org markup.

##Some Useful Link

AMP START

Build responsive, lightning-fast AMP pages with the help of pre define templates and components

AMP DEV

A hands-on introduction to Accelerated Mobile Pages (AMP) focusing on code and live samples. Learn how to create AMP pages and see examples for all AMP components.

WPZA's AMP WordPress Guides

Useful AMP guides for WordPress developers, helping to make WordPress websites AMP friendly (without plugins).

AMPproject.org moves to amp.dev! Additionally AMP resources were scattered across multiple websites like ampbyexample.com and ampstart.com is also move on amp.dev

2310 questions
8
votes
4 answers

amp-img error: Layout not supported for: container

Trying to validate my amp-img. In this example: http://staging.laineygossip.com/Sasha-Celeb-Finds-Sienna-Miller/Lifestyle/24695/amp#development=1 I get the error: Layout not supported for: container In the console, the error is: The specified layout…
Ken Ma
  • 705
  • 2
  • 7
  • 11
8
votes
1 answer

How can a page tell browsers that an AMP HTML version exists?

I understand I will have two pages, the AMP one and the regular one. The AMP one has a canonical link to the regular one, but how does the regular one specify that there is a AMP version available?
Designer023
  • 1,902
  • 1
  • 26
  • 43
8
votes
2 answers

Why does amp-html have a CSS-rule that hides the body element

The example page for amp-html, as well as the few amp-html sites available right now, contain the following code: Why is this? Setting the opacity to 0 for…
jornane
  • 1,397
  • 10
  • 27
7
votes
3 answers

AMP Form submission redirect or response

Good morning, I have a form on a test AMP page (is AMP validate) and the form works: I receive the email with result (I use a php to handle it). I don't know (I did some try but I think I still missing an example) the syntax for let the AMP page…
Massimiliano Rubino
  • 279
  • 1
  • 2
  • 16
7
votes
2 answers

AMP form submitting with post

I've a website for years with a few forms to login etc. Recently I made it all Google's AMP proof, but the forms stopped working. I'm searching for days now, but I can't find the right answer. First I included all the necessary scripts and code,…
Patrick de Graaf
  • 125
  • 1
  • 1
  • 6
7
votes
7 answers

AMP - Install multiple event handlers for tap

Is there a way to install multiple events for tap? E.g. on tap close the sidebar and open a lightbox? Thanks.
Emoke Ordog
  • 111
  • 1
  • 7
7
votes
3 answers

How to properly set width and height attributes of amp-img

I'm currently in the process of making my website AMP-ified my site is built in bootstrap and everything is responsive so most of my images I just set like so: img{ width:100%; height:auto; } However the problem im running into with my amp-img…
NooBskie
  • 3,761
  • 31
  • 51
7
votes
5 answers

AMP: Origin of must not be equal to container

I want to solve this problem in my first AMP project, This is the problem that I have: error.js:58: Origin of must not be equal to container This is my amp-iframe code in my index.html:
Jrey
  • 1,618
  • 2
  • 17
  • 34
7
votes
1 answer

Do AMP-HTML pages have to load the JavaScript library from ampproject.org?

The documentation states that AMP HTML documents MUST Contain a tag as the last element in their head (this includes and loads the AMP JS library). Does this actually mean that i can't…
Jonas Köritz
  • 2,606
  • 21
  • 33
7
votes
4 answers

Accelerated mobile pages link to css file

I am trying to link to css file : Opening chrome in #development=1 mode to test my page for amp. I am getting this error : The attribute 'href' in tag 'link rel=stylesheet for fonts' is set…
osmanraifgunes
  • 1,438
  • 2
  • 17
  • 43
7
votes
2 answers

AMP-Carousel with varying image dimensions

I'm struggling to create an AMP-Carousel with images which have varying dimensions. I want to scale the images in the carousel to a fixed height & an automatic width. The examples provided in the docs all have the same width/height. I've tried…
Brian G. Bell
  • 1,143
  • 2
  • 9
  • 8
7
votes
2 answers

How to use Disqus with AMP?

I'm trying to convert an article that has Disqus comments at the bottom to AMP. To do this I'm using an :
Rahul
  • 12,181
  • 5
  • 43
  • 64
7
votes
4 answers

How can I test the CDN of Google's AMP Project?

Quoted from here: https://www.ampproject.org/docs/get_started/about-amp.html AMP is a way to build web pages for static content that render fast. AMP in action consists of three different parts: AMP HTML AMP JS AMP CDN AMP HTML is HTML with…
Killy
  • 300
  • 5
  • 13
7
votes
1 answer

Will the SVG part in Accelerated Mobile Pages (AMP) support the IMG tag?

I used the following SVG code in my AMP site and it is not working: --html I need AMP to use SVG files in a bigger project…
Peter Löbel
  • 71
  • 1
  • 3
6
votes
0 answers

Implement Google Analytics 4 in AMP

I know that GA 4 is still not supported and the development under ID #24621 goes not further. They say GA4 should do the AMP part. Universal Analytics will stopp at 1st July 2023 and I have a AMP only site. Does anyone know an other solution to…
Lovntola
  • 1,409
  • 10
  • 31