WooCommerce shortcodes permite-lhe mostrar informações da sua loja de formas novas e emocionantes. WooCommerce vem pré-construído com códigos de acesso, e você pode instalar plugins para adicionar mais. Se você quer listar produtos em uma mesa, exibir o carrinho em qualquer lugar em seu site, ou algo mais – você veio ao lugar certo!
Você provavelmente já se deparou com códigos de acesso antes, se você é novo para WordPress ou tem estado usando-o há algum tempo. Códigos de acesso curtos são, como o nome sugere, pedaços curtos de código que executam algum tipo de função. Códigos de acesso WooCommerce, por exemplo, deixe você adicionar funções relacionadas com WooCommerce puro para páginas WordPress, posts, barras laterais, e áreas widgetized em seu site.
Se estiver à procura de uma forma de simplificar a experiência de compras, poderá fazê-lo usando códigos shortcodes WooCommerce. Eles podem ajudá-lo a melhorar a compra de fluxos de usuário e otimizar a sua loja online para conversões.
Por exemplo, pode usar códigos de acesso WooCommerce para:
- mostrar uma lista dos seus produtos classificados de topo na sua página inicial.produtos relacionados com o Showcase sempre que um cliente expresse um interesse por um produto.destaque produtos caracterizados em blocos de Gutenberg, barras laterais, outras áreas widgetizadas.
com isso em mente, neste guia completo, vamos explicar como você pode usar códigos de acesso WooCommerce para oferecer melhores experiências de usuário e crescer sua linha de fundo. Ao longo do caminho, também explicaremos quando (e por que) você deve usar cada shortcode. Vamos olhar para os códigos de acesso que vêm com WooCommerce em si, e códigos de acesso que você pode adicionar com outros plugins.
como usar códigos de acesso WooCommerce
códigos de acesso são um pouco técnicos, mas eles são realmente projetados para qualquer um usar. Não precisas de codificação.
Basta inserir o shortcode em qualquer editor de texto no WordPress, ou um ‘Atalho’ bloco se você estiver usando Gutenberg ou criador da página, tais como Elementor ou Visual Compositor:
pode combinar códigos de acesso e mostrar vários códigos de acesso numa única página. Por exemplo, você pode combinar o shortcode de rastreamento de pedidos com o shortcode de conta do Usuário. Tudo o que você tem a fazer é inserir ambos os códigos de acesso na mesma página. Seria parecido com isto.:
WooCommerce produto lista de códigos de acesso
Existem também códigos de acesso a lista de produtos que de formas diferentes em sua loja. Estes adicionam flexibilidade extra, de modo que você não está preso com as vistas restritas que você começa na loja e páginas de categoria. Em vez disso, você pode usar códigos de acesso WooCommerce para listar um ou mais produtos literalmente em qualquer lugar do seu site WordPress – quer em uma grade ou tabela-baseada em lista.
produtos WooCommerce shortcode
WooCommerce tem um shortcode que permite listar produtos específicos em uma disposição de grade:
. Você também pode adicionar outros parâmetros a ele (como orderby e colunas) para personalizar a aparência front-end.
pode escolher o número de produtos a listar por linha. Por exemplo, se você quisesse exibir seis produtos em três colunas ordenadas por data em ordem ascendente, você usaria o shortcode: . Da mesma forma, para exibir produtos em ordem decrescente, você simplesmente substituiria ASC por DESC.
WooCommerce quick view shortcode
The shortcode works seemlessly with the WooCommerce Quick View Pro plugin. Isto adiciona botões de visualização rápida à lista de produtos como uma forma rápida de permitir que as pessoas façam a sua compra sem sair da página actual:
tudo o que você tem a fazer é instalar o ‘plugin’ do WooCommerce Quick View Pro para o seu site WordPress e irá adicionar automaticamente botões de vista rápida ao front-end. Desta forma, os clientes podem ver atributos e variações do produto e adicionar produtos à cart sem navegar para a única página do produto.
Leia o nosso guia completo para o WooCommerce Quick View Pro shortcode.
WooCommerce product table shortcode
While the built-in WooCommerce products shortcode is pretty flexible, it only lets you display them in a grid layout. Isso não é ideal para lojas que querem mostrar mais produtos por página, por exemplo, se você está criando um formulário de pedido de uma página rápida ou loja por atacado. Nesse caso, você pode estar melhor com um shortcode tabela de produtos.
While WooCommerce itself doesn’t have a product table shortcode, you can easily add one with the WooCommerce Product Table plugin. O shortcode básico é e você pode configurar isso usando mais de 50 opções de shortcode.
ver a lista completa de opções de códigos curtos que você obtém com a tabela de produtos WooCommerce.
WooCommerce adicionar ao carrinho shortcode
WooCommerce vem com um built-in shortcode que permite a você inserir um botão adicionar ao carrinho para um produto específico em qualquer lugar que você gosta. Basta adicionar o ID e / ou o SKU do produto que deseja mostrar o botão Adicionar ao carrinho para:
Se quiser incluir o preço do produto, então use:
Para produtos simples, isto irá mostrar um botão adicionar ao carrinho.
Para a variável de produtos, ele irá mostrar uma ‘Escolha’ opções de botão:
Pessoalmente, eu não gosto dessa porque os clientes têm para visitar o único a página do produto para escolher suas variações. É melhor usar a tabela de produtos WooCommerce para listar um ou mais produtos variáveis em uma tabela, completo com dropdowns de variação:
dessa forma, os clientes podem selecionar opções e adicionar ao Carrinho a partir da página em que estão atualmente.
categoria de Produto shortcode
a categoria de Produto shortcode lista Produtos de uma categoria específica numa grelha-padrão.
Este é o atalho para:
Se você não gosta do layout de grade, ou se você deseja ter mais controle sobre quais informações serão exibidas sobre cada produto, em seguida, você pode usar o WooCommerce Tabela de Produtos shortcode em vez disso. O plugin de tabela de produtos WooCommerce vem com uma opção de categoria shortcode, que você pode usar para listar produtos de categorias específicas apenas:
ao contrário do built-in shortcode que vem com o WooCommerce, você pode escolher quais colunas de informações a apresentar sobre cada produto, e permitir que os clientes para selecionar variações e escolha quantidades diretamente a partir da tabela de produtos. Isso faz as compras muito mais rápido e aumenta a sua taxa de conversão.
categorias de produtos WooCommerce shortcode
as categorias de produtos shortcodes lista suas categorias de produtos, em vez dos produtos dentro deles. Por exemplo:
irá listar qualquer 4 das suas categorias de WooCommerce, ordenadas pelo nome.
Vamos dar uma olhada em alguns dos atributos e os códigos de acesso que ir com categorias de produtos:
- limite controla o número de categorias que são apresentadas.
- orderby controla a ordem de ordenação; “Nome” e “data” são opções válidas.
- ordem representa a ordem das categorias de produtos, ou seja, “ASC” ou “DESC”.
- colunas mostram o número de colunas em que as categorias estão dispostas.
- hide_empty é usado para esconder categorias de produtos sem produtos.
- o pai permite-lhe apenas mostrar as categorias de produtos de nível superior.
- Ids representam que os IDs de categoria podem ser definidos de acordo com apenas resultados especificados de saída.
produtos Recentes
the WooCommerce Recent products shortcode mostra os produtos que adicionou recentemente à sua loja online.
Este é o shortcode para produtos recentes:
no Entanto, se você deseja exibir a data em que o produto foi adicionado à sua loja online, ou se você deseja ter mais controle e, em seguida, você pode usar o WooCommerce Tabela de Produtos plugin em seu lugar.
simplesmente ordene a tabela de produtos por data, por ordem decrescente, e use o número limite de produto para controlar quantos produtos devem incluir:
Se você incluir uma coluna de data na tabela e, em seguida, os clientes podem facilmente ver quais os produtos que foram adicionados recentemente para a loja.
Featured products
The Featured products shortcode for WooCommerce lets you listed featured products separate from the rest of your store. Use-o para listar produtos caracterizados em qualquer lugar que você gosta, por exemplo em posts de blogs ou outras páginas.
os produtos em Destaque são WooCommerce produtos que têm uma estrela azul ícone ao lado deles em Todos os Produtos da página:
Este é o atalho para a demonstração de produtos em destaque: . O resultado deve ser parecido com isto:
mais uma vez, se você não gosta da imagem de grade, em seguida, você pode listar produtos em destaque utilizando o WooCommerce Tabela de Produtos plugin shortcode em vez disso:
Este listas de produtos em destaque em uma tabela de layout, com qualquer colunas de informações que você escolheu na página de configurações do plugin.
WooCommerce sale products shortcode
the Sale products shortcode let you showcase products currently on sale. Você pode facilmente exibir-los a utilizar o shortcode:
best-seller de produtos shortcode
Use o seguinte WooCommerce shortcode para exibir o seu melhor venda de produtos em uma grade:
O quick view botões aparecem no front-end se você tem o WooCommerce Quick View Pro plugin instalado para seu site WordPress.
Se você preferir uma tabela de layout, em seguida, você pode também lista de best-seller ou produtos populares com o WooCommerce Tabela de Produtos shortcode como este:
Leia o nosso tutorial completo sobre como lista de produtos populares com WooCommerce Tabela de Produtos.
Top rated products
You can use the Top Rated Products shortcode along with Woocommerce’s built-in reviews and ratings feature to showcase your top rated products. Use o shortcode:
Você também pode listar mais votados produtos em uma exibição de tabela utilizando o WooCommerce Tabela de Produtos shortcode:
produtos Relacionados shortcode
produtos Relacionados são uma lista de produtos que são semelhantes para o produto que o cliente está navegando. Estes irão aparecer diretamente sob o produto principal na única página do produto, mas você pode usar o código de produtos relacionados com WooCommerce para listar produtos relacionados em outros lugares.
Use o shortcode para exibir produtos em qualquer lugar do seu site WordPress.
adicione ao código shortcode do botão cart
o o código shortcode do WooCommerce permite-lhe mostrar o preço e adicionar ao botão cart para um único produto com base no seu ID. Aqui está o que parece no front-end:
Você pode considerar adicionar um widgetized área da sua loja online ou um post de blog.
Este shortcode funciona com o WooCommerce Quick View Pro plugin. Quando usar ambos os plugins em conjunto, os botões de visualização rápida irão aparecer ao lado dos botões Adicionar ao carrinho. Isto é ideal se você está exibindo produtos variáveis ou se você quer que os clientes sejam capazes de mudar a quantidade antes de adicionar ao carrinho. Os clientes podem ver informações extras sobre o produto, escolher quantidades e variações e adicionar ao carrinho de uma vista rápida lightbox. Isso os mantém na página original em vez de levá-los para uma página de produto separado.
se preferir mostrar os botões Adicionar ao carrinho para vários produtos, ou se não gostar do formato por omissão com a imagem grande, então poderá usar a tabela de produtos WooCommerce em alternativa.
escolha as colunas que deseja incluir na tabela de produtos (certifique-se que inclui a coluna add-to-cart!) and use the shortcode to insert it anywhere you like. Use a opção Incluir para escolher quais produtos incluir, por exemplo:
posso mostrar códigos de acesso dentro dos códigos de acesso?
às vezes, você pode querer aninhar códigos de acesso – por exemplo, para adicionar o código de acesso do leitor de áudio WordPress de modo que ele adiciona um leitor de música embutido para a lista de produtos.
Você normalmente não pode aninhar os códigos de acesso WooCommerce. No entanto, você pode conseguir isso usando a tabela de produtos WooCommerce shortcode para listar produtos, e adicionar outros códigos de acesso aos campos que você está exibindo dentro da tabela de produtos.
Por exemplo, digamos que você quer listar 8 produtos, com um leitor de áudio incorporado para cada um. Você pode adicionar o leitor de áudio aos campos de descrição curta ou longa do produto e mostrá-los como colunas na tabela. Você então usa a tabela de produtos WooCommerce shortcode para listar esses produtos específicos, incluindo a coluna de descrição curta ou longa que contém os leitores de áudio.
Para fazer códigos de acesso a partir de outros plugins de trabalho dentro da tabela produto, certifique-se de ativar os ‘códigos de acesso’ opção no WooCommerce Produto Tabela de configurações de página:
WooCommerce page shortcodes
Let’s start by taking a look at some of the most common WooCommerce page shortcodes. Estes criam automaticamente páginas inteiras, como o carrinho ou o checkout.
carrinho de compras WooCommerce
o shortcode do carrinho de compras WooCommerce – -permite-lhe mostrar o carrinho de compras do cliente no front-end do seu site WordPress. Você pode adicioná-lo a páginas WordPress ou posts ou exibi-lo em áreas widgetized (como a barra lateral).
Ele será algo parecido com isso no front-end:
Quando você instalar e ativar o WooCommerce para o seu site WordPress, ele cria automaticamente algumas páginas para você – incluindo a página do Carrinho, que usa este shortcode. Você pode usar o shortcode para adicionar o carrinho a partes adicionais do seu site.
página de saída do WooCommerce
pode utilizar o código de saída do WooCommerce – – para gerar uma página de saída completa no seu site de comércio electrónico. Esta página também é criada automaticamente para você quando você instalar WooCommerce. Você também pode usar o shortcode para inserir o checkout em outro lugar (por exemplo, sob uma tabela de produtos para criar compras de uma página).
The WooCommerce checkout shortcode includes billing details, order details, and the option to ship to a different address.
WooCommerce order tracking
WooCommerce lets store owners create an order tracking page using the shortcode. Embora esta página não vem com WooCommerce fora da caixa, você pode simplesmente criar uma nova página e inserir o shortcode no editor de texto para criar o seu próprio. Ele deve se parecer com algo assim no front-end:
WooCommerce página de conta de usuário
WooCommerce cria automaticamente uma página Minha Conta quando você primeiro instale-o no seu website. Isto é feito usando o shortcode. Você pode usar o shortcode para inserir a área da conta em locais adicionais em todo o seu site.
o shortcode da Minha Conta duplica como um formulário de login e registo para os utilizadores que saíram de serviço. Como resultado, você também pode usar isso como um shortcode login WooCommerce.
Adicionar WooCommerce códigos de acesso mais facilmente com um botão de barra de ferramentas
Enquanto você pode encontrar todos os tipos de WooCommerce plugins shortcode na web, recomendamos o uso do livre WooCommerce Shortcodes plugin por WooThemes. Uma vez instalado e ativado, este plugin adiciona um botão TinyMCE drop-down para o editor de texto WordPress para lhe dar acesso fácil a todos os códigos de acesso WooCommerce embutido. Isto poupa-lhe a necessidade de copiar e colar os códigos de acesso.
Depois de ativar o plugin WooCommerce Shortcodes, você vai ver um novo botão shortcode no seu editor de texto WordPress. Uma vez que você clicar neste botão, uma lista suspensa irá aparecer contendo o WooCommerce códigos de acesso:
Solução de problemas WooCommerce shortcodes
às Vezes, você cole o correto WooCommerce shortcode para o editor de texto, mas ele não exibe a saída correta. Neste caso, verifique para se certificar de que você não embutiu acidentalmente o shortcode dentro <pre> tags. Você pode remover essas tags indo para o editor de texto HTML.
melhores códigos de acesso WooCommerce para a tabela de produtos
Antes de terminarmos, aqui está uma rápida repartição dos códigos de acesso WooCommerce mais úteis que você pode usar com o ‘plugin’ de tabela de produtos WooCommerce e os ‘plugins’ de Visualização Rápida WooCommerce:
| Plugin Required | Shortcode name | WooCommerce shortcode | Description | ||||
| None | Shopping Cart | Displays a shopping cart on the front-end of the website | |||||
| None | Checkout Page | Displays a complete checkout page. | |||||
| None | Order Tracking | Displays an order tracking form for your e-commerce website. | a página da conta de utilizador | mostra uma página da “minha conta” para os utilizadores | adiciona um botão do preço do produto (ou adiciona ao carrinho) à tabela de produtos. | ||
| WooCommerce Vista Rápida Pro | múltiplos produtos Shortcode | exibe múltiplos produtos (seleccionados) numa página ou post com botões de visualização rápida. | |||||
| WooCommerce Vista Rápida Pro | categoria de produtos | exibe categorias específicas de produtos na parte frontal do website. | |||||
| WooCommerce Vista Rápida Pro | categoria de produto por Slug | exibe produtos de uma categoria de produto específica, juntamente com botões de visualização rápida. | |||||
| WooCommerce Quick View Pro | |||||||
| WooCommerce Quick View Pro | produtos caracterizados | ||||||
| WooCommerce Vista Rápida Pro | produto de venda | ||||||
| WooCommerce Vista Rápida Pro | Produto Mais Vendido | ||||||
| WooCommerce Vista Rápida Pro | produto classificado de topo | ||||||
| WooCommerce Vista Rápida Pro | produto relacionado | ||||||
| WooCommerce Quick View Pro | Exibe um ‘Adicionar Ao Carrinho’ botão em um único produto, utilizando o ID do produto |
Fortaleça seu WooCommerce loja com shortcodes!
Os códigos de acesso WooCommerce são excertos de código minúsculos, permitindo-lhe adicionar recursos limpos à sua loja online. Você pode adicioná-los para comprar páginas, posts, ou áreas widgetized em seu site (como a barra lateral). Alguns códigos de acesso WooCommerce também suportam parâmetros que você pode usar para personalizar a saída.no entanto, nem todos os códigos de acesso WooCommerce proporcionam uma boa experiência de usuário. Em vez de colá-los como-é, você pode considerar usá-los ao lado do WooCommerce plugin tabela de produtos ou o WooCommerce Vista Rápida PRO plugin.
Por exemplo, é a única maneira de permitir que os clientes escolham quantidades e variações fora da página do produto, e permite mostrar informações adicionais sobre cada produto e controle o tamanho da imagem. Se você quiser flexibilidade extra, então você pode instalar a tabela de produtos WooCommerce e começar a experimentar com suas opções de código curto 50+. Isso lhe dará um olhar mais limpo e organizado no front-end, garantindo ao mesmo tempo que o seu site melhora a experiência de compras do cliente.
para recapitular, os códigos de acesso WooCommerce permitem-lhe melhorar a viagem do comprador, ver mais produtos de uma vez, e torna mais fácil para os clientes navegar rapidamente através do processo de checkout. Você também pode experimentar outros plugins de shortcode WooCommerce (como coupon Shortcodes WooCommerce) que lhe permitem alavancar recursos avançados, como a adição de códigos de cupom para a sua loja online.