Indice

Important: this documentation is not applicable to your currently selected format ads!

amp-yotpo

Description

Embeds a Yotpo on-site widget.

Required Scripts

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

Supported Layouts

fill fixed fixed-height flex-item nodisplay responsive

Overview

You can use the amp-yotpo extension to display Yotpo on-site widgets.

Example: Display the Yotpo bottom line widget

<amp-yotpo
  width="550"
  height="100"
  data-app-key="liSBkl621ZZsb88tsckAs6Bzx6jQeTJTv8CDf8y5"
  data-widget-type="BottomLine"
  data-product-id="9408616206"
>
</amp-yotpo>

Example: Display the reviews widget

<amp-yotpo
  width="550"
  height="700"
  layout="responsive"
  data-app-key="liSBkl621ZZsb88tsckAs6Bzx6jQeTJTv8CDf8y5"
  data-widget-type="MainWidget"
  data-product-id="9408616206"
  data-name="hockey skates"
  data-url="https://ranabram.myshopify.com/products/hockey-skates"
  data-image-url="https://ichef.bbci.co.uk/news/320/media/images/83351000/jpg/_83351965_explorer273lincolnshirewoldssouthpicturebynicholassilkstone.jpg"
  data-descriptipn="skates"
  data-yotpo-element-id="1"
>
</amp-yotpo>

Attributes

data-app-key (required)	Specifies the account app key. For example, `liSBkl621ZZsb88tsckAs6Bzx6jQeTJTv8CDf8y5`.
data- (optional)**	Each Yotpo widget has optional data attributes. For example, the reviews widget has an optional attribute named `product-id`. Refer to Yottpo's documentation for which attributes to specify. When using the `amp-yotpo` extension, for each corresponding Yotpo attribute prepend `data` to the attribute. For example, the `product-id` attribute becomes `data-product-id`.
title (optional)	Define a `title` attribute for the component. The default is `Yotpo widget`.
common attributes	This element includes common attributes extended to AMP components.

Validation

See amp-yotpo rules in the AMP validator specification.

Ti servono altre informazioni?

Hai letto questo documento decine di volte ma non risponde a tutte le tue domande? Forse ci sono altre persone col tuo stesso problema: entra in contatto con loro su Stack Overflow.

Vai a Stack Overflow

Hai trovato un bug o una funzione mancante?

Il progetto AMP invita tutti a partecipare e dare il proprio contributo! Ci auguriamo che tu possa partecipare regolarmente alla nostra community open source, ma saremo anche lieti di ricevere eventuali contributi una-tantum sulle questioni che ti interessano.

Vai a GitHub