O WooCommerce armazena as descrições dos produtos em dois campos: a descrição completa do produto e a descrição resumida. Você pode adicionar ou recuperar ambas através do administrador do WordPress, com PHP usando $product->get_description(), ou personalizando o layout da sua loja com um construtor de páginas como o SeedProd.
Neste guia, mostrarei como obter e exibir descrições de produtos no WooCommerce, incluindo como:
- Escreva e adicione descrições de produtos do WooCommerce da maneira correta
- Use a descrição curta do WooCommerce na página da sua loja
- Personalize as páginas dos produtos com o SeedProd, sem necessidade de código
Por que as descrições de produtos do WooCommerce são importantes?
Os compradores visitam sua loja on-line por vários motivos:
- Pesquisar o que você tem a oferecer
- Procurando um produto específico
- Comparando-o com alternativas
- Compras em vitrines
Se os visitantes acharem difícil obter as informações de que precisam, eles sairão do seu site antes de comprar. No entanto, se você oferecer aos compradores descrições de produtos exclusivas e detalhadas, eles poderão encontrar rapidamente o que estão procurando.
As descrições de produtos do WooCommerce também incentivam os clientes em potencial a clicar e saber mais sobre seus produtos.
Por exemplo, se os usuários virem uma breve descrição do produto na página da sua loja, eles poderão clicar para ler a descrição completa. A partir daí, eles podem:
- Saiba o preço
- Exibir imagens do produto
- Explore as especificações do produto
- Leia comentários e avaliações
Essas informações podem persuadir os usuários a comprar o produto naquele momento.
Sua próxima pergunta provavelmente será: "Como adicionar descrições de produtos no WooCommerce?". Continue lendo para descobrir.
Como obter descrições de produtos WooCommerce com PHP
O WooCommerce oferece dois métodos PHP para recuperar descrições de produtos programaticamente: get_description() para a descrição completa e get_short_description() para a descrição resumida. Você usará isso em modelos personalizados, funções de temas filhos ou ganchos.
Aqui está o código completo para recuperar ambas as descrições de qualquer produto:
// Get the WooCommerce product object
$product = wc_get_product( $product_id );
// Get the full product description
$description = $product->get_description();
// Get the short product description
$short_description = $product->get_short_description();Ambos os métodos retornam strings HTML.
Por exemplo: <p>Your description text.</p>.
O WooCommerce armazena descrições através do editor do WordPress. Exiba-as com echo $description diretamente nos modelos. Não use esc_html() aqui, que imprimiria as tags HTML literalmente em vez de renderizá-las.
Se você estiver trabalhando dentro de um loop ou hook onde já tem o $product global, você pode chamar esses métodos diretamente sem wc_get_product()O padrão acima serve para recuperar descrições fora do loop por ID do produto.
Como adicionar uma descrição de produto do WooCommerce (passo a passo)
Para adicionar descrições de produtos no WordPress com o WooCommerce, acesse WooCommerce " Products no painel do WordPress.
Em seguida, você pode adicionar um novo produto ou editar uma entrada de produto existente.
Você pode inserir uma descrição do produto no editor principal do WordPress. Isso será exibido como a descrição completa do produto em sua loja.
Em seguida, role a tela para baixo e insira os detalhes do produto na seção Product data (Dados do produto ), incluindo:
- Tipo de produto
- Preço normal e de venda
- Inventário
- Remessa
- Produtos vinculados
- Atributos
- Avançado
Abaixo dessa seção está a descrição resumida do produto. Essa é uma versão mais curta da descrição completa do produto que pode ser exibida para motivar os usuários a clicar.
Não se esqueça de adicionar a categoria do produto e fazer upload de imagens para seus produtos. Em seguida, você pode clicar em Update (Atualizar) ou Publish (Publicar) para tornar suas alterações efetivas.
Existe um código curto para as descrições de produtos no WooCommerce?
O WooCommerce inclui um código curto que permite exibir uma breve descrição do produto em qualquer lugar do seu site: [product_short_description id="YOUR_PRODUCT_ID"]Substitua YOUR_PRODUCT_ID com o ID numérico do produto, que você encontrará na URL ao editar o produto em wp-admin.
Por exemplo, para mostrar a breve descrição do produto com o ID 42 dentro de uma página ou postagem: [product_short_description id="42"]. Isso gera o campo de descrição curta como HTML onde quer que você coloque o código curto.
Uma coisa a saber: o WooCommerce não mostra descrições curtas ou completas na página da sua loja, nas páginas de categorias de produtos ou nas páginas de arquivo por padrão. O código de atalho resolve isso para páginas individuais onde você o coloca manualmente. Para uma solução que funcione em todo o layout da sua loja sem colar códigos de atalho em todas as páginas, consulte as seções abaixo.
Como obter e exibir descrições de produtos no WooCommerce com o SeedProd
Adicionar descrições personalizadas de produtos ao WooCommerce é muito fácil com o SeedProd.
O SeedProd é o melhor construtor de sites e plugin de página de destino para WordPress. Ele permite criar temas personalizados para WordPress, sites de WooCommerce e layouts flexíveis de sites sem código.
É fácil começar com mais de 180 modelos de página de destino e mais de 25 temas pré-fabricados do WordPress. Você pode personalizar cada design no construtor de páginas visuais de arrastar e soltar do SeedProd.
A personalização da sua loja on-line não leva tempo com os blocos e seções personalizáveis do SeedProd. Você pode exibir produtos do WooCommerce facilmente com as tags de modelo do WooCommerce e personalizá-los apontando e clicando.
Você pode até mesmo usar o SeedProd para criar sites de comércio eletrônico completos com páginas de produtos exclusivas, carrinhos de compras, checkout, arquivos e páginas de lojas. O plug-in é extremamente rápido e não apresenta inchaço, garantindo que seu site seja executado rapidamente para os visitantes.
Siga as etapas abaixo para obter descrições de produtos no WooCommerce e exibi-las com o SeedProd.
Etapa 1. Instalar o construtor de sites SeedProd
Primeiro, faça o download do arquivo do plug-in SeedProd em seu computador.
Observação: existe uma versão gratuita do SeedProd, mas usaremos o plano SeedProd Elite para os recursos do WooCommerce.
Em seguida, instale e ative o SeedProd em seu site WordPress. Você pode seguir este guia sobre como instalar um plug-in do WordPress se precisar de ajuda.
Depois de instalar o SeedProd, acesse SeedProd " Settings e insira sua chave de licença.
Você pode encontrar sua chave de licença fazendo login na sua conta SeedProd e clicando na guia Downloads.
Agora, digite sua chave no campo de texto e clique no botão Verify Key (Verificar chave ).
Etapa 2. Criar um tema personalizado do WooCommerce
Para usar os recursos do WooCommerce do SeedProd, você precisará criar um novo tema do WordPress com o SeedProd. Isso substituirá seu tema existente por um design personalizado, e é fácil de fazer, mesmo para iniciantes.
Para fazer isso, vá para SeedProd " Theme Builder e clique no botão Themes (Temas ).
Em seguida, você verá a biblioteca de modelos de sites pré-criados do SeedProd. Quando encontrar um modelo de que goste, passe o mouse sobre ele e clique no ícone de marca de seleção.
Depois de importar seu tema, o SeedProd criará todas as partes da demonstração do tema.
Observação: Nós nos referimos a partes individuais de um tema como "modelos".
Ao clicar em cada modelo, ele será aberto no editor de arrastar e soltar do SeedProd, onde você poderá personalizar o conteúdo e o design.
O primeiro modelo que editaremos neste tutorial é a página do produto. Quando os visitantes clicam em um produto em sua loja, eles veem a página do produto com os detalhes desse item.
Etapa 3. Editar o modelo de página do produto
Para personalizar a página do produto, passe o mouse sobre o modelo Product Page (Página do produto) e clique no link Edit Design (Editar design ).
O modelo será aberto no editor visual de arrastar e soltar do SeedProd, onde você pode apontar e clicar para alterar o design e o layout.
Primeiro, vamos ver como adicionar uma breve descrição do produto à sua página.
No lado esquerdo da tela, localize a seção WooCommerce Template Tags e arraste o bloco Short Description para o seu design.
A saída do WooCommerce para esse bloco tem como padrão a tag de descrição curta, mas você pode personalizá-la para atender às necessidades da sua loja. Você também pode personalizar a aparência da descrição nas configurações do bloco.
Por exemplo, você pode alterar o alinhamento da descrição, o tamanho da fonte e inserir texto dinâmico.
Na guia Advanced (Avançado), você pode personalizar os estilos de bloco, incluindo cores, fontes, espaçamento, etc.
Você pode seguir etapas semelhantes para adicionar descrições longas às páginas de produtos. Basta arrastar o bloco Product Content do painel esquerdo e soltá-lo no lugar.
Como antes, você pode personalizar o conteúdo, o estilo e as cores com apenas alguns cliques.
Observação: Você não verá uma visualização do bloco Product Content no editor ativo.
Etapa 4. Personalize o restante do seu site de WooCommerce
Depois de adicionar descrições de produtos à sua página, você pode continuar a personalizar o restante da sua loja. Basta clicar no link Edit Design em qualquer modelo para alterar o conteúdo exibido e a aparência.
Por exemplo, você pode:
- Personalizar páginas de categorias de produtos
- Exibir produtos em destaque
- Adicionar uma barra lateral personalizada do WordPress
Você terá uma loja WooCommerce totalmente personalizada, pronta para converter compradores em clientes quando terminar.
Etapa 5. Publique seu site de comércio eletrônico WooCommerce
Quando estiver satisfeito com seu novo design, é hora de colocá-lo no ar.
Para fazer isso, vá para a página SeedProd " Theme Builder e, no canto superior direito, clique no botão Ativar tema do SeedProd até que ele esteja na posição "ligado".
Agora você pode visualizar qualquer produto em seu site e ver as descrições curtas e longas em ação.
Veja como será sua descrição resumida:
E aqui está a aparência da descrição longa, dependendo do seu layout:
Como exibir descrições de produtos na página da loja WooCommerce
O WooCommerce não exibe descrições curtas ou completas na página da loja, nas páginas de categorias ou nas páginas de arquivo por padrão. Para exibir descrições nessas páginas, você tem três opções.
Opção 1: SeedProd (sem código)
Os modelos de arquivo de produtos do SeedProd permitem que você personalize suas páginas de loja e categorias no editor visual.
Adicione o bloco Descrição resumida ao modelo da página da sua loja e ele será exibido abaixo de cada produto na grade, sem necessidade de código.
Esta é a mesma abordagem abordada na seção SeedProd acima, aplicada a modelos de páginas de arquivo em vez de páginas de produtos individuais.
Opção 2: Plugin WooCommerce Product Description on Shop Page
O plugin WooCommerce Product Description on Shop Page é um plugin gratuito para WordPress que adiciona opções de exibição de descrição às configurações da página da sua loja. Instale-o, ative-o e configure qual tipo de descrição aparece na grade de produtos.
Opção 3: gancho PHP (abordagem do desenvolvedor)
Se você preferir uma solução baseada em código, o trecho a seguir adiciona uma breve descrição abaixo do título de cada produto na página da loja. Familiarize-se com a forma de adicionar trechos de código ao WordPress antes de usar essa abordagem ou use um plugin de trechos de código para adicioná-lo com segurança.
/**
* SeedProd - Add short description to products listing on shop page (only)
*/
add_action( 'woocommerce_after_shop_loop_item_title', 'sp_wc_add_short_description' );
function sp_wc_add_short_description() {
if( is_shop() ){
global $product;
?>
<div class="woocommerce-loop-product-description">
<?php echo apply_filters( 'woocommerce_short_description', $product->get_short_description() ) ?>
</div>
<?php
}
}Ao visualizar a página da loja do WooCommerce, você verá as descrições dos produtos acima do botão adicionar ao carrinho.
Solução de problemas: Descrição do produto não exibida no WooCommerce
Se a descrição do seu produto não estiver aparecendo onde você espera, as causas mais comuns são:
- Usar o tipo de descrição errado (a descrição completa e a descrição resumida são exibidas em locais diferentes)
- Um tema que substitui os arquivos de modelo padrão do WooCommerce,
- Comportamento padrão do WooCommerce (descrições curtas aparecem apenas nas páginas de produtos individuais, não nas páginas da loja ou de categorias).
Verifique qual descrição você preencheu no editor de produtos e compare-a com o local onde você espera vê-la.
Se você estiver usando um tema personalizado, verifique se ele inclui o woocommerce_short_description gancho de ação ou o .woocommerce-product-details__short-description recipiente no modelo de produto único.
Mais maneiras de personalizar o WooCommerce
Existem muitas outras maneiras de personalizar a forma como o WooCommerce exibe seus produtos. Para mais personalizações do WooCommerce, consulte os seguintes guias:
- Como personalizar a guia Informações adicionais do WooCommerce
- Como adicionar o botão Exibir carrinho no WooCommerce
- Como alterar o título da página da loja no WooCommerce
- Como criar uma impressionante galeria de imagens de produtos no WooCommerce
- Como adicionar classificação por estrelas às páginas de produtos do WooCommerce
- Como exibir produtos relacionados no WooCommerce
- Como exibir categorias e tags de produtos no WooCommerce
- Como corrigir o problema de não funcionamento do WooCommerce View Cart
- Como ocultar produtos fora de estoque no WooCommerce
Perguntas frequentes sobre a descrição de produtos do WooCommerce
Qual é a diferença entre uma descrição de produto do WooCommerce e uma descrição resumida?
O WooCommerce tem dois campos de descrição. A descrição completa do produto aparece na guia do editor principal abaixo do título do produto e é exibida em uma guia ou seção dedicada na página do produto individual. A descrição curta é um breve resumo inserido no campo Descrição curta do produto. Ela aparece abaixo do título do produto e acima do botão Adicionar ao carrinho por padrão. Nenhuma delas é exibida nas páginas da loja ou de categorias, a menos que você as adicione com um plugin, código ou um construtor de páginas como o SeedProd.
Como faço para exibir a descrição do produto na página da loja WooCommerce?
O WooCommerce não exibe descrições na página da loja por padrão. Você tem três opções: usar os modelos de arquivo de produtos do SeedProd para adicionar um bloco de descrição curta ao layout da página da sua loja sem código, instalar o plugin WooCommerce Product Description on Shop Page ou adicionar um gancho PHP usando o woocommerce_after_shop_loop_item_title ação com $product->get_short_description().
Por que a descrição do meu produto WooCommerce não está aparecendo?
Os motivos mais comuns são: você preencheu o campo de descrição errado (descrições completas e resumidas aparecem em locais diferentes), seu tema substitui os modelos padrão do WooCommerce ou você está esperando que uma descrição apareça em uma página onde o WooCommerce não a exibe por padrão. Verifique qual campo você preencheu, confirme onde esse campo deve ser exibido e verifique se o seu tema não está suprimindo a saída.
Aí está!
Esperamos que este artigo tenha ajudado você a aprender como obter descrições de produtos no WooCommerce e exibi-las para seus clientes.
O SeedProd inclui tudo o que você precisa para personalizar qualquer parte do seu site WordPress e da sua loja WooCommerce. Você pode até usar o SeedProd para lançar sites de clientes, como fez a Mustard Seed neste estudo de caso.
Obrigado pela leitura! Gostaríamos muito de ouvir sua opinião, portanto, sinta-se à vontade para participar da conversa no YouTube, X e Facebook para obter mais conselhos úteis e conteúdo para expandir seus negócios.
