Como posso adaptar a apresentação móvel do Trustbadge®?

Ainda não integrou o Trustbadge? Então, faça a integração padrão antes de continuar. Este artigo irá ajudar com isso: Como posso integrar o Trustbadge® sem plug-in na minha loja?
No artigo hiperligado acima encontrará também o código Trustbadge, que constitui a base para todos os ajustes descritos no seguinte texto.

Pode configurar a apresentação móvel do Trustbadge independentemente da apresentação na vista Desktop. Na integração padrão, as seguintes regras são especificadas para o Trustbadge móvel:

• O Trustbadge apresenta as estrelas de avaliação que ganhou e, depois de obter com sucesso a certificação, o seu selo de qualidade.
• O Trustbadge é apresentado do lado esquerdo do ecrã.
• O Trustbadge é apresentado 10 píxeis acima da margem inferior do ecrã.

Naturalmente, pode adaptar estas regras às suas necessidades individuais. Neste artigo, explicamos como, por meio do código Trustbadge®, …

• … pode alterar a apresentação do Trustbadge móvel.
• … pode colocar o Trustbadge num outro local da sua vista móvel.
• … pode desativar o modo Fade-out.

Como posso apresentar o Trustbadge móvel de outra forma?

Dentro da integração padrão, o Trustbadge apresenta as estrelas de avaliação que ganhou e, depois de obter com sucesso a certificação, o seu selo de qualidade.

O código Trustbadge permite-lhe alterar a apresentação do Trustbadge de três formas:

• Pode ocultar as estrelas de avaliação ganhas e mostrar apenas o seu selo de qualidade.
  
  

  

• Também pode utilizar a variante Desktop do Trustbadge na vista móvel do seu website.
  
• Na vista móvel, pode utilizar a variante Topbar do Trustbadge.
  

Ocultar estrelas de avaliação

1. No âmbito do código Trustbadge encontre a seguinte linha de código:

   data-mobile-disable-reviews="false"

2. Substitua a linha de código pela seguinte linha de código:

   data-mobile-disable-reviews="true"

Desta forma, as estrelas de avaliação na vista móvel são ocultadas com sucesso.

Utilizar a versão Desktop do Trustbadge na vista móvel

1. No âmbito do código Trustbadge encontre a seguinte linha de código:

   data-disable-mobile="false"

2. Substitua a linha de código pela seguinte linha de código:

   data-disable-mobile="true"

Assim, também utiliza a variante Desktop do Trustbadge na vista móvel.

Utilizar a variante Topbar do Trustbadge

1. No âmbito do código Trustbadge encontre a seguinte linha de código:

   data-mobile-enable-topbar="false"

2. Substitua a linha de código pela seguinte linha de código:

   data-mobile-enable-topbar="true"

Assim, na vista móvel, utiliza a variante Topbar do Trustbadge.

A variante Topbar do Trustbadge está posicionada de forma fixa na margem superior do ecrã. Não pode alterar este posicionamento.

Como posso colocar o Trustbadge móvel num outro sítio?

Na integração standard, o Trustbadge móvel é apresentado no lado esquerdo do ecrã e 10 píxeis acima da margem inferior do ecrã.

Por meio do código Trustbadge, o Trustbadge móvel pode ser…

… deslocado horizontalmente da margem esquerda do ecrã para o centro ou para a direita.

… deslocado verticalmente para cima ou para baixo.

… colocado de forma flexível na vista móvel do seu website.

Colocar o Trustbadge na margem direita do ecrã ou no centro

1. No âmbito do código Trustbadge encontre a seguinte linha de código:

   data-mobile-position="left"

2. Substitua a linha de código por uma das seguintes linhas de código:
   - Se pretender colocar o Trustbadge no lado direito:

   data-mobile-position="right"

   - Se pretender colocar o Trustbadge no centro:

   data-mobile-position="center"

Desta forma, coloca o Trustbadge com sucesso na margem direita do ecrã ou no centro.

Deslocar o Trustbadge para cima ou para baixo

1. No âmbito do código Trustbadge encontre a seguinte linha de código:

   data-mobile-y-offset="0"

2. Substitua o 0 pelo número de píxeis necessários para mover o Trustbadge para cima ou para baixo.

Dois exemplos:

• Pretende mover o Trustbadge 5 píxeis para cima? Nesse caso, utilize a seguinte linha de código:

  data-mobile-y-offset="5"

• Pretende mover o Trustbadge para baixo? Então, utilize valores negativos. Para mover o Trustbadge 5 píxeis para baixo, utilize a seguinte linha de código:

  data-mobile-y-offset="-5"

  Utilize aqui exclusivamente valores até -10.

Desta forma, o Trustbadge é deslocado com sucesso para baixo ou para cima.

Colocar o Trustbadge de forma flexível no seu website

Além da variante standard de Trustbadge descrita até à data, também pode integrar a variante Custom na vista móvel do seu website.

A variante Custom distingue-se da variante padrão em três pontos:

1. Tem um aspeto diferente da variante padrão. Aqui, pode ver a variante Custom:
    
        (com estrelas de avaliação)                                              (sem estrelas de avaliação)
2. Pode colocar a variante Custom de forma totalmente flexível no seu website.
3. Pode alterar o tamanho da variante Custom (personalizada).

Por predefinição, a variante Custom tem na vista móvel uma largura de 156 píxeis e uma altura de 78 píxeis. A seguir, explicamos-lhe como pode alterar o tamanho do Trustbadge numa vista móvel. Está de acordo com os valores padrão acima mencionados? Então, ignore os dois passos seguintes e continue a partir do passo 3.

1. No âmbito do código Trustbadge encontre a seguinte linha de código:

   data-mobile-custom-width="156"

2. Substitua 156 pelo número de píxeis que pretende determinar como largura do Trustbadge.

O número de píxeis que pode selecionar neste ponto depende do facto de ter ocultado, ou não, as estrelas de avaliação na vista móvel.

• Ocultou as estrelas de avaliação? Então, selecione um número de píxeis entre 32 e 58.
• Não ocultou as estrelas de avaliação? Então, selecione um número de píxeis entre 100 e 500.

O número de píxeis para a altura do Trustbadge resulta automaticamente da largura que selecionou. Este não precisa de ser determinado por si.

3. No âmbito do código Trustbadge encontre a seguinte linha de código:

   data-mobile-enable-custom="false"

4. Substitua a linha de código pela seguinte linha de código:

   data-mobile-enable-custom="true"

5. Abra o código fonte do seu website.
6. Coloque a seguinte linha de código na posição do seu website, onde pretende que o Trustbadge apareça:

   <div id="trustbadgeCustomMobileContainer"></div>

As posições possíveis seriam, por exemplo, o cabeçalho ou o rodapé.

Desta forma, integra com sucesso o Trustbadge no local que seleciona no seu website.

Como posso desativar o modo Fade-out do Trustbadge móvel?

Na vista móvel, o modo Fade-out é ativado automaticamente. Neste modo, o Trustbadge é apresentado na parte superior de cada página. Contudo, irá desaparecer lentamente assim que o seu cliente deslizar para baixo. Voltará a aparecer quando o seu cliente regressar à área superior da página. Pode desativar o modo Fade-out para que o Trustbadge deixe de ser ocultado.

1. No âmbito do código Trustbadge encontre a seguinte linha de código:
   

   data-mobile-enable-fadeout="true"

2. Substitua a linha de código pela seguinte linha de código:

   data-mobile-enable-fadeout="false"

Desta forma, desativa com sucesso o modo Fade-out na vista móvel.