Guia de integração

Integrar o código do símbolo (opcional)

O código do símbolo do Google Avaliações do Consumidor é o primeiro de dois snippets de código que você deve implementar para fazer a integração do Google Avaliações do Consumidor. O selo é opcional. Se você estiver com problemas para integrar o código dele, acesse esta página para encontrar uma solução.

Veja os temas desta seção:

Instruções de integração

Para integrar o símbolo do Google Avaliações do Consumidor a uma página, você precisa:

  1. atualizar o DOCTYPE;
  2. adicionar o símbolo do Google Avaliações do Consumidor.

Estas tarefas são descritas nas seções abaixo.

Ao implementar o código do símbolo nas suas páginas, a seguinte imagem é exibida (os valores de classificação devem variar):

Normalmente, você precisa ter pelo menos 100 avaliações ao longo do último ano para que sua classificação do vendedor apareça no símbolo.

Não oculte o símbolo com outro conteúdo das suas páginas.

Atualizar o DOCTYPE

Verifique se as páginas da Web nas quais o símbolo é implementado usam o DOCTYPE HTML5:

<!DOCTYPE html>

Esse doctype precisa ser o primeiro item de linha no código HTML da página. Usar o DOCTYPE HTML5 garante que os navegadores da Web renderizem suas páginas no modo padrão em vez de no modo quirks. O modo quirks é uma técnica usada por alguns navegadores da Web para manter a compatibilidade com páginas da Web projetadas para navegadores mais antigos, em vez de ser compatível apenas com os padrões W3C e IETF no modo padrão.

OBSERVAÇÃO: Não inclua comentários ou espaços em branco antes do DOCTYPE.

Adicionar o símbolo do Google Avaliações do Consumidor

Para mostrar aos seus clientes que você usa o Google Avaliações do Consumidor, adicione o símbolo do programa a qualquer página do site em que você quer que ele apareça.

Se você deseja que o símbolo apareça in-line, use o método descrito a seguir. Caso contrário, use o seguinte método para colocá-lo no canto inferior direito ou esquerdo da página.

Para adicionar o selo do Google Avaliações do Consumidor ao seu site, siga estas etapas:

  1. cole o snippet de código abaixo na sua página da Web;

    
    <!-- BEGIN GCR Badge Code -->
    <script src="https://apis.google.com/js/platform.js?onload=renderBadge"
      async defer>
    </script>
    
    <script>
      window.renderBadge = function() {
        var ratingBadgeContainer = document.createElement("div");
          document.body.appendChild(ratingBadgeContainer);
          window.gapi.load('ratingbadge', function() {
            window.gapi.ratingbadge.render(
              ratingBadgeContainer, {
                // REQUIRED
                "merchant_id": MERCHANT_ID,
                // OPTIONAL
                "position": "POSITION"
              });           
         });
      }
    </script>
    <!-- END GCR Badge Code -->
    

    Insira o código antes da tag de fechamento </BODY> na página. Quando colocado juntamente com o código da função de permissão da pesquisa, a ordem não importa.

  2. Substitua os valores em vermelho pelos valores dinâmicos específicos do seu site. A tabela a seguir descreve as configurações disponíveis:
     
    Variável Obrigatório? Descrição
    MERCHANT_ID Obrigatório Seu ID no Merchant Center. É possível descobrir esse valor no Google Merchant Center.
    POSITION Opcional Renderiza o símbolo em uma das seguintes posições:
    • "BOTTOM_RIGHT": faz com que o símbolo flutue no canto inferior direito da página.
    • "BOTTOM_LEFT": faz com que o símbolo flutue no canto inferior esquerdo da página.
    • "INLINE": renderiza o símbolo no local onde o código aparece. Ao usar essa opção, confirme se outros elementos da página não bloqueiam ou ocultam o símbolo. Para um método mais simples, consulte adicionar o símbolo do Google Avaliações do Consumidor in-line.

    A posição padrão do símbolo é "BOTTOM_RIGHT".

     

  3. Cole o snippet de código abaixo na sua página da Web para especificar o idioma usado no selo:
     
    
    <!-- BEGIN GCR Language Code -->
    <script>
      window.___gcfg = {
        lang: 'LANGUAGE'
      };
    </script>
    <!-- END GCR Language Code -->
    

    Insira o código antes da tag de fechamento </BODY> na página. Quando inserido com o código do símbolo, a ordem não importa.

    Para definir o valor do parâmetro lang, substitua LANGUAGE por um dos seguintes idiomas aceitos:

    • af
    • ar
    • cs
    • da
    • de
    • en
    • en-AU
    • en-GB
    • en-US
    • es
    • es-419
    • fil
    • fr
    • ga
    • id
    • it
    • ja
    • ms
    • nl
    • no
    • pl
    • pt-BR
    • pt-PT
    • ru
    • sv
    • tr
    • zh-CN
    • zh-TW

    Se você não especificar um valor para o parâmetro lang, o símbolo usará a configuração de navegador do usuário para escolher o idioma automaticamente.

  4. Repita as etapas de 1 a 3 para todas as páginas do seu site em que você quer que o símbolo seja exibido.
  5. para completar a integração do Google Avaliações do Consumidor, você precisa adicionar o módulo da função de permissão da pesquisa à página de confirmação do pedido. O módulo da função de permissão da pesquisa é obrigatório.

Para adicionar o selo in-line do Google Avaliações do Consumidor, siga estas etapas:

  1. Cole o código a seguir antes da tag de fechamento "body" na sua página HTML para carregar o JavaScript do símbolo.

    
    <script src="https://apis.google.com/js/platform.js" async defer></script>
    
  2. Cole o código abaixo no HTML do local da página em que o selo deve aparecer.
    
    <g:ratingbadge merchant_id=MERCHANT_ID></g:ratingbadge>
    

    Substitua MERCHANT_ID pelo seu próprio código no Merchant Center.

  3. Especifique o idioma usado no símbolo conforme descrito aqui.

  4. Adicione o módulo da função de permissão da pesquisa à sua página de confirmação do pedido. O módulo da função de permissão da pesquisa é obrigatório.

Exemplo do código do símbolo

O exemplo a seguir mostra o código para colocar o símbolo no canto inferior esquerdo da página do ID do comerciante 42:


<!-- BEGIN GCR Badge Code -->
<script src="https://apis.google.com/js/platform.js?onload=renderBadge"
  async defer>
</script>

<script>
  window.renderBadge = function() {
    var ratingBadgeContainer = document.createElement("div");
    document.body.appendChild(ratingBadgeContainer);
    window.gapi.load('ratingbadge', function() {
      window.gapi.ratingbadge.render(
        ratingBadgeContainer, {
          "merchant_id": 42,
          "position": "BOTTOM_LEFT"
        });
    });
  }
</script>
<!-- END GCR Badge Code -->

<!-- BEGIN GCR Language Code -->
<script>
  window.___gcfg = {
    lang: 'en_US'
  };
</script>
<!-- END GCR Language Code -->

Se o selo não aparecer ou você receber mensagens de erro ao carregar a página, consulte a seção Solução de problemas.

Isso foi útil?
Como podemos melhorá-lo?