Criar um selo de confiança

Um selo de confiança é um bloco de ícones de pagamento, segurança, envio, garantia ou políticas, com título e descrição opcionais. O editor tem duas abas: Design, para conteúdo e estilo, e Placement, para a posição integrada na página de produto e o shortcode.

1. Abra Trust Badges

   No admin da Shopify, abra Sami Product Labels, selecione Extra Features na navegação do app e depois a aba Trust Badges.

   Se você já tem selos de confiança, a página os mostra em uma tabela. Se a lista estiver vazia, a página mostra o painel Create your first trust badge.

   

   A aba Trust Badges contém a ação de criar, os selos de confiança salvos e os modelos em destaque.

2. Escolha como começar

   Clique em Create trust badge. O botão aparece no cabeçalho da página quando a tabela está visível ou no painel de estado vazio quando você ainda não criou nenhum selo de confiança.

   Role até Featured templates. Clique em View all templates para mostrar os quatro designs: Eco-Friendly template, With payment method, Policies store template e Badge box template. Clique em Select em um modelo para abri-lo com os ícones e o estilo já aplicados.

   As duas opções abrem o editor na aba Design.

   

   Crie um selo de confiança do zero ou selecione um dos quatro modelos em destaque.

3. Dê um nome ao selo de confiança

   O campo de nome aparece acima da prévia. Substitua New Trust Badge por um nome de até 50 caracteres. Esse nome serve apenas para identificar o selo de confiança no app e não é exibido para quem compra.

   

   Use um nome interno claro para encontrar o selo de confiança com facilidade na tabela.

4. Adicione um título e uma descrição

   Em Content & Badges, abra Title e Description e digite o texto opcional que aparece acima dos ícones. Os dois campos aceitam negrito, itálico, sublinhado, emoji, alinhamento de texto e modo de código-fonte.

   Os campos são específicos por idioma. Os rótulos mostram o idioma ativo, por exemplo Title (en). Use o seletor de idioma acima da prévia para editar outro idioma.

   Deixe os dois campos vazios se quiser exibir somente os ícones.

   

   Title e Description são campos opcionais de texto formatado, editados separadamente para cada idioma.

5. Adicione ícones de selo

   Em Badges, clique em Add Badge e escolha:

   Opção	O que ela faz
   Select badge image	Abre a caixa de diálogo Select Image.
   Line break	Inicia os ícones seguintes em uma nova linha.

   Em Select Image, use Search images para encontrar um ícone. A origem Library contém mais de 400 imagens de pagamento, segurança, envio, garantia e políticas; a contagem atual de itens aparece ao lado do nome da origem. Selecione uma ou mais imagens e clique em Select Image.

   Mude para Design your Images para usar designs enviados, importados por URL ou personalizados relacionados. Depois de selecionar uma imagem, clique em Edit with AI se quiser criar uma variação antes de adicioná-la.

   

   Pesquise na biblioteca integrada ou mude para Design your Images e depois confirme a seleção.

6. Reordene e configure cada ícone

   Cada ícone aparece como uma linha na lista Badges. Arraste a linha pela alça para mudar a ordem de exibição ou clique em Delete para removê-la. Use itens Line break para controlar onde uma nova linha começa.

   Clique no botão General da linha para abrir as configurações dela:

   • Change Image — substitui o ícone selecionado.
   • Link — faz o ícone abrir uma URL; use a opção de link externo para abri-la em uma nova guia.
   • Tooltip — adicione até 150 caracteres exibidos quando alguém aponta para o ícone.
   • Layout colors — recolora as camadas compatíveis dos ícones SVG integrados.

   

   Arraste os ícones para reordená-los e use General para alterar a imagem, o link, a dica ou as cores compatíveis.

7. Estilize o bloco do selo de confiança

   Use as seções de design recolhíveis para combinar o selo de confiança com o seu tema:

   Seção	Principais configurações
   Design Main Section	Largura do bloco, margem, espaçamento interno, tamanho/estilo/cor da borda, sombra e raio dos cantos.
   Design title & description	Fonte personalizada, cor, tamanho da fonte e altura da linha do título e da descrição.
   Design Badge	Estilo mono, mono em cartão, original ou original em cartão; alinhamento; largura e altura; margem; e animação.
   Responsive size	Largura e altura dos ícones separadas para tablet e celular.
   Advance Section	CSS personalizado e uma CSS reference clicável com os seletores do selo de confiança.

   As animações disponíveis são SlideInUp, SadeInDown, BounceIn, FlipInX e ZoomIn. Ative Animation, selecione um efeito e use o botão de reproduzir para ver a prévia.

   

   Abra cada seção de design para estilizar o contêiner, o texto, os ícones, os tamanhos responsivos e o CSS personalizado.

   Nota

   Em Advance Section, clique em um seletor em CSS reference para inserir a regra correspondente no editor de CSS personalizado.

8. Escolha onde o selo de confiança aparece

   Mude para a aba Placement:

   Opção	O que ela faz
   Product page	Ative a chave para exibir o selo de confiança na posição integrada do app em todas as páginas de produto.
   Shortcode	Copie o trecho quando quiser posicionar o selo de confiança em um local personalizado do tema.

   Um selo de confiança não salvo usa data-id="new" no shortcode. Salve o selo de confiança antes de colocar esse trecho no tema.

   

   Use a posição integrada da página de produto ou copie o shortcode para uma posição personalizada.

   Nota

   Veja Posicionar um selo de confiança com shortcode para o fluxo completo no editor de temas.

9. Veja a prévia e salve

   Use os controles acima da prévia para:

   • trocar o idioma de edição;
   • visualizar a Product page;
   • alternar entre as visualizações de computador e celular;
   • mostrar ou ocultar o produto de exemplo;
   • definir o selo de confiança como Active ou Draft.

   Confira a prévia e clique em Save no canto superior direito. Clique em Discard se quiser sair sem manter as edições não salvas.

   

   Veja o resultado, escolha Active ou Draft e salve o selo de confiança.

Próximos passos

• Visão geral dos selos de confiança — gerencie selos de confiança salvos, modelos, status e posicionamento.
• Posicionar um selo de confiança com shortcode — adicione o selo de confiança em uma posição exata do tema.

Dica

Precisa de ajuda?

Se tiver qualquer dificuldade ao seguir estas etapas, entre em contato pelo e-mail [email protected].