• 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.

<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>

• Written by @sebastianbenz