Códigos de acesso do WooCommerce: o guia definitivo para 2021

Publicados: 2020-01-11

Se você tem um negócio WooCommerce, provavelmente já ouviu falar sobre códigos de acesso. São pequenos trechos que permitem adicionar e personalizar diferentes aspectos da sua loja virtual sem escrever longas linhas de código. Neste guia, veremos quais são os códigos de acesso do WooCommerce, por que você deve usá-los e como aproveitá-los ao máximo .

Shortcodes WooCommerce: Tudo o que você precisa saber

Se você trabalha com WordPress, provavelmente conhece o WooCommerce. Atualmente, 93,7% de todos os sites de comércio eletrônico WordPress usam o renomado plugin WooCommerce. Essa plataforma de código aberto e totalmente personalizável desenvolvida pela WooThemes começou como qualquer outro complemento, mas logo decolou com milhões de downloads, o que chamou a atenção do conselho do WordPress. Até o momento, já foi baixado 70 milhões de vezes e se tornou o plug-in líder de comércio eletrônico, alimentando um total de 28% das lojas online.

Apesar de sua grande reputação e sucesso, a equipe WooCommerce trabalha continuamente para torná-lo ainda melhor. Ao longo de seu caminho de desenvolvimento, ele distribuiu vários códigos de acesso de vários tipos para os usuários personalizarem seus sites. Com esses códigos de acesso, eles podem transformar suas lojas e personalizar sua interface, check-out, funcionalidade, processo de listagem de produtos e muito mais.

Então, para ajudá-lo a aproveitar ao máximo os códigos de acesso, neste guia, veremos:

  • Uma breve explicação dos códigos de acesso
  • Por que eles são necessários para o seu negócio
  • Uma lista de códigos de acesso WooCommerce
  • Como você pode aproveitá-los ao máximo

O que são códigos de acesso WooCommerce?

Vamos começar com o básico. Os códigos de acesso do WooCommerce são pequenos trechos que ajudam você a obter uma funcionalidade ou exibir conteúdo em seu site de comércio eletrônico sem escrever um longo trecho de código. Ou seja, são macros que permitirão uma interação dinâmica com o conteúdo do seu site .

Você pode usar códigos de acesso em qualquer lugar da sua loja para personalizá-la, exibir produtos ou apenas botões de chamada para ação. E a melhor parte é que você não precisa de nenhum conhecimento de codificação para começar a usá-los. Você só precisa de uma paixão ardente pelos negócios on-line e um profundo entendimento do que deseja para sua loja. Os códigos de acesso farão o resto de forma limpa e organizada.

Em poucas palavras, os códigos de acesso do WooCommerce são benéficos de três maneiras:

  • Eles ajudam a economizar tempo porque você não precisa escrever longas linhas de código, proporcionando mais tempo para trabalhar em outras coisas.
  • Como eles não adicionam uma marcação ao conteúdo da postagem, os proprietários das lojas poderão editar o estilo da página posteriormente.
  • Mais flexibilidade. Mesmo que isso dependa dos parâmetros definidos pelo usuário, eles podem aplicar o mesmo código de acesso para diferentes situações.

Por que você precisa de códigos de acesso WooCommerce?

Ainda não está convencido? Pense novamente, os códigos de acesso do WooCommerce podem fazer muito mais do que você imagina.

Em primeiro lugar, com os códigos de acesso, você terá controle total do seu site . Isso significa que você pode exibir produtos livremente, adicionar botões de apelo à ação ou botões de qualquer tipo em qualquer lugar da sua loja sem pedir ajuda de nenhum desenvolvedor. Isso também significa que você também não precisa trabalhar com trechos de código longos e complexos.

Isso é perfeito para quem quer experimentar várias estratégias em suas lojas online. Por exemplo, em vez de orientar seus clientes por um processo de vendas padrão como qualquer outra loja, você pode exibir um botão de adicionar ao carrinho em uma de suas postagens populares para incentivar as conversões. E a melhor parte é que os códigos de acesso permitem que você escolha entre muitos botões de call-to-action que você coloca em seu site.

