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®, …

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.

01_PT.png

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.

    02_PT.png

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

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:
    05_PT.png  06_PT.png
         (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.

  1. No âmbito do código Trustbadge encontre a seguinte linha de código:
    data-mobile-enable-custom="false"
  2. Substitua a linha de código pela seguinte linha de código:
    data-mobile-enable-custom="true"
  3. Abra o código fonte do seu website.
  4. 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.


Este artigo foi útil?

Utilizadores que acharam útil: 13 de 24