AMP

New in AMP: Date picker, easier CSS development, and more AMP By Example content

Uncategorized

We’re back with another post to highlight the most notable changes to AMP in the past few months.

amp-date-picker experimental beta

date-picker.png

Our new date picker is now available for experimenting with. To get started, make sure that you enable the Dev Channel and run the following command in the devtools console:

AMP.toggleExperiment(‘amp-date-picker’)

Full details for opting into experimental features can be found here. While we don’t have our documentation for this component live yet, basic details can be found on the Github issue and you can check out our example implementations (generic example, travel example).

Since this component is still experimental, you won’t be able to launch with it yet. Instead please try it out and let us know any feedback on the Github issue.  

replace-important npm package

Developers using AMP will already be familiar with some of its CSS restrictions. After hearing feedback that a few of these in particular have been stumbling blocks in the wild, we started thinking about how to make styling AMP pages a little easier. One of the first resources we’re rolling out is an npm package that replaces “!important” styles (which are disallowed in AMP) with equivalent rules that validate.

AMP by Example updates

We recently held a short sprint to get some new samples in AMP by Example—check out some of the results here:

As part of building our checkout flow sample, we also tested integrations with different payment providers. We were able to successfully build form submissions integrating with Authorize.net, Vantiv, WorldPay, and Card Connect. But don’t just take our word for it – try it out and let us know if you have trouble with your implementation.

A fidget spinner example built during our recent AMP By Example sprint

The best of the rest

  • We’ve launched implementations for the Media session API, for both amp-audio and amp-video.
  • AMP Showcase on AMPproject.org highlights websites using key features of AMP.
  • makes it possible to apply AMP’s layout system to arbitrary containers.
  • now automatically loads the scripts for AMP extensions that appear inside of updates.
  • A new error trigger for use with amp-analytics that can capture and report problems attributable to the author of the page or to software that is used in publishing the page.
  • We’ve launched the ability to serve video ads with a built-in video player to AMP pages from Doubleclick and other vendors that support the IMA SDK.
  • Publishers can now schedule their ads to refresh after a set time interval.

The roadmap ahead

See more in the full roadmap.

* * *

Thanks to the AMP development community for your work and feedback. As always, please let us know if you have any issues or feature requests on GitHub.

Posted by Rudy Galfi, Product Manager, AMP Project