La librería de AMP HTML proporciona componentes que son clasificados así:

  • integrado: componentes incluidos en la biblioteca base, como amp-img y amp-pixel.
  • extendido: extensiones de la biblioteca base que deben incluirse explícitamente en el documento como elementos personalizados (por ejemplo, <script async custom-element="amp-audio" ...).
  • experimental: componentes que se han publicado pero todavía no están listos para que el público general pueda usarlos.

Los complementos se clasifican en las siguientes categorías:

Anuncios y Analíticas

Componente Descripción
amp-ad Representa un contenedor que puede mostrar un anuncio.
amp-ad-exit Permite configurar el comportamiento de salidas de anuncios de A4A (AMP for Ads).
amp-analytics Captura datos de analíticas de un documento AMP.
amp-auto-ads Inserta de forma dinámica anuncios en una página AMP mediante un archivo de configuración servido remotamente.
amp-call-tracking Cambia de forma dinámica un número de teléfono de un hiperenlace para habilitar el seguimiento de llamadas.
amp-experiment Se puede emplear para realizar pruebas de experiencia de usuario en un documento AMP.
amp-pixel Representa un píxel de seguimiento para contar las visitas de las páginas.
amp-sticky-ad Permite que se muestre y fije contenido de anuncios en la parte inferior de la página.

Contenido Dinámico

Componente Descripción
amp-access-laterpay Permite que los editores integren fácilmente la plataforma de micropagos LaterPay.
amp-access Proporciona un muro de pago AMP y asistencia en el registro.
amp-bind Permite que los elementos muten como respuesta a las acciones de un usuario o a cambios de datos a través de vínculos de datos y expresiones simples similares a JS.
amp-form Admite el uso de formularios.
amp-gist Muestra un repositorio GitHub Gist.
amp-install-serviceworker Instala una secuencia de comandos service worker.
amp-list Baja datos de forma dinámica y crea elementos de lista mediante una plantilla.
amp-live-list Permite que el contenido se muestre y se actualice en directo.
amp-mustache Permite el renderizado de las plantillas Mustache.js.
amp-selector Representa un menú de varias opciones que el usuario puede elegir.
amp-user-notification Muestra una notificación que los usuarios pueden ignorar.
amp-web-push Permite que los usuarios se subscriban a notificaciones push en la Web.

Diseño

Componente Descripción
amp-accordion Permite que los usuarios echen un vistazo a la descripción del contenido y vayan directos a la sección que quieran cuando lo deseen.
amp-app-banner Un contenedor y una IU básica que se pueden utilizar en un banner multiplataforma de posición fija que tenga una llamada a la acción para descargar una aplicación.
amp-carousel Muestra varios fragmentos de contenido similares en un eje horizontal.
amp-fx-flying-carpet Envuelve sus elementos secundarios en un contenedor único que se desplaza por la pantalla, lo que te permite mostrar un anuncio de pantalla completa sin ocupar todo el viewport.
amp-fx-parallax Un atributo que habilita el efecto de perspectiva en 3D de un elemento.
amp-iframe Muestra un iframe.
amp-lightbox Permite implementar un elemento lightbox o una experiencia similar.
amp-position-observer Supervisa la posición de un elemento dentro del viewport mientras el usuario se desplaza por la pantalla, y coordina eventos que se pueden usar con otros componentes.
amp-sidebar Posibilita que se muestre metacontenido pensado para accesos temporales, como por ejemplo, la navegación, los enlaces, los botones o los menús.

Contenido multimedia

Componente Descripción
amp-3q-player Inserta vídeos de 3Q SDN.
amp-anim Gestiona una imagen animada, normalmente un GIF.
amp-apester-media Muestra un recurso inteligente de Apester.
amp-audio Reemplaza la etiqueta HTML5 audio.
amp-brid-player Muestra un reproductor de Brid.tv.
amp-brightcove Muestra la plataforma de vídeo en línea Video Cloud o el reproductor Perform de Brightcove.
amp-dailymotion Muestra un vídeo de Dailymotion.
amp-google-vrview-image Muestra una imagen de RV.
amp-hulu Muestra un vídeo sencillo insertado de Hulu.
amp-ima-video Inserta un reproductor de vídeo para anuncios de vídeo in-stream integrados con el SDK de IMA.
amp-image-lightbox Permite implementar un elemento lightbox de imagen o una experiencia similar.
amp-img Reemplaza la etiqueta HTML5 img.
amp-imgur Muestra una publicación de Imgur.
amp-izlesene Muestra un vídeo de Izlesene.
amp-jwplayer Muestra un reproductor JWPlayer alojado en la nube.
amp-kaltura-player Muestra el reproductor Kaltura tal como se usa en la plataforma de vídeo de Kaltura.
amp-nexxtv-player Muestra una emisión de contenido multimedia de la plataforma nexxOMNIA.
amp-o2-player Muestra un reproductor AOL O2Player.
amp-ooyala-player Muestra un vídeo de Ooyala.
amp-playbuzz Muestra cualquier contenido de Playbuzz (por ejemplo una lista, una encuesta, etc.).
amp-reach-player Muestra un reproductor de vídeo Beachfront Reach.
amp-soundcloud Muestra un clip de Soundcloud.
amp-springboard-player Muestra un reproductor de vídeo Springboard Platform.
amp-video Sustituye la etiqueta HTML5 video.
amp-vimeo Muestra un vídeo de Vimeo.
amp-youtube Muestra un vídeo de YouTube.

Presentación

Componente Descripción
amp-animation Define y muestra una animación.
amp-dynamic-css-classes Añade varios nombres de clase CSS dinámicos al elemento HTML.
amp-fit-text Aumenta o reduce el tamaño de fuente para que el contenido quepa en el espacio disponible.
amp-font Activa y controla la carga de fuentes personalizadas.
amp-timeago Proporciona marcas de tiempo imprecisas al formatear las fechas como "hace cierto tiempo" (por ejemplo, hace tres horas).
amp-viz-vega Muestra elementos visuales creados con la gramática visual Vega.

Redes sociales

Componente Descripción
amp-facebook-comments Inserta el complemento de comentarios de Facebook.
amp-facebook-like Inserta el complemento del botón Me gusta de Facebook.
amp-facebook Muestra una publicación o vídeo de Facebook.
amp-gfycat Muestra un GIF de vídeo de Gfycat.
amp-instagram Muestra una publicación insertada de Instagram.
amp-pinterest Muestra un widget o el botón Pin It de Pinterest.
amp-reddit Muestra un comentario o una publicación insertados de Reddit.
amp-social-share Muestra un botón para compartir contenido en las redes sociales.
amp-twitter Muestra un tuit de Twitter.
amp-vine Muestra un vídeo insertado de Vine.