AMP

amp-auto-ads

Insere anúncios em páginas AMP de maneira dinâmica usando um arquivo de configuração veiculado remotamente.

Disponibilidade Experimental
Script obrigatório <script async custom-element="amp-auto-ads" src="https://cdn.ampproject.org/v0/amp-auto-ads-0.1.js"></script>
Layouts compatíveis N/A

Comportamento

Considerando um número suficiente de colocações válidas (fornecidas na configuração), o amp-auto-ads tenta inserir anúncios adicionais obedecendo ao conjunto de restrições especificado pela rede de publicidade. Essas restrições se limitam:

  • ao número total de anúncios que podem ser inseridos;
  • à distância mínima que precisa haver entre os anúncios adjacentes.

Além disso, os anúncios só são inseridos em locais na página que não causem um novo fluxo inaceitável (conforme determinado por attemptChangeSize).

A tag <amp-auto-ads> precisa ser colocada como o primeiro filho de <body>.

O tipo de rede de publicidade e qualquer outra informação (exigida pela rede) precisam ser especificados na tag.

<amp-auto-ads
    type="adsense"
    data-ad-client="ca-pub-5439573510495356">
  </amp-auto-ads>

Redes de publicidade compatíveis

Atributos

type (obrigatório) Um identificador para a rede de publicidade.
data-foo-bar A maioria das redes de publicidade exige uma configuração maior, que pode ser passada para a rede usando atributos HTML de data-. Os nomes de parâmetros estão sujeitos à conversão de traço para CamelCase do atributo de dados padrão. Por exemplo, "data-foo-bar" é enviado ao anúncio para configuração como "fooBar". Consulte a documentação da rede de publicidade em que os atributos podem ser usados.
common attributes Este elemento inclui atributos comuns estendidos a componentes de AMP.

Especificação de configuração

A configuração define o local na página em que o <amp-auto-ads> pode colocar anúncios. A configuração é buscada em uma rede de publicidade de terceiros no URL definido em ad-network-config.js. A configuração precisa ser um objeto JSON serializado que corresponda à definição de ConfigObj descrita abaixo.

Exemplo de configuração

O exemplo a seguir especifica que o anúncio precisa ser posicionado imediatamente após todos os elementos <P class='paragraph'> que estão dentro do terceiro <DIV id='domId'> na página. Um anúncio colocado em qualquer uma dessas posições precisa ser do tipo BANNER e ter uma margem superior de 4 px e uma inferior de 10 px.

{
  "placements": [
    {
      "anchor": {
        "selector": "DIV#domId",
        "index": 2,
        "sub": {
          "selector": "P.paragraph",
          "all": true,
        },
      },
      "pos": 4,
      "type": 1,
      "style": {
        "top_m": 5,
        "bot_m": 10,
      },
    },
  ]
}

Definições dos objetos

ConfigObj

Os campos a serem especificados no objeto de configuração:

Nome do campo Tipo Descrição
placements Array<!PlacementObj> Um campo obrigatório que indica os possíveis locais em que os anúncios podem ser inseridos na página.
attributes Object<string, string> Um campo opcional que especifica um mapeamento do nome do atributo para atribuir valores a serem aplicados a todos os elementos <amp-ad> injetados usando essa configuração. Somente os seguintes nomes de atributo são permitidos:
  • type
  • layout
  • data-* (ou seja, qualquer atributo de dados)
adConstraints AdConstraintsObj Um campo opcional que especifica as restrições que precisam ser usadas ao colocar anúncios na página. Se não for especificado, o amp-auto-ads tentará usar as restrições padrão especificadas em ad-network-config.js.

PlacementObj

Os campos a serem especificados no objeto de configuração placements:

Nome do campo Tipo Descrição
anchor AnchorObj Um campo obrigatório que fornece informações usadas para consultar elementos na página à qual a posição da colocação está ancorada.
pos RelativePositionEnum Um campo obrigatório que indica a posição da colocação em relação ao elemento âncora.
type PlacementTypeEnum Um campo obrigatório que indica o tipo de colocação.
style PlacementStyleObj Um campo opcional que indica qualquer estilo que precisa ser aplicado a um anúncio inserido nessa posição de colocação.
attributes Object<string, string> Um campo opcional para um mapa do nome do atributo para o valor dos atributos a serem aplicados a todos os elementos <amp-ad> injetados usando essa colocação. Um atributo especificado aqui modifica qualquer outro com o mesmo nome que também esteja especificado no ConfigObj principal. Somente os seguintes nomes de atributo são permitidos:
  • type
  • layout
  • data-* (ou seja, qualquer atributo de dados)

AnchorObj

Os campos a serem especificados no objeto de configuração anchor:

Nome do campo Tipo Descrição
selector string Um campo obrigatório que define um seletor de CSS para selecionar os elementos nesse nível de definição da âncora.
index number Um campo opcional para especificar o índice dos elementos selecionados pelo seletor ao qual esse nível de definição da âncora precisa se limitar. Por padrão, o valor é definido como 0 (se o campo all for definido como falso).
all boolean Ignorado se o campo index tiver sido especificado. Se definido como true, todos os elementos selecionados pelo seletor precisam ser incluídos. Caso contrário, configure como false.
min_c number Um campo opcional que especifica o comprimento mínimo da propriedade textContent de um elemento para que ela seja incluída. O valor padrão é 0.
sub AnchorObj Um campo opcional que especifica um AnchorObj recursivo que selecionará elementos dentro de qualquer elemento selecionado nesse nível de definição da âncora.

