Como configurar o WooCommerce Customizer para imagens de produtos, catálogo e aviso da loja

Publicados: 2019-11-04
WooCommerce Customizer

Última atualização - 8 de julho de 2021

Nas versões mais antigas do WooCommerce, você pode ter visto configurações para alterar as opções de exibição do produto. Nas versões mais recentes do WooCommerce, a opção Exibir está ausente nas configurações do produto WooCommerce. No entanto, você poderá encontrar um novo conjunto de opções na guia Aparência. Discutiremos as configurações mais recentes do WooCommerce Customizer em detalhes neste artigo.

Se você estiver usando uma versão mais antiga do WooCommerce e quiser saber mais sobre as opções de exibição nas configurações do produto, consulte este artigo.

Personalizador WooCommerce

Você pode acessar o personalizador do WooCommerce no painel de navegação do WordPress ( Aparência > Personalizar > WooCommerce ).

Personalizador WooCommerce

No WooCommerce, você encontrará quatro configurações diferentes:

  • Aviso da loja
  • Catálogo de produtos
  • Imagens do produto
  • Confira

Personalizador WooCommerce

Vamos dar uma olhada em cada uma dessas configurações em mais detalhes:

Aviso da loja

Um aviso de loja no WooCommerce ajudará você a se comunicar com seus clientes exibindo uma mensagem em todo o site. Você poderá comunicar uma mensagem informativa, como atrasos de envio para uma zona específica, por meio desta opção. Alternativamente, você poderá chamar a atenção de seus clientes em ofertas de desconto, eventos ou quaisquer outras iniciativas de marketing em sua loja.

Você pode adicionar o texto a ser exibido na área de texto. Além disso, você precisa habilitar a caixa de seleção para Store Notice. Agora, você poderá ver uma prévia do aviso da loja na página. Clique no botão Publicar para exibi-lo em seu site.

Personalizador WooCommerce

Assim que você publicar o Aviso da Loja, seus visitantes poderão vê-lo quando visitarem seu site.

Personalizador WooCommerce
O aviso da loja que você configurou no back-end ficará visível para os clientes no front-end.

Agendamento de Aviso de Loja

O WooCommerce também oferece uma opção para agendar avisos de loja em sua loja. Por exemplo, se você programou uma oferta em sua loja a partir de 1º de dezembro, você pode criar um aviso de loja e programar para exibi-lo. O aviso da loja será exibido apenas a partir dessa data.

Personalizador WooCommerce

Catálogo de produtos

Você pode definir como os produtos são exibidos em suas páginas de loja e categoria ajustando as configurações em Catálogo de produtos.

Basicamente, existem cinco configurações diferentes nesta seção. Vamos dar uma olhada em cada um:

Exibição da página da loja

Aqui você poderá escolher o que exibir na sua página principal da Loja. Existem três opções disponíveis

  1. Mostrar produtos – Todos os seus produtos serão exibidos.
  2. Mostrar categorias – Somente categorias serão exibidas.
  3. ou Mostrar categorias e produtos – Serão exibidos tanto as categorias quanto os produtos.
Personalizador WooCommerce
Você pode optar por exibir apenas produtos ou categorias ou ambos juntos na página da loja.

Exibição de categoria

Esta escolha definirá a exibição em sua página de Categoria. Novamente, você terá três opções.

  1. Mostrar produtos
  2. Mostrar subcategorias
  3. e, Mostrar subcategorias e produtos
Personalizador WooCommerce
Em uma página de categoria individual, você pode optar por exibir subcategorias, produtos ou ambos juntos.

Classificação de produtos padrão

Quando um cliente chega à sua página da loja, como os produtos aparecerão para ele é um fator importante. O WooCommerce permite que você escolha a classificação de produtos padrão de acordo com sua necessidade. Existem seis opções diferentes para isso, da seguinte forma:

  1. Classificação padrão (pedido personalizado + nome)
  2. Popularidade (vendas)
  3. Classificação média
  4. Classificar por mais recente
  5. Ordenar por preço (asc)
  6. e, Ordenar por preço (desc)

Personalizador WooCommerce
Você pode escolher a classificação de produtos padrão na página Loja de acordo com suas necessidades.

Produto por linha

Você pode alterar o número de produtos a serem exibidos em cada linha.

Personalizador WooCommerce
O WooCommerce permite que você altere o número de produtos exibidos em uma linha.

Linhas por página

Além disso, você pode especificar quantas linhas de produtos serão exibidas em uma única página.

Personalizador WooCommerce
Aqui, você também pode especificar quantas linhas de produtos deseja exibir em sua página da loja.

Imagens do produto

