Blog ComercialWeb - São Paulo - SP
E-mail: comercial2@comercialweb.com.br
Atualizado: 03/11/2019

iframe em Páginas AMP

Use amp-iframe para incorporar conteúdo em arquivos AMP via iframe.
Importe o componente amp-iframe no cabeçalho.

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

Os iframes devem estar a 600px da parte superior ou não dentro dos primeiros 75% da janela de exibição quando rolados para a parte superior - o que for menor. Este exemplo pode não funcionar, dependendo da largura da tela. Nesse caso, ele mostrará apenas um indicador de carregamento.

<amp-iframe width="500"
  height="281" title="Marca da Netflix no House of Cards: The Stack" layout="responsive"  sandbox="allow-scripts permitem a mesma origem permitir pop-ups de permissões" allowfullscreen frameborder="0" src="https://player.vimeo.com/video/140261016">
</amp-iframe>


A incorporação do Google Maps é possível por meio da (API) de incorporação do Google Maps e requer uma chave da API.

<amp-iframe width="600"
  height="400"
  title="Google map pin on Googleplex, Mountain View CA"
  layout="responsive"
  sandbox="allow-scripts allow-same-origin allow-popups"
  frameborder="0"
  src="https://www.google.com/maps/embed/v1/place?q=place_id:API_KEY">
</amp-iframe>


Veja o resultado

Fonte: Redação

Comente esta matéria:


Compartilhe esta matéria




Veja Também