PlacementStyleObj

Os campos a serem especificados no objeto de configuração style:

Nome do campo Tipo Descrição
top_m number Um campo opcional que indica a margem superior em pixels que um anúncio inserido nessa posição precisa ter. Valor padrão: 0.
bot_m number Um campo opcional que indica a margem inferior em pixels que um anúncio inserido nessa posição precisa ter. Valor padrão: 0.

RelativePositionEnum

Os valores ENUM para o campo pos no objeto de configuração placements:

Nome Valor Descrição
BEFORE 1 O anúncio precisa ser inserido como irmão imediatamente antes da âncora.
FIRST_CHILD 2 O anúncio precisa ser inserido como o primeiro filho da âncora.
LAST_CHILD 3 O anúncio precisa ser inserido como o último filho da âncora.
AFTER 4 O anúncio precisa ser inserido como irmão imediatamente depois da âncora.

PlacementTypeEnum

Os valores ENUM para o campo type no objeto de configuração placements:

Nome Valor Descrição
BANNER 1 O canal descreve a posição de um anúncio em banner.

AdConstraintsObj

Os campos a serem especificados no objeto de configuração adConstraints:

Nome do campo Tipo Descrição
initialMinSpacing string Um campo obrigatório que indica a distância mínima que um anúncio precisa ter de todos os anúncios que já estão na página no momento da inserção, seja colocado manualmente ou anteriormente pelo amp-auto-ads. Os valores são expressos como um número com prefixo de unidade. Por exemplo, "10px" significa 10 pixels ou "0.5vp" representa a metade da altura de uma janela de visualização. Valores negativos são inválidos. As unidades aceitas são:
  • px: pixels
  • vp: múltiplo da altura da janela de visualização
Esse valor se aplica somente quando o número de anúncios que já estão na página for menor do que qualquer correspondente do adCount especificado no campo subsequentMinSpacing.
subsequentMinSpacing Array<!SubsequentMinSpacingObj> Um campo opcional que especifica os espaços para anúncios que precisam ser aplicados com base em quantos anúncios já estão na página no momento da inserção.
maxAdCount number Um campo obrigatório que especifica o número máximo de anúncios que o amp-auto-ads pode fazer com que haja em uma página. Tanto os anúncios inseridos manualmente quanto os colocados por amp-auto-ads são contabilizados nesse total. Por exemplo, se esse campo for definido como 5 e houver três anúncios inseridos manualmente na página, amp-auto-ads colocará um máximo de dois outros anúncios.

SubsequentMinSpacingObj

Os campos a serem especificados no objeto de configuração subsequentMinSpacing. As entradas de subsequentMinSpacing podem ser usadas para alterar o espaçamento necessário entre anúncios adicionais com base no número de anúncios que já estão na página. Como um exemplo, considere este cenário:

  • Dois anúncios existentes na página
  • O campo subsequentMinSpacing é: [ {adCount: 3, spacing: "500px"}, {adCount: 5, spacing: "1000px"}, ]

Inicialmente, há dois anúncios existentes na página, então nenhum mapeamento corresponde. O espaçamento mínimo, portanto, assume como padrão initialMinSpacing no objeto AdConstraints. O amp-auto-ads tentará colocar anúncios recorrentemente até que fique sem locais que possam ser usados sem corromper os adContraints. Depois que amp-auto-ads colocar o primeiro anúncio, haverá três anúncios na página. Considerando que há um mapeamento para três anúncios (ou mais) no subsequentMinSpacing, o espaçamento mínimo agora se torna 500 px. Isso se aplica até o momento em que houver cinco anúncios na página, porque há uma regra para cinco anúncios. A inserção do sexto anúncio em diante exigiria que outros anúncios ficassem a uma distância de no mínimo 1000 px.

Nome do campo Tipo Descrição
adCount number Um campo obrigatório. O número mínimo de anúncios na página que fazem com que essa regra seja aplicada (supondo que nenhuma outra regra faça uma correspondência melhor). Veja a descrição acima para uma explicação mais detalhada.
spacing string Um campo obrigatório que especifica o espaço para anúncio mínimo que se aplica quando essa regra é correspondida com base em adCount. Os valores são expressos como um número com prefixo de unidade. Por exemplo, "10px" significa 10 pixels ou "0.5vp" representa a metade da altura de uma janela de visualização. Valores negativos são inválidos. As unidades aceitas são:
  • px: pixels
  • vp: múltiplo da altura da janela de visualização

Validação

Consulte as regras do amp-auto-ads rules (link em inglês) nas especificações do validador de AMP.

Precisa de mais ajuda?

You've read this document a dozen times but it doesn't really cover all of your questions? Maybe other people felt the same: reach out to them on Stack Overflow.

Go to Stack Overflow
Found a bug or missing a feature?

The AMP project strongly encourages your participation and contributions! We hope you'll become an ongoing participant in our open source community but we also welcome one-off contributions for the issues you're particularly passionate about.

Go to GitHub