Além disso, os códigos de acesso do WooCommerce permitem adicionar produtos à página inicial, criar uma grade de itens à venda para mostrá-los aos clientes e exibir seus produtos populares em qualquer lugar que você desejar. Até mesmo criar uma página de rastreamento de pedidos é possível! E essa é a mágica dos códigos de acesso, eles oferecem infinitas opções para personalizar sua loja .

Que tipos de códigos de acesso WooCommerce existem?

Como é difícil dizer quantos códigos de acesso o WooCommerce oferece, vamos listá-los com base em sua categoria. Aqui está uma rápida visão geral dos códigos de acesso do WooCommerce que abordaremos neste guia:

  • Códigos de acesso da página
  • Códigos de acesso de produtos (esta é a categoria mais robusta)
  • Códigos de acesso da página do produto
  • Códigos de acesso de produtos relacionados
  • Botão Adicionar ao carrinho ou códigos de acesso de URL

Como aproveitar ao máximo os códigos de acesso do WooCommerce ?

Agora, vamos ver o que cada tipo de shortcode pode fazer e como aproveitá-los ao máximo:

1. Códigos de acesso de página

Normalmente, o WordPress vem com 4 páginas padrão com os códigos de acesso incluídos para que você não precise adicioná-los manualmente. No entanto, se por algum motivo esse não for o caso, você poderá recriar as páginas com os códigos de acesso e esclarecê-los nas configurações.

Nos códigos de acesso da página, você encontrará:

Carrinho

 [ woocommerce_cart ]

Ele é usado para a página do carrinho e ajuda a mostrar o conteúdo do carrinho quando seus clientes adicionam produtos ao carrinho. Além disso, ele também exibe a interface para códigos de cupom, pedaços de carrinho e outros elementos para uma página de carrinho padrão. Este é um código de acesso simples, para que você não adicione mais condições ou parâmetros a ele.

Confira

 [ woocommerce_checkout ]

Depois que seus clientes tiverem coletado todos os produtos/serviços que desejam, eles clicarão em check-out, e é aí que o shortcode de checkout entra em ação. Ele exibirá todas as informações necessárias que o comprador precisa ver antes da finalização da compra, como forma de pagamento, informações de cobrança, informações de envio, etc. Este também é um código de acesso simples que não aceita argumentos adicionais.

Minha conta

 [ woocommerce_my_account ]

Os clientes devem poder ver e modificar os detalhes do perfil, como nome, endereço de e-mail, senha, bem como os detalhes do pedido, como endereço de envio e cobrança. Com esse código de acesso, os usuários poderão visualizar, editar e atualizar esses detalhes. Além disso, contém um argumento que exibirá informações sobre o comprador atual.

Formulário de acompanhamento de pedidos

 [ woocommerce_order_tracking ]

Ao contrário dos códigos de acesso de três páginas anteriores, este não é gerado automaticamente por padrão, mas você pode adicioná-lo para que seus clientes possam ver e acompanhar o status de seus pedidos em andamento. Se quiserem verificar o status de um pedido, os compradores devem inserir os detalhes do pedido no Formulário de acompanhamento do pedido.

Você pode usar este código de acesso do WooCommerce para uma página individual ou combiná-lo com outros códigos de acesso para exibir o formulário de rastreamento. Por exemplo, você pode usar esse código de acesso na página Minha conta para permitir que seus clientes acessem o formulário de rastreamento.

2. Códigos de acesso do produto

Lembre-se de que, para usar códigos de acesso de produtos, você precisará do WooCommerce 3.2 e versões posteriores. Essas versões permitem que você use o código de acesso do produto para todos os tipos de exibição do produto. Se você tiver uma versão anterior, verifique este documento, pois precisará usar códigos de acesso diferentes para cada tipo de agrupamento de produtos.

 [ products ]

