Crie um guia de compras no WordPress com produtos da Shopify

Talvez você já tenha um artigo no WordPress que ajuda os leitores a escolher. Se os produtos estão na sua loja Shopify, cada recomendação pode obrigar o leitor a sair procurando o item certo. Você pode montar a página ao contrário: escrever a decisão no WordPress, manter produtos, preços e checkout na Shopify e deixar que um componente do Fy2Press exiba os produtos selecionados a partir do seu catálogo sincronizado. Você não redigita nenhum preço e não mantém um segundo catálogo.

Antes de começar, você precisa de uma loja Shopify existente (a assinatura dela é separada do Fy2Press), do plugin instalado e conectado e de uma primeira sincronização. Esta página é publicada pela Pagup, a editora do Fy2Press. O modelo de planejamento funciona com qualquer integração; os nomes dos componentes se aplicam ao Fy2Press 1.0.0. Se um único botão de compra em um único artigo é tudo de que você precisa, uma abordagem mais leve pode bastar: veja nosso guia para escolher entre um botão de compra, um plugin e um catálogo.

O que mostra o guia de demonstração pronto?

A página acima vem da nossa demonstração Morrowfield. Ela tem um título que expõe a situação do leitor, duas seções curtas que explicam o que importa e um shortcode que lista os produtos da coleção Travel essentials (mostrado aqui apenas com seu atributo essencial):

[fy2press_products_loop collection="travel-essentials"]

Cada cartão mostra uma imagem, um título, um preço e um botão View Product (Ver produto) que abre a página do produto no WordPress, onde aparecem a escolha da variante e as ações de compra. A demonstração também tem limites: os produtos dela foram gravados diretamente em um site WordPress de teste local, e não sincronizados a partir da Shopify; por isso, não há demonstração de conexão com a loja, de carrinho nem de pagamento. Em um site real, o pagamento sempre acontece na Shopify.

Qual pergunta de compra o guia deve responder?

Comece pela decisão, não pelo catálogo. Escreva uma frase que identifique o leitor e a escolha que ele precisa conseguir fazer ao final. “Vou e volto do trabalho com um notebook vários dias por semana: o que devo levar?” é uma decisão. “Nossos produtos de viagem” é uma lista.

Depois, escreva de dois a quatro critérios que realmente mudam a resposta, como capacidade, tipo de uso ou faixa de orçamento, e indique as necessidades que o seu guia não vai cobrir. Cada critério precisa poder ser verificado nas informações do produto. Se uma recomendação só pode ser justificada com “ótima qualidade”, o guia não está pronto.

Como escolher produtos sem montar um segundo catálogo?

Mantenha apenas os produtos que respondem a um critério. Cada um precisa de um motivo para estar ali e de um caso em que o leitor deveria escolher outra coisa.

Em seguida, faça a seleção existir na Shopify, onde seus produtos já estão. Uma coleção cujos produtos você adiciona manualmente dá ao guia uma lista estável, que você gerencia junto com o resto do catálogo (Central de Ajuda da Shopify: Coleções, em inglês). Verifique se a coleção e os produtos dela estão disponíveis para o canal de vendas Headless que o Fy2Press lê, conforme configurado em Conectar a Shopify.

Dois fatos sobre o Fy2Press definem esta etapa:

• No FREE, você inicia cada sincronização manualmente, e ela não é instantânea. Um produto que você adiciona à coleção na Shopify não pode aparecer no guia antes da próxima sincronização.
• As novas páginas de produto são publicadas diretamente quando são sincronizadas. Defina a visibilidade e o endereço preferido delas em Google e SEO antes da primeira execução.

Como organizar as seções?

Dê a cada parte da página uma única função:

1. Abertura: a situação do leitor e uma resposta curta.
2. Uma seção por necessidade: o critério, por que ele importa e, depois, o produto que o atende.
3. Comparação, se for útil: uma tabela curta de critérios em palavras, não em preços.
4. Próxima ação: aonde ir quando nenhuma das opções serve.

A regra principal: o texto carrega o raciocínio, e os componentes carregam os dados comerciais. Preços, disponibilidade e variantes vêm dos dados de catálogo que o Fy2Press exibe; então, deixe-os fora das suas frases. Um preço digitado em um parágrafo precisa ser corrigido à mão a cada mudança na Shopify.

Qual componente do Fy2Press vai em cada lugar?

