AMP

The AMP Component Catalogue

The AMP HTML library consists of a basic runtime that brings the core functionalities of AMP to your page. If you want to add additional features you can do so by using one or more of the ready-to-use AMP components. They are classified as:

Built-in Components that are included in the base library, such as amp-img and amp-pixel.
Extended Extensions to the base library that must be explicitly included in the document as custom elements.
Experimental Components that are released but are not yet ready for wide use.

Highlighted Components

Filter by category

动态内容

amp-access-laterpay
可让发布商轻松集成 LaterPay 微支付平台。
amp-access-poool
显示Poool付费专区。
amp-access-scroll
与Scroll成员身份集成。
amp-access
提供 AMP 付费墙和订阅支持。
amp-action-macro
Creates reusable actions.
amp-autocomplete
Suggests completed results corresponding to the user input as they...
amp-bind
利用数据绑定和类似于 JS 的简单表达式,使元素因应用户操作或数据变更而变化。
amp-byside-content
Displays dynamic content from the BySide service.
amp-consent
Provides the ability to collect and store a user's consent through...
amp-date-picker
提供用于选择日期的小部件。日期选择器可以呈现为覆盖,相对于输入字段,或作为静态日历小部件。
amp-form
Allows you to create forms to submit input fields in an AMP document.
amp-geo
Provides an approximate country-level geolocation interface.
amp-gist
Creates an iframe and displays a GitHub Gist.
amp-google-document-embed
Displays a document file supported by Google Drive.
amp-inputmask
Provides input masking capabilities to inputs in AMP forms
amp-install-serviceworker
Installs a ServiceWorker for the current page.
amp-link-rewriter
Allows publishers to rewrite URL based on configurable pattern
amp-list
动态下载数据并使用模板创建列表项。
amp-live-list
Provides a way to display and update content live.
amp-minute-media-player
Displays a Minute Media player.
amp-mustache
允许呈现 Mustache.js 模板。
amp-next-page
Infinite scrolling experience for document-level page recommendations.
amp-recaptcha-input
Appends a reCAPTCHA v3 token to AMP form submissions.
amp-render
Renders remote or inline data using a template.
amp-script
在Web Worker中运行自定义JavaScript。
amp-selector
表示一种控件,可显示选项菜单并让用户从中选择。
amp-smartlinks
Run Narrativ's Linkmate process inside your AMP page
amp-subscriptions-google
Implements subscription-style access protocol for Subscribe with Google.
amp-subscriptions
Implements subscription-style access protocol.
amp-user-notification
Displays a dismissable notification to the user.
amp-video-docking
Functionality for videos that minimize ("dock") to a corner or a...
amp-web-push
Allows users to subscribe to web push notifications.

媒体

amp-3d-gltf
显示 GL 传输格式 (glTF) 的 3D 模型。
amp-3q-player
嵌入来自3Q SDN的视频。
amp-anim
管理动画图像,通常是GIF。
amp-apester-media
Displays an Apester smart unit.
amp-audio
替代 HTML5 audio 标记。
amp-bodymovin-animation
Displays an AirBnB Bodymovin animation player.
amp-brid-player
Displays a Brid.tv player.
amp-brightcove
Displays a Brightcove Video Cloud or Perform player.
amp-connatix-player
Displays a cloud-hosted Connatix Player.
amp-dailymotion
Displays a Dailymotion video.
amp-delight-player
The amp-delight-player element displays a cloud-hosted Delight Player.
amp-embedly-card
Displays an Embedly card.
amp-google-read-aloud-player
Embeds the Google Read Aloud Player.
amp-hulu
Displays an embedded Hulu video.
amp-ima-video
Embeds a video player for instream video ads that are integrated...
amp-img
替换 HTML5 img 标记。
amp-imgur
Displays an Imgur post.
amp-izlesene
Displays an Izlesene video.
amp-jwplayer
Displays a cloud-hosted JW Player.
amp-kaltura-player
Displays the Kaltura Player as used in Kaltura's Video Platform.
amp-megaphone
Displays a Megaphone.fm podcast episode or playlist.
amp-mowplayer
Displays a cloud-hosted Mow Player.
amp-nexxtv-player
Displays a media stream from the nexxOMNIA platform.
amp-o2-player
Displays an AOL O2Player.
amp-ooyala-player
Displays an Ooyala video.
amp-playbuzz
Displays any Playbuzz item content (e.g., list, poll, etc.).
amp-powr-player
An amp-powr-player component displays the Powr Player as...
amp-reach-player
Displays a Beachfront Reach video player.
amp-skimlinks
Run skimlinks inside your AMP page.
amp-soundcloud
Displays a Soundcloud clip.
amp-springboard-player
Displays a Springboard Platform video player.
amp-video-iframe
Embeds an iframe containing a video player.
amp-video
替代 HTML5 视频标记。
amp-vimeo
Displays a Vimeo video.
amp-viqeo-player
Displays a Viqeo video player.
amp-wistia-player
Displays a Wistia video.
amp-yotpo
Embeds a Yotpo on-site widget.
amp-youtube
显示 YouTube 视频。

演示

amp-access-fewcents
Allows publishers to integrate with the Fewcents micropayments platform.
amp-animation
定义和显示动画。
amp-date-countdown
Displays a countdown sequence to a specified date.
amp-date-display
The amp-date-display component displays time data that you can...
amp-dynamic-css-classes
Adds several dynamic CSS class names onto the <body> element.
amp-fit-text
扩大或缩小字体大小以适合给定空间内的内容。
amp-font
Trigger and monitor the loading of custom fonts on AMP pages.
amp-mathml
Displays a MathML formula.
amp-pan-zoom
Provides zooming and panning for arbitrary content.
amp-slikeplayer
Displays a cloud-hosted Slike Player.
amp-timeago
Provides fuzzy timestamps by formatting dates as time ago (for...
amp-truncate-text
用省略号截断文本,可以选择显示一个溢出元素。
amp-wordpress-embed
Embeds a WordPress post.