2.1 Atributos do Shortcode do Produto

Ao usar códigos de acesso de produtos, você precisará especificar quais produtos deseja exibir com base em diferentes condições que permitirão filtrar produtos por ID de postagem, SKU, categorias, atributos e assim por diante. Eles também suportam paginação, classificação aleatória e tags de produtos.

Vamos passar por alguns códigos de acesso de produtos:

Limitar a quantidade do produto

Com o atributo limit, você pode estabelecer um limite para o número de produtos exibidos. Por exemplo, você pode restringir o número de produtos a serem exibidos a 8 itens com o seguinte:

 [ products limit="12" ]

. Observe que, por padrão, o limite é “-1”, o que significa que todos os produtos serão exibidos.

Alterar o layout do produto

Com os códigos de acesso do WooCommerce, você também pode alterar o layout para diversificar a exibição do produto. Basta escolher entre os seguintes atributos, dependendo das preferências de seus clientes: colunas, paginar ou ordenar.

uma. Colunas

Se você quiser definir um certo número de colunas, terá que adicionar o atributo 'columns' e esclarecer o número desejado. Então se você quiser 6 colunas com um produto diferente em cada uma delas, você pode usar o shortcode:

 [ products limit="12" columns="4" ]

b. Paginar

Outro exemplo é o atributo paginate, que divide seus produtos em diferentes páginas. Com este código de acesso, você pode especificar o número de itens mostrados em cada página.

Para usá-lo, defina paginate = “true” e digite o seguinte shortcode:

 [ products limit="12" columns="4" paginate="true" ]

c. Ordenar produtos com “orderby”

O atributo orderby abre uma ampla gama de opções, pois permite classificar seus produtos de acordo com vários critérios para exibi-los como desejar, adicionando condições. Esses incluem:

    • id: exibir produtos por id do produto.
    • popularidade : com este atributo, os produtos mais comprados serão exibidos primeiro.
    • title : classifica os produtos pelo título. Esta é a ordem padrão de orderby.
    • rating : outra maneira interessante de classificar produtos é com base em seu valor médio de classificação.
    • date : para classificar os itens com base na data em que foram publicados. Por padrão, o produto mais antigo é exibido primeiro. No entanto, você pode alterar isso usando o atributo de data.
    • rand : com este atributo, você pode alterar a ordem dos produtos quando a página for recarregada. No entanto, com sites em que o cache está ativado e os produtos são salvos em uma ordem fixa, esse atributo pode não funcionar.
    • menu_order : isso só funcionará quando você definir as ordens do menu e mostrará os produtos de acordo com essa ordem. O número mais baixo será mostrado primeiro.

Se você deseja ainda mais personalização, pode dar um passo adiante e combinar essas opções apenas adicionando um espaço entre elas. Por exemplo, você pode tentar misturar os códigos de acesso para ter seis colunas de produtos exibidas em uma ordem com base em sua popularidade assim:

 [ products limit="12" columns="4" orderby="popularity" ]

Mais atributos do produto

Existem vários outros atributos de produtos no WooCommerce que você pode usar combinando-os com o código de acesso “produtos” . Alguns dos principais são:

    • SKU: você pode exibir seus produtos com base em seu SKU (unidade de manutenção de estoque). Se você quiser adicionar vários SKUs, basta separá-los por vírgulas.
    • on_sale : Como o próprio nome sugere, este atributo exibirá todos os produtos em promoção da sua loja.
    • categoria : também é uma boa ideia mostrar os produtos por suas categorias. Você pode ter várias categorias separando os slugs com vírgulas.
    • best_selling : Esta é uma boa opção se você deseja mostrar primeiro seus produtos mais populares e mais vendidos.
    • top_rated : Seguindo a mesma lógica, você também pode mostrar seus itens com melhor classificação.
    • class : esse atributo ajuda você a alterar a ordem usando CSS personalizado adicionando uma classe wrapper HTML.

