Nota: Esta filial é para o módulo compatível com Nuxt 3 . Faça o check-out legacy-v2
Braia para suporte ao NUXT 2 .
Google AdSense Integration for Nuxt.js. Os anúncios serão atualizados sempre que a rota da página mudar
@nuxtjs/google-adsense
dependência usando fios ou npm ao seu projeto@nuxtjs/google-adsense
a modules
seção de nuxt.config.js
{
modules : [
// Simple usage
[ '@nuxtjs/google-adsense' , {
id : 'ca-pub-###########'
} ]
]
}
Usando opções de nível superior:
{
modules : [
[ '@nuxtjs/google-adsense' ]
] ,
googleAdsense : {
id : 'ca-pub-#########'
}
}
Usando a configuração de tempo de execução:
{
modules : [
[ '@nuxtjs/google-adsense' ]
] ,
googleAdsense : {
onPageLoad : false ,
pageLevelAds : false ,
} ,
publicRuntimeConfig : {
googleAdsense : {
id : process . env . GOOGLE_ADSENSE_ID ,
test : process . env . GOOGLE_ADSENSE_TEST_MODE === 'true' ,
} ,
} ,
}
O código de anúncio assíncrono ( //pagead2.googlesyndication.com/pagead/js/adsbygoogle.js
) é adicionado automaticamente à seção <head>
de suas páginas.
Opção | tipo | descrição |
---|---|---|
id | Corda | Seu ID do cliente do Google Adsense Publisher (ou seja, ca-pub-######### ). Exigido quando não estiver no modo de teste. |
adFormat | Corda | Define um formato de anúncio padrão global. Pode ser substituído por adereços de componentes. |
analyticsDomainName | Corda | Domínio da conta do Google Analytics (se vincular análises ao Adsense, ou seja, example.com ). |
analyticsUacct | Corda | ID da conta do Google Analytics (se vincular análises ao Adsense, ou seja, UA-#######-# ). |
hideFilled | Booleano | Quando false , anúncios não preenchidos não serão ocultos, quando anúncios true não preenchidos serão ocultos. O padrão é false . |
includeQuery | Booleano | Quando false , apenas $route.path é verificado para alterações. Se definido como true $route.query também será levado em consideração. O padrão é false . |
onPageLoad | Booleano | Carrega o script do Adsense após o carregamento da página. O padrão é false . |
overlayBottom | Booleano | Ative os anúncios de âncora do Adsense aparecem no fundo. O padrão é false . Consulte os documentos do Adsense para obter detalhes. |
pageLevelAds | Booleano | Ativar anúncios no nível da página do Adsense. O padrão é false . Consulte os documentos do Adsense para obter detalhes. |
pauseOnLoad | Booleano | Pussa solicitações de anúncios para obter o consentimento do usuário para usar cookies ou outro armazenamento local de acordo com o GDPR. Consulte os documentos do Adsense para obter detalhes. false . |
tag | Corda | Nome da tag do componente do Adsense. Padrões para adsbygoogle . |
test | Booleano | Força o adsense no modo de teste (veja abaixo). |
O módulo Adsense alternará automaticamente para o modo test
ao executar o NUXT no modo dev
. Mas você pode manter o modo de teste ativado na produção definindo o test
da opção de configuração como true
.
O modo de teste usa um ID do editor de teste, para que você não esteja violando o AdSense TOS.
Observe que os anúncios de teste normalmente aparecem como um espaço vazio, mas terão as dimensões corretas (ou seja, ocupará o espaço correto necessário para o anúncio renderizado).
Insira o componente <Adsbygoogle />
onde quer que você deseje um anúncio colocado.
Você deve colocar o componente <Adsbygoogle />
dentro de um elemento de contêiner com uma largura especificada (min /max) e altura (min /max) (que pode ser baseada em consultas de mídia) ou estilo de uso ou classes no <Adsbygoogle />
Componente para restringir o anúncio a um tamanho específico (ou tamanhos).
Use a propriedade ad-slot
para especificar seu valor de slot de anúncios do Google AdSense (especificado como uma string).
Consulte a documentação do Adsense para obter mais informações. Documentação do Google Adsense
Adereços de componentes:
prop | tipo | descrição |
---|---|---|
ad-slot | Corda | Google AdSense Adslot. Este suporte é necessário quando não está no modo de teste . Consulte sua conta do AdSense para obter valores de slot de anúncios. |
ad-format | Corda | Opcional. Consulte os documentos do Adsense para outras opções |
ad-style | Objeto | Estilos a serem aplicados ao elemento renderizado <ins> . Padrão: { display: 'block' } . Consulte os documentos de ligação ao estilo Vuejs para o formato do objeto. |
ad-layout | Corda | Opcional. Consulte os documentos do Adsense |
ad-layout-key | Corda | Opcional. Consulte os documentos do Adsense |
hide-unfilled | Booleano | Opcional. Esconde anúncios não preenchidos se verdadeiros. |
page-url | Corda | Opcional. Defina um URL da página de referência (de conteúdo semelhante) se o anúncio estiver em uma página que requer autenticação. Quando definido, este suporte deve ser um URL totalmente qualificado (incluindo protocolo e nome de host). |
include-query | Booleano | Substituir a opção global includeQuery em uma base de anúncio. Verifique se todos os anúncios em uma página têm a mesma configuração. |
analytics-uacct | Corda | ID da conta do Google Analytics (se vincular análises ao Adsense, ou seja, UA-#######-# ). Padrões para o valor especificado na opção de plug -in analyticsUacct . |
analytics-domain-name | Corda | Domínio da conta do Google Analytics (se vincular análises ao Adsense, ou seja, example.com ). Padrões para o valor especificado na opção Plugin analyticsDomainName . |
Dados internos expostos ao componente | nome | tipo | Descrição | ____ | ____ | ___________ | showAd
| método | Acionar o método de show anúncio para mostrar o anúncio. | updateAd
| método | Acionar o método de anúncio de atualização para atualizar o anúncio. | isUnfilled
| Ref calculado | Rastreia o atributo não preenchido no elemento de anúncio. Retorna true
se data-ad-state
= 'não preenchido'.
Sempre que sua rota mudar ou, opcionalmente, se os parâmetros da consulta de rota mudarem, qualquer anúncio exibido será atualizado, assim como faria com cargas de página normais.
page-url
no componente <Adsbygoogle />
no URL de uma página no seu site que é acessível ao público, que teria conteúdo semelhante /relevante. Este módulo usa uma técnica desenvolvida pela equipe Angular (com a ajuda do Google AdSense) para lidar com os anúncios de atualização em aplicativos da Web progressivos:
Cada vez que um novo anúncio é solicitado, o parâmetro AdSense data-ad-region
é atualizado para um valor aleatório. Por esse motivo, você não pode definir o atributo data-ad-region
no componente <Adsbygoogle />
.
MIT Licença