Esta seção ajudará você a controlar como as imagens do produto são exibidas. Basicamente, a aparência das imagens do catálogo e imagens em miniatura podem ser controladas usando essas configurações. As imagens do catálogo são imagens de tamanho médio que são exibidas junto com os produtos na Loja, nas páginas de Categoria, Produtos Relacionados, vendas em alta e vendas cruzadas. E as imagens em miniatura estão associadas à exibição do produto no carrinho e nos widgets.

Você pode controlar a aparência do catálogo e das imagens em miniatura aqui. No entanto, imagens de produtos individuais e configurações de galeria de imagens não podem ser controladas aqui, o que você pode fazer em páginas de produtos individuais. Estamos descrevendo o processo básico de manipulação de imagens de produtos e galeria de imagens um pouco mais adiante neste artigo.

Existem três opções para configurar imagens em miniatura e de catálogo aqui:

  1. 1:1 – Na proporção 1:1, as imagens serão cortadas para formar um quadrado.
  2. Personalizado – Você pode configurar uma proporção personalizada de sua escolha se selecionar a segunda opção. As imagens serão cortadas na proporção que você escolher.
  3. Uncropped – Aqui, as imagens não serão cortadas pelo WooCommerce. A proporção original com a qual você carregou as imagens será mantida.
Personalizador WooCommerce
Você pode escolher uma proporção personalizada para determinar a aparência de seu catálogo e imagens em miniatura.

Como lidar com imagens de produtos de páginas de produtos individuais?

Você pode definir a imagem principal do produto na página do produto individual. No canto inferior direito da página de edição do produto, você verá a imagem principal do produto, bem como as imagens da galeria de produtos.

Personalizador WooCommerce

Você pode remover ou fazer upload de novas imagens facilmente da biblioteca de mídia.

Personalizador WooCommerce

Os clientes na página de detalhes do produto poderão visualizar a imagem principal e as várias imagens da galeria.

Personalizador WooCommerce

Há também uma opção de lightbox padrão, que ajudará os clientes a visualizar o produto de perto.

Personalizador WooCommerce
O WooCommerce oferece uma opção de lightbox padrão para ajudar seus clientes a visualizar os produtos com mais detalhes.

Visualização para diferentes dispositivos diferentes

O WooCommerce também permite que você veja a visualização em diferentes dispositivos. Por padrão, você pode ver a visualização para desktop. Você também pode alterá-lo para entender como ele ficará em um tablet ou celular também.

No canto inferior direito do painel de personalização do WooCommerce, você poderá ver as configurações para alterar a opção de visualização.

Personalizador WooCommerce
Ao alterar o modo de visualização, você pode entender como o conteúdo da sua loja é exibido em celulares e tablets.

Confira

Com o WooCommerce Customizer, você também pode fazer alguns ajustes em como sua página de checkout será exibida. Aqui, você pode tornar obrigatórios determinados campos de entrada, bem como configurar o texto para sua política de privacidade e termos.

Tornando certos campos obrigatórios

Em primeiro lugar, você pode definir como deseja determinados campos de entrada na página de checkout. Você pode definir se deseja que o campo de nome da empresa, linha de endereço 2 e número de telefone sejam obrigatórios ou opcionais. Aqui há uma opção para exibir um asterisco nos campos obrigatórios. Você pode marcar a caixa de seleção para habilitá-la ou deixá-la em branco para não exibir asterisco.

Personalizador WooCommerce
Você pode definir se deseja manter determinados campos de entrada obrigatórios ou opcionais aqui.

Aqui, você também pode definir páginas para sua Política de Privacidade e Termos e Condições. Você precisa criar páginas separadas para elas e, em seguida, basta selecionar essas páginas no menu suspenso.

Customizador WooCommerce
Você pode definir a página que será exibida como política de privacidade da sua loja.

Além disso, você pode adicionar opcionalmente um texto curto descrevendo sua política de privacidade na página de checkout. O conteúdo para isso pode ser definido aqui.

Personalizador WooCommerce
Você pode adicionar ou editar o texto curto acima do botão Fazer pedido.

Agora, depois de definir uma página de termos e condições, você pode garantir que os clientes a leiam adicionando um campo de checkout. Você também pode adicionar ou editar o texto que será exibido aqui.

Personalizador WooCommerce
Quando você define uma página de termos e condições, uma caixa de seleção será adicionada no frontend para garantir que os clientes a leiam.

Espero que você tenha uma visão geral das configurações do personalizador do WooCommerce que você verá com as versões mais recentes do WooCommerce. Para aqueles que estão usando as versões mais antigas, há outro conjunto de opções na guia Exibir. Deixe-nos um comentário se tiver alguma dúvida.

Leitura adicional

  • Configurações do produto WooCommerce
  • Como configurar uma loja WooCommerce do zero.
  • Melhores imagens de produtos para sua loja WooCommerce.