Do you build things with AMP? Fill out the AMP Developer Survey!
AMP
  • websites

amp-pinterest

Introduction

The amp-pinterest component allows embedding a save button or pin widget.

Setup

Import the amp-pinterest component in the header.

<script async custom-element="amp-pinterest" src="https://cdn.ampproject.org/v0/amp-pinterest-0.1.js"></script>

Save button

Set data-do to buttonPin to enable pinning content on your site. These attributes are required:

  • data-url: the URL to be shared.
  • data-media the absolute image URL to be pinned.
  • data-description: the default description that appears in the pin create form.
an image
<amp-img src="/static/samples/img/amp.jpg"
  width="300"
  height="169"
  alt="an image"></amp-img>
<amp-pinterest height="18"
  width="56"
  data-do="buttonPin"
  data-url="https://amp.dev/documentation/examples/"
  data-media="https://amp.dev/documentation/examples/"
  data-description="amp-pinterest in action">
</amp-pinterest>

Embed pin widget

To embed the pin widget, set data-do to embedPin. The data-url attribute must contain the fully-qualified URL of the Pinterest resource.

<amp-pinterest width="236"
  height="326"
  data-do="embedPin"
  data-url="https://www.pinterest.com/pin/228065168607834583/">
</amp-pinterest>
Besoin de plus amples explications ?

Si les explications de cette page ne répondent pas à vos questions, n'hésitez pas à contacter d'autres utilisateurs d'AMP pour discuter de votre cas d'utilisation spécifique.

Se rendre sur Stack Overflow
Une fonctionnalité n'a pas encore été expliquée ?

Le projet AMP encourage fortement votre participation et vos contributions ! Nous espérons que vous deviendrez un membre régulier de notre communauté open source, mais nous serons également ravis de recevoir des contributions ponctuelles concernant les questions qui vous intéressent particulièrement.

Modifier l'exemple sur GitHub