amp-html

How to get AMP Cookie consent modal dialog backdrop working?

最后都变了- 提交于 2020-06-01 05:52:06
问题 I'd like to implement a cookie consent on my static AMP website. The amp-story-consent so far seems to not fit that (cookie consent has no pages or bookend, please chip in if you know a solution for How to construct AMP cookie consent with the help of amp-story-consent?). I'm trying to implement my own modal dialog following the examples. <amp-consent layout="nodisplay" id="cookie-consent-element"> <script type="application/json"> { "consents": { "my-consent": { "checkConsentHref": "https:/

AMP set and get cookies values

Deadly 提交于 2020-04-16 03:43:28
问题 I am new in this AMP. In web I have scenario like below. Example I have a page with 100 paragraphs content ... For the user first time visit the page displaying only 10 paragraphs of content. then will ask to user email address in input form. after user provide the email address then will display remaining 90 paragraphs content... The same user visit 2nd time that page we displayed the content without asking email. Implementation Logic in WEB After user enter the email address we stored the

Google AMP: Sticky header possible?

Deadly 提交于 2020-03-18 12:09:05
问题 So far I haven't found a solid way to create a sticky header on AMP pages. I know there are css workaround/hacks, but nothing I can use in a production environment. A simple "position:fixed;" unfortunately won't work in my case. Out of all the components, I thought there would be one that toggles a body class on scroll, but I haven't found anything yet. Also don't think "amp-position-observer" will be of any use. Am I missing something? Ideally I'd like to be able to toggle an element's

How to use jQuery with amp-script?

两盒软妹~` 提交于 2020-02-28 15:45:02
问题 The AMP documentation mentions using jQuery with the amp-script component: https://amp.dev/documentation/guides-and-tutorials/develop/custom-javascript/ However, I do not see any examples nor an explanation of how to do so. I've tried including jQuery in the example AMP pages below (3.4.1 and 2.2.4 respectively), and running this simple jQuery script: $('button').click(function() { $('body').append('hello world'); }) Example AMP pages: https://apps.yourstorewizards.com/sandbox/amp/amp-script

How can I implement AMP in angular/ionic website?

℡╲_俬逩灬. 提交于 2020-02-27 06:00:59
问题 Recently i've heard about the Accelerated Mobile Pages project, and read some info about it. I wonder how to implement it for existing website that is built upon Ionic and Angular? 回答1: Basically there is no nearly possible solution to do that. If you check the doc here. Keep all third-party JavaScript out of the critical path Third-party JS likes to use synchronous JS loading. They also like to document.write more sync scripts. For example, If you five ads, and each does three sync loads,

How to validate checkboxes in an AMP form

十年热恋 提交于 2020-02-23 08:32:19
问题 I have a form in AMP that has a set of checkboxes, for example: <form method="post" target="_blank" name="form" custom-validation-reporting="show-all-on-submit" action-xhr="/some-xhr-action"> <span visible-when-invalid="valueMissing" validation-for="favoriteSports">You must select at least ONE sport.</span> <label for="favoriteSports">Choose one or more of your favorite sports:</label> <input type="checkbox" required id="favoriteSports" name="favoriteSports" value="football">Football</input>

Google AMP script conflicts with jquery window.scroll

梦想的初衷 提交于 2020-02-02 05:42:24
问题 I'm trying to follow the AMP guidelines suggested by Google (ampproject.org) but as soon as I add their js script, the jQuery scroll stops working Does anybody knows why and how to fix it? 回答1: The script tag is prohibited in AMP HTML unless: The type is application/ld+json It is the mandatory script tag to load the AMP runtime It is a tag to load extended components https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md#html-tags A list of available extensions, such as amp

Can I use AMP (Accelerated Mobile Pages) components/tags on a page that is not a valid AMP page?

二次信任 提交于 2020-01-21 05:52:28
问题 Can I use AMP (Accelerated Mobile Pages) components/tags on a page that is not a valid AMP page? Will I have advantages or disadvantages with this? Is it a good practice or not? I would like to use the AMP components/tags by the way it load the elements (like amp-carousel and amp-img), but I can not fully convert my website to AMP since I have custom javascript codes that AMP page dont allow that I use (that do not apply using amp-iframe). Is it better for me to keep standard elements and

Google AMP html - insert amp-iframe without src attribute

给你一囗甜甜゛ 提交于 2020-01-14 04:44:05
问题 I'm trying to run a script inside an AMP page. There is no page I need to load within the src attribute; my script should inject an <iframe> with the correct src (it is unknown at first load, only received in response to a request made by my script). Is this possible in AMP? Disclaimer: I'm open to different approaches to accomplish the same result - injecting an <iframe> with an src attribute within an AMP page. Thank you 回答1: The AMP page cannot contain any javascript in the first place, so

Using amp script in non-amp page

廉价感情. 提交于 2020-01-11 12:34:30
问题 There are side effects using script amp in standard html5 pages? My idea is to use amp-iframe to show some related content, also in web pages and not only in amp pages. 回答1: I have tried some month ago. My idea was to use the https://cdn.ampproject.org/v0.js to load images async for performance. Same to use the flying carpet and the Carousel on my regular site. The result was the internal validator brings to much errors, the script breaks, you need the Boilerplate and so on. So the answer is