Escolhendo um layout de widget e uma decoração de fundo

Este guia aborda três configurações de aparência do seu widget de pacote: o layout geral, a largura máxima do contêiner e uma decoração de fundo opcional na oferta selecionada. Abra a aba Estilo para acessar os controles de layout, largura e decoração.

Defina o layout do widget

O layout controla como os cartões de oferta, seus níveis de quantidade, são organizados no widget.

1. Abra o pacote que você deseja editar.
2. Abra a aba Estilo.
3. Em Layout do widget, escolha uma das opções:
   • Empilhado - os cartões de oferta ficam um acima do outro. Esta é a opção padrão.
   • Grade - os cartões de oferta ficam lado a lado.

Use a prévia ao vivo para conferir qual organização se adapta melhor à página do seu produto.

Esta configuração organiza os cartões de oferta. Para organizar os produtos dentro de uma oferta de pacote de produtos, use os controles separados de layout do pacote dessa oferta.

Escolha a largura máxima do contêiner

A largura máxima define até que largura o contêiner inteiro do widget pode se expandir na página do produto. Ela fica na seção Contêiner da aba Estilo.

1. Na aba Estilo, abra a seção Contêiner.
2. Use o menu suspenso Largura máxima para escolher uma destas opções:
   • Padrão da Shopify (44rem) - limita o widget a 44rem dentro do espaço disponível.
   • Largura total (100%) - o widget preenche o espaço disponível na coluna. Esta é a opção padrão para novos pacotes.
   • Personalizada - defina seu próprio valor.
3. Se você selecionar Personalizada, o campo Largura será exibido. Insira um valor em pixels (px).

A largura total preenche o contêiner pai disponível, mas não amplia a coluna de informações do produto do seu tema. Para ajustar o espaçamento acima e abaixo do widget, use Margem superior e Margem inferior no mesmo painel Contêiner. Consulte largura e alinhamento do widget se o layout ao redor do widget no tema for a limitação.

Adicionar uma decoração de fundo

Uma decoração adiciona um efeito de fundo animado ao cartão da oferta. A decoração é reproduzida apenas na oferta selecionada, chamando a atenção para o nível escolhido pelo cliente.

1. Na aba Estilo, ative o botão Decoração. Ele fica desativado por padrão, e desativá-lo remove a decoração.
2. Escolha um dos estilos exibidos:
   • Formas
   • Anéis
   • Corações
   • Explosão de estrelas
   • Porcentagem
   • Estrelas
   • Relógio
   • Dinheiro

Cada opção tem seu próprio ícone no seletor, para que você possa diferenciar os estilos. Os ícones são símbolos simples, não uma representação exata do efeito. Confira a prévia ao vivo para ver como a animação realmente fica e confirmar se ela combina bem com a cor de fundo da oferta selecionada.

Dica: deixe o bloco de brindes transparente

Se o seu pacote oferece um brinde gratuito e você ativa uma decoração, o bloco de brindes pode ficar sobre o efeito e ocultá-lo. Quando isso acontece, o Bundlex exibe uma sugestão abaixo dos estilos de decoração: Deixar o bloco de brindes transparente.

Clique em Aplicar nessa sugestão para adicionar transparência à cor de fundo do brinde selecionado, permitindo que a decoração apareça atrás dele. Você também pode fazer isso manualmente na seção Brinde e upsell, reduzindo a opacidade da cor de fundo de Brinde da oferta selecionada.

Esta sugestão só aparece quando uma decoração está ativa, o pacote inclui pelo menos um brinde e a cor de fundo do brinde selecionado ainda está totalmente opaca, sem transparência.