O Bloco de Estoque de Produto exibe a disponibilidade de estoque em tempo real para cada produto WooCommerce em seus Modelos de Produto Único. Mostrar aos clientes exatamente quantas unidades estão em estoque cria urgência e ajuda os compradores a tomarem decisões de compra mais rápidas.
Este bloco foi projetado exclusivamente para uso em Modelos de Produto Único. Ele usa um shortcode dinâmico para buscar automaticamente a contagem de estoque do WooCommerce para cada produto, garantindo que as informações permaneçam precisas sem atualizações manuais. Você também pode combinar o shortcode com texto personalizado, ajustar o tamanho da fonte e o alinhamento, e estilizar a saída com tipografia, cores e efeitos de sombra.
Adicionando o Bloco de Estoque de Produto às Suas Páginas
Siga estas etapas para adicionar um bloco de Estoque de Produto ao seu Modelo de Produto Único do SeedProd:
Etapa 1: Adicionar o Bloco
Em Design > Blocos > Tags de Modelo do WooCommerce, arraste e solte o bloco Estoque de Produto na seção desejada do seu Modelo de Produto Único.
Etapa 2: Configurar as Definições de Conteúdo
Após adicionar, clique no bloco de Estoque de Produto para abrir suas configurações. Na aba Conteúdo, você pode editar o texto de exibição do estoque, ajustar o alinhamento e definir o tamanho da fonte.
- Texto: O campo de conteúdo é pré-preenchido com o shortcode
, que busca dinamicamente a contagem de estoque do WooCommerce para cada produto. Você pode adicionar texto personalizado antes ou depois do shortcode — por exemplo, “Apenas restam em estoque!” — para criar uma mensagem mais atraente. Alterne entre o Editor Visual (texto rico) e os modos Editar HTML (código) usando o botão abaixo do campo. - Alinhamento: Defina o alinhamento horizontal do texto de estoque — Esquerda, Centro ou Direita. Suporta alinhamento por dispositivo para desktop, tablet e celular.
- Tamanho da Fonte: Defina o tamanho da fonte do texto de estoque usando o controle deslizante (10–72px).
Etapa 3: Personalizar o Design
Na aba Avançado, você pode estilizar a aparência do bloco e controlar sua visibilidade em diferentes dispositivos.
Estilos:
- Tipografia: Defina a família da fonte, peso, altura da linha, espaçamento entre letras e transformação de texto para o texto de estoque.
- Cor: Defina a cor do texto da exibição de estoque.
- Sombra do Texto: Adicione um efeito de sombra diretamente ao texto de estoque. Escolha entre tamanhos predefinidos (Nenhum, Fio de Cabelo, Pequeno, Médio, Grande, X Grande, 2X Grande) para adicionar profundidade sutil ou dramática ao texto.
- Sombra: Adicione uma sombra de caixa ao elemento geral do bloco para destacá-lo visualmente do fundo da página.
Espaçamento:
- Margem: Controle o espaçamento externo ao redor do seu bloco de Estoque de Produto (Superior, Direita, Inferior, Esquerda). Isso determina quanto espaço aparece entre a exibição de estoque e os elementos circundantes na página.
- Preenchimento: Ajuste o espaçamento interno do seu bloco de Estoque de Produto (Superior, Direito, Inferior, Esquerdo). Isso cria um espaço entre o texto de estoque e as bordas do bloco.
Atributos:
- ID CSS: Exibe o identificador exclusivo gerado automaticamente para o seu bloco de Estoque de Produto. Este ID é criado automaticamente pelo SeedProd para estilização personalizada ou direcionamento de JavaScript.
- Classe Personalizada: Adicione classes CSS personalizadas para aplicar estilos específicos do seu tema ou CSS personalizado.
- Atributos Personalizados: Adicione quaisquer atributos HTML ao elemento wrapper do bloco. Insira cada atributo em uma nova linha usando o formato: nome-do-atributo|valor (por exemplo, data-estoque|disponivel).
Visibilidade do Dispositivo:
- Ocultar no Desktop: Oculte o bloco de Estoque de Produto em telas de desktop.
- Ocultar no Tablet: Oculte o bloco de Estoque de Produto em dispositivos tablet.
- Ocultar no Celular: Oculte o bloco de Estoque de Produto em dispositivos móveis.
Efeitos de Animação:
- Animação de Entrada: Escolha entre vários efeitos de animação que são reproduzidos quando o bloco de Estoque de Produto entra na tela. As opções incluem Bounce, Fade In, Zoom In, Rotate In e muitas outras.
Etapa 4: Salve Suas Alterações
Depois de terminar de configurar o bloco de Estoque de Produto e personalizar sua aparência, certifique-se de salvar seu trabalho.
Você adicionou com sucesso um bloco de Estoque de Produto ao seu Modelo de Produto Único! O bloco exibe automaticamente a contagem de estoque em tempo real do WooCommerce para cada produto, mantendo os compradores informados sem nenhum esforço manual de sua parte. Experimente com texto circundante personalizado, tamanho da fonte e cor para criar uma mensagem de disponibilidade de estoque que crie urgência e incentive os clientes a comprar antes que o estoque acabe.