Exibir por dispositivo e página

A guia Display do editor de selos decide onde e quando um selo aparece, depois que a guia Products decidiu a quais produtos ele se aplica.

A guia é uma lista de seções recolhíveis:

Seção	O que ela controla	Documentada em
Customer conditions	Quem vê o selo (logado, tags, clientes específicos)	Direcionar por cliente
Page conditions	Em quais tipos de página o selo aparece	Esta página
Language conditions	O idioma da loja em que a pessoa está navegando	Direcionar por país e idioma
Country conditions	O país da pessoa visitante	Direcionar por país e idioma
Other conditions	Imagem do produto, dispositivo e elementos do tema excluídos	Esta página
Visibility Date & Countdown	Datas de início e término e contagens regressivas	Agendar a visibilidade
Priority conditions	Qual selo prevalece quando vários se aplicam a um produto	Esta página

A guia Display. As seções com um chevron se expandem; as seções com um switch precisam ser ativadas primeiro.

Nota

As seções com um chevron (⌄) apenas se expandem. As seções com um switch (Language, Country, Priority) precisam ser ativadas antes de os campos aparecerem.

Abra a guia Display

1. Abra o app

   No admin da Shopify, acesse Apps → Sami Product Labels.

2. Abra Badges & Labels

   No menu à esquerda do app, clique em Badges & Labels. A lista mostra cada selo com Id, nome, prévia, tipo, prioridade, posição e status.

   

   A lista Badges & Labels. Clique no ícone de lápis na coluna Actions para editar um selo.

3. Edite o selo

   Clique no ícone de lápis na coluna Actions do selo que você quer configurar. O editor abre com três guias: Design, Products, Display.

4. Acesse Display

   Clique na guia Display.

Nota

Os botões Save e Discard no canto superior direito só aparecem quando você altera algo. Se quiser abandonar as edições, clique em Discard → Discard changes.

Page conditions

Por padrão, um selo aparece em todas as páginas em que o produto aparece. Adicione uma condição de página para limitá-lo a certos tipos de página.

Como adicionar uma condição de página

1. Expanda Page conditions

   Clique na linha Page conditions para expandi-la. Um botão + Add conditions aparece.

   

   Uma seção Page conditions vazia: sem nenhuma regra, o selo aparece em todo lugar.

2. Clique em + Add conditions

   Uma linha de condição aparece com três campos: Page (fixo), um operador e um tipo de página. Os padrões são Page is equal to Index page.

   

   Cada clique em + Add conditions adiciona uma linha. Use o ícone de lixeira no fim de uma linha para removê-la.

3. Escolha o operador

   • is equal to — exibe o selo somente no tipo de página selecionado.
   • is not equal to — exibe o selo em qualquer lugar, exceto no tipo de página selecionado.

4. Escolha o tipo de página

   Opção	Onde o selo aparece
   Index page	A página inicial da sua loja virtual
   Collection page	Páginas de listagem de coleções e categorias
   Product page	Páginas individuais de produto
   Article Page	Páginas de artigos do blog
   Blog page	Páginas de listagem do blog
   Cart page (including cart drawer)	A página do carrinho e o carrinho lateral deslizante
   Search page	Páginas de resultados de busca
   Specific pages	Somente a URL exata que você informar (veja a próxima etapa)

   

   Os oito tipos de página disponíveis para uma condição de página.

5. Em Specific pages, informe a URL

   Ao escolher Specific pages, um quarto campo é adicionado. Informe a URL completa da página na loja virtual, por exemplo https://your-store.myshopify.com/pages/summer-sale. O texto de exemplo mostra a URL da sua própria loja como guia.

   

   Specific pages adiciona um campo de URL: cole a URL completa da página, e não apenas o caminho.

6. Salve

   Clique em Save no canto superior direito.

Cuidado

Um selo ainda precisa corresponder também à guia Products. Uma condição de página restringe onde um produto correspondente exibe seu selo; ela nunca faz o selo aparecer em produtos aos quais ele não se aplica.

Other conditions

Expanda Other conditions para controlar qual imagem do produto leva o selo, quais dispositivos o veem e quais elementos do tema ignorar.

Configuração	Opções	Comportamento
Show on (product page)	All images / First image	Exibe o selo em todas as imagens da galeria ou somente na primeira imagem (principal) do produto.
Device targeting	All devices / Desktop / Mobile	Limita o selo a quem usa computador ou celular, ou o exibe em todos os dispositivos.
Do not show label on	Lista de classes CSS — .CLASS1, .CLASS2,...	O selo não é renderizado em nenhum elemento que corresponda a essas classes. Útil quando um slider, uma visualização rápida ou uma seção de upsell do seu tema não combina com o posicionamento de selos.

As configurações de imagem, dispositivo e exclusão ficam todas em Other conditions.

Nota

Do not show label on espera seletores de classe CSS separados por vírgulas, cada um começando com um ponto, por exemplo .product-card__slider, .quick-view. Inspecione o elemento no seu tema para encontrar o nome da classe.

Priority conditions

Quando vários selos correspondem ao mesmo produto, a prioridade decide qual deles é exibido.

1. Ative Priority conditions

   Clique no switch da linha Priority conditions. Um campo Priority value aparece.

2. Informe um valor de prioridade

   Digite um número de 0 a 100. 0 é a prioridade mais alta e 100 é a mais baixa. O app mostra a mesma dica abaixo do campo.

   

   Número menor = prioridade maior. Um selo fica oculto se o produto já tiver um selo de prioridade mais alta.

3. Salve

   Clique em Save. O valor passa a aparecer na coluna Priority da lista Badges & Labels, para você comparar todos os seus selos de relance.

Cuidado

Os selos com a prioridade desativada aparecem como None na lista e não participam da comparação. Se você quer que um selo prevaleça de forma confiável sobre outro, defina um valor de prioridade nos dois.

Exemplo de prioridade

Selo	Valor de prioridade	Resultado em um produto que corresponde aos dois
Sale off	0	Exibido
Best seller	10	Oculto

Próximas etapas

• Alterar a posição do selo: ajuste onde o selo fica na imagem do produto.
• Direcionar produtos: escolha quais produtos exibem seu selo.
• Agendar a visibilidade: defina datas de início e término para um selo.

Dica

Precisa de ajuda?

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