No Fy2Press 1.0.0, os blocos não declaram nenhuma configuração própria de produto ou de coleção; eles seguem o contexto da página. A aba Adicionar às minhas páginas informa que o bloco de loop de produtos (shopipress/products-loop) mostra a coleção atual em uma página de coleção e todo o catálogo nas demais páginas. Para uma seleção escolhida dentro de um artigo, adicione o bloco Shortcode do WordPress (documentação em inglês) e cole um destes códigos, substituindo o identificador pelo nome curto (handle) que a Shopify usa no endereço do produto ou da coleção:

• Uma seleção para uma seção ou para o guia inteiro, como na demonstração acima: [fy2press_products_loop collection="identificador-da-colecao"]
• Um único produto dentro de uma seção, documentado na referência, mas não mostrado na demonstração: [fy2press_product handle="identificador-do-produto"]

Os shortcodes de elemento, como fy2press_product_price ou fy2press_buy_now, foram feitos para um contexto de produto, como uma página de produto. Copie os nomes exatos em Adicionar às minhas páginas ou em Ajuda: os nomes públicos começam com fy2press_, e a referência de shortcodes lista os atributos deles.

O que verificar antes de publicar?

Execute uma sincronização e depois abra a página pública, e não apenas a prévia do editor:

• Compare cada produto com a Shopify: título, preço, moeda, variantes e disponibilidade. Na nossa demonstração, os cartões mostram os valores com o símbolo $, enquanto a página do produto mostra C$; se os seus leitores puderem confundir as moedas, diga qual se aplica.
• Conte os produtos. Na demonstração, um atributo limit="3" não limitou o guia a três: a página renderizada mostra os quatro produtos da coleção. Para controlar o que aparece, controle o conteúdo da coleção.
• Procure espaços vazios ou valores provisórios, sinal de que falta a um componente o contexto de produto.
• Leia a página em um celular, sem rolagem horizontal.
• Siga a ação de compra até a loja Shopify correta sem concluir um pagamento de teste não autorizado.
• Identifique dados fictícios ou de teste como tais e informe quem selecionou os produtos e como, como incentivam as orientações do Google sobre conteúdo útil e que prioriza as pessoas (em inglês).

Este método encurta o caminho do leitor entre uma recomendação e um produto. Por si só, ele não promete mais vendas nem melhor posicionamento.

Qual modelo você pode copiar para o próximo guia?

Copie este roteiro para o seu documento de planejamento. A linha de exemplo usa o catálogo fictício Morrowfield.

1. Decisão

• Leitor: …
• Decisão ao final do guia: …
• Critérios que mudam a resposta (de dois a quatro): …
• Necessidades e produtos que este guia não cobre: …
• Quem seleciona os produtos, e como (informado na página): …

2. Seleção

Necessidade ou leitor	Critério decisivo	Produto (handle)	Por que, e quando escolher outra coisa
Levar uma semana de trabalho em uma só bolsa	Espaço para notebook, roupas e almoço	Mochila Transit 24 (transit-24-backpack)	Mochila de 24 litros para o trajeto diário; dispensável quando o leitor só leva itens pequenos
A preencher	A preencher	A preencher	A preencher
A preencher	A preencher	A preencher	A preencher

3. Posicionamento dos componentes

• Coleção da Shopify para este guia (handle): …
• Coleção e produtos disponíveis para o canal de vendas Headless: sim ou não
• Shortcode de cada seção: …
• Preços ou níveis de estoque digitados no texto: nenhum

4. Revisão antes de publicar

• Sincronização executada em (data): …
• Preços, moeda, variantes e disponibilidade comparados com a Shopify: …
• Leitura no celular verificada entre 320 e 414 pixels de largura: …
• A ação de compra leva à loja Shopify correta: …
• Direitos das imagens confirmados, dados de demonstração ou de teste identificados: …

5. Manutenção

• Responsável: …
• Gatilhos de atualização: produto adicionado à coleção ou removido dela; mudança de preço, de disponibilidade, de variante ou de imagem; conselho que deixou de ser exato
• Última verificação real, inserida à mão e nunca tirada de uma data de build: …

O que vem depois da publicação?

Trate o guia como uma página com rotina de manutenção. Sempre que a coleção ou os produtos dela mudarem na Shopify, execute uma sincronização, reabra o guia público e repita a lista de revisão. O PRO acrescenta uma opção para agendar a sincronização com uma licença ativa; as execuções agendadas não são instantâneas e dependem do WP-Cron.

O estudo de caso Morrowfield mostra o mesmo catálogo fictício em uma página de coleção, em uma página de produto e neste guia. Para montar o seu próprio guia, experimente o plugin gratuito no WordPress.org e depois siga Publicar com blocos e shortcodes.