Por exemplo, se você deseja exibir seus produtos mais vendidos, quatro por linha, com no máximo doze itens, você pode usar este código de acesso:

 [ products limit="12" columns="4" best_selling="true" ]

Visibilidade

Este atributo permite exibir produtos com base nas configurações de visibilidade. Algumas das opções são:

      • catálogo : Recupera produtos visíveis apenas na página da loja
      • search: mostra produtos que são visíveis apenas na página de pesquisa
      • visible: É uma combinação dos dois anteriores, pois recupera produtos visíveis na página da loja e nos resultados da pesquisa.
      • oculto: mostra produtos que só podem ser acessados ​​por uma URL direta.
      • destaque : só recuperará produtos marcados como em destaque

Por exemplo, se você deseja exibir seus produtos em destaque, quatro por linha, com no máximo doze itens, você pode usar este código de acesso:

 [ products limit="12" columns="4" visibility="featured" ]

Atributos do produto de conteúdo

Nos códigos de acesso do produto, existem atributos do produto de conteúdo que você pode usar para recuperar produtos em uma determinada página ou postagem. Mais especificamente, é possível recuperar coisas com base no atributo disponível ou nos termos do atributo (essas são variações desse atributo). Você pode fazer isso incluindo o slug, especificando os termos e combinando-os com os atributos. Isso pode ser um pouco confuso, então vamos dar uma olhada em cada um deles:

    • atributo: Ajuda a exibir os produtos ao incluir as lesmas
    • termos: Menciona os termos do atributo separados por vírgulas
    • termos_operador: Dá a você mais controle sobre como mostrar os atributos. Existem três operadores:
      • E : Mostrará produtos de todos os atributos que você escolheu.
      • IN : Exibe os produtos que possuem aquele atributo escolhido.
      • NOT IN : Mostrará produtos que não possuem os atributos escolhidos.

Categorias

Seguindo a mesma lógica dos atributos do produto de conteúdo, você também pode exibir itens com base em suas categorias:

      • categoria: Para escolher a categoria que deseja exibir
      • cat_operator: Você pode aplicar condições para mostrar os itens que deseja:
        • E: Os produtos exibidos precisam pertencer a todas as categorias escolhidas
        • IN: Os produtos exibidos precisam estar em pelo menos uma das categorias escolhidas
        • NOT IN: Os produtos exibidos não precisam estar em nenhuma das categorias escolhidas
      • Você também pode exibir produtos de acordo com uma lista separada por vírgulas de IDs de postagem ou uma lista de SKUs.
      • Existem vários outros códigos de acesso/atributos que pertencem aos códigos de acesso do produto: atributos especiais, categoria de produto e categoria de produto. A lógica é muito parecida com a que você leu acima, mas caso queira dar uma olhada, pode conferir.
      • Se você quiser saber mais sobre códigos de acesso, visite esta página e dê uma olhada nos 8 cenários.

Por exemplo, se você deseja exibir produtos para categorias específicas, quatro por linha, com no máximo doze itens, você pode usar este código de acesso:

 [ products limit="12" columns="4" category="hoodies, tshirts" ]

3. Códigos de acesso da página do produto

Com esse tipo de shortcode do WooCommerce, você pode mostrar diferentes páginas de produtos usando dois atributos: IDs de produtos e SKUs. O código para isso é .

É importante notar que você pode usar os dois códigos de acesso a seguir:

 [ product_page ]

ou

 [ product_page sku="hoodie" ]

4. Shortcode de produtos relacionados

Se você usou lojas de comércio eletrônico como Amazon ou Alibaba, provavelmente notou que, quando está olhando para um produto, eles mostram outros itens relacionados. Por exemplo, se você estiver procurando por uma barraca, eles mostrarão outras barracas e sacos de dormir semelhantes. Isso porque, se você precisar de uma barraca, provavelmente também estará interessado em um saco de dormir.

Consequentemente, mostrar produtos relacionados aos seus compradores é uma excelente ideia para aumentar suas vendas. No WooCommerce isso é possível com o shortcode de produtos relacionados. Você pode indicar exatamente quantos produtos deseja que os usuários vejam. Por exemplo, se você quiser mostrar 4 produtos, o shortcode deve ser:

 [ related_products limit="4" ]

5. Botão Adicionar ao carrinho

Um botão adicionar ao carrinho é outra excelente maneira de melhorar a experiência do cliente em sua loja e aumentar a taxa de conversão. E a melhor parte é que é muito simples.

Digamos que você queira exibir o preço de um produto e um botão Adicionar ao carrinho em uma postagem ou página, o código de acesso que você precisa usar é

 [ add_to_cart sku="hoodie" ]

Os códigos de acesso do WooCommerce também permitem redirecionar seus compradores para outro URL em vez de adicionar um item ao carrinho. Para fazer isso, você precisa escrever

 [ add_to_cart_url ]

para o produto com id 219.

Lista de códigos de acesso úteis para WooCommerce

Finalmente, aqui está uma lista dos códigos de acesso WooCommerce mais úteis que você pode usar em seu site.

  • Shortcode da página do carrinho.
 [ woocommerce_cart ]
  • Confira a página
 [ woocommerce_checkout ]
  • Conta de usuário.
 [ woocommerce_my_account ]
  • Formulário de Acompanhamento de Pedidos.
 [ woocommerce_order_tracking ]
  • Código de acesso dos produtos.
 [ products ]
  • Produtos em destaque.
 [ featured_products ]
  • Venda de produtos.
 [ sale_products ]
  • Produtos mais vendidos.
 [ best_selling_products ]
  • Produtos recentes.
 [ recent_products ]
  • Atributo do produto.
 [ product_attribute ]
  • Produtos mais bem avaliados.
 [ top_rated_products ]
  • Categoria do produto: para exibir produtos em uma categoria específica.
 [ product_category ]
  • Categorias de produtos: exibe todas as suas categorias de produtos.
 [ product_categories ]
  • Mensagens da loja: para exibir mensagens.
 [ shop_messages ]
  • Filtro de produto: exibe um filtro de pesquisa de produto.
 [ woocommerce_product_filter ]
  • Atributo de filtro.
 [ woocommerce_product_filter_attribute ]
  • Categoria de filtro de produto.
 [ woocommerce_product_filter_category ]
  • Preço do filtro.
 [ woocommerce_product_filter_price ]
  • Etiqueta de filtro do produto.
 [ woocommerce_product_filter_tag ]
  • Classificação do filtro.
 [ woocommerce_product_filter_rating ]
  • Venda de filtro de produto: exibe um filtro ao vivo para produtos em promoção.
 [ woocommerce_product_filter_sale ]
  • Redefinição do filtro do produto: exibe um botão para limpar todos os filtros ativos.
 [ woocommerce_product_filter_reset ]

Shortcodes WooCommerce: Conclusão

Em suma, os códigos de acesso do WooCommerce ajudarão você a personalizar sua loja sem escrever longas linhas de código. Dessa forma, você pode testar diferentes layouts e alternativas para encontrar o ideal para sua loja. Apesar de parecerem complicados à primeira vista, a verdade é que com um pouco de prática eles vão facilitar muito a sua vida e vão te ajudar a levar o seu negócio para o próximo nível.

Para mais alternativas para personalizar sua loja online, você pode conferir nossos guias em:

  • Adicionar ao carrinho função programaticamente no WooCommerce
  • WooCommerce Ajax adicionar ao carrinho

O que você acha dos códigos de acesso do WooCommerce? Por favor, deixe-nos saber seus pensamentos nos comentários abaixo.