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

amp-gfycat

Introduction

Use the amp-gfycat component to embed animated GIFs from gfycat in your AMP HTML files.

Setup

Import the amp-gfycat component.

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

Basic usage

Embed an animated GIF from gfycat via the data-gfyid attribute. We recommend using responsive layout for better experience. Find a list of all supported layouts here. The width and height attributes should be the actual width and height of the Gfycat, you can find them by going to https://gfycat.com/name, click on the embed link and copy the width and height specified in the fixed IFRAME field.

<amp-gfycat data-gfyid="TautWhoppingCougar"
  width="640"
  height="360"
  layout="responsive">
</amp-gfycat>

Disabling auto play

By default video is autoplaying. It's possible to turn it off by setting noautoplay attribute.

<amp-gfycat data-gfyid="TautWhoppingCougar"
  width="640"
  height="360"
  layout="responsive"
  noautoplay>
</amp-gfycat>
Требуются дальнейшие объяснения?

Если на этой странице нет ответов на все ваши вопросы, обратитесь к другим пользователям AMP и обсудите свой конкретный сценарий использования.

Перейти на Stack Overflow
Не нашли пояснения к функции?

Проект AMP активно поощряет ваше участие и сотрудничество! Мы надеемся, что вы станете постоянным участником нашего открытого сообщества, но разовые вклады в работу над задачами, которые вам особенно интересны, также приветствуются.

Редактировать пример на GitHub