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
0
votes
1 answer

How to show price of clicked item in amp-list

I am new to amp and trying to build this page where i would fetch some items from api and then render its response in amp-list. On clicking any of the item from this list, i want to access its price and display it. what should i write in…
Gopal
  • 455
  • 5
  • 14
0
votes
1 answer

Is it possible to create an AMP page without including v0.js script?

I'd like to make my website AMP friendly to take advantage of the caching. However, the v0.js AMP Javascript library is over 250KB, whereas my webpage is only 7KB including all images, CSS and scripts. I cannot justify adding that much bloat to my…
Jordan Majd
  • 63
  • 1
  • 5
0
votes
0 answers

`amp-list` documentation: what is the meaning of `<%host%>` URL prefix in the src attribute?

The amp-list item doc shows an example with a src attribute prefixed with <%host%>. I tried to search for an answer for the meaning of this but did not find anything. This does not seem like an AMP HTML URL Variable Substitution as described at…
SA Yoni G
  • 1
  • 2
0
votes
1 answer

How to implement AMPHTML Ads for my AMP pages

Please guide me on how to add AMPHTML Ads for my AMP pages as AMPHTML Ads has more advantage of loading speed over the normal amp-ad.
0
votes
1 answer

How can I show loader when I click on submit button in AMP form?

I have AMP form which passes the data to another page(eg. xyz.php). But xyz.php took 5 sec to submit the form. Rather than showing form, how can I show loader on AMP forms?
Talk2Nit
  • 1,115
  • 3
  • 22
  • 38
0
votes
4 answers

How can I avoid duplicate code on AMP sites?

With a Google AMP site how do you accomplished sharing code that is standard across the site? Assets such as: Headers Navigation Footer General Style definitions Based on what I've read this far, and on the demos I've worked with it seems there is a…
Zoop
  • 872
  • 3
  • 11
  • 24
0
votes
0 answers

Is there any way to auto refresh some content every X seconds in AMP Pages?

Is there any way to have a refresh "function" on AMP pages to repeat a task every X seconds? I need to call and API url every X seconds and with the response, modify part of page content. In javascript I was doing it with setTimeout, but I could not…
0
votes
1 answer

Can we implement AMP-HTML on a Gatsby.js app?

I am fairly new to AMP and have been asked to develop GatsbyJS website using AMP-HTML. I have also read that about the Gatsby-Plugin-AMP, it stats there may be situations where an image, iframe or some other element can’t be modified. But I am not…
newguy99
  • 1
  • 1
0
votes
0 answers

AMP Form action-xhr post Submission Throwing JSON error and no JSON involved

This is an AMP html site. I have forms working find on another domain but this is giving unexpected JSON.parse error: Failed to parse response JSON: SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data What JSON data?…
I am Alta
  • 41
  • 7
0
votes
1 answer

AMP Webpush Error: 'X-Frame-Options' to 'deny'

So I'm trying to implement webpush notifications for an AMP page, following the official documentation: https://amp.dev/documentation/components/amp-web-push But there is an issue when adding the component and specifying the…
Roman
  • 113
  • 6
0
votes
1 answer

Magento 2 AMP page: Custom JavaScript is not allowed

I am using this tag in magento2 layout default.xml file and using . But in google search console getting the error Custom JavaScript is not allowed.
user6568029
0
votes
2 answers

Dynamically add html on click on a amp webpage

Is it possible to dynamically add HTML to a webpage on click when using AMP? Something along the lines of the
This is the placeholder to append the…
Dgeorgex000000
  • 93
  • 1
  • 2
  • 8
0
votes
1 answer

amp-mustache Success/Error Messages Not Displaying

So, I posted this issue last week regarding duplicating headers. I have fixed this issue I do believe but now it's kicking back a new error that I can't seem to solve. I fixed my last issue by stripping out the headers being added a second time…
Craig Scott
  • 892
  • 4
  • 14
0
votes
1 answer

AMP-Access-Control-Allow-Source-Origin is not equal to the current

Alrighty, I've been beating my head against this one for a few days and after extensive Googling (there's a lot of purple links when I search anything regarding this now) I'm pretty much stumped. The form works both from our domain and the AMP one,…
Craig Scott
  • 892
  • 4
  • 14
0
votes
2 answers

AMP emails ads - 'amp-ad' component is unsupported

Our company has AMP page versions of our regular article and news pages. We are using the amp-ad component to display ads on those pages. We also have multiple HTML newsletter products with ad placements. I'm working on a POC of AMP4EMAIL and…
SA Yoni G
  • 1
  • 2