Uma das coisas legais do Instagram é o recurso de postagens compráveis. Você pode marcar produtos diretamente em suas fotos, facilitando para os seguidores a compra de seus itens com apenas um toque.
Mas aqui está o problema – você não pode trazer automaticamente essa funcionalidade para o seu site WordPress ao incorporar publicações do Instagram. Isso pode ser um problema se você tiver um feed do Instagram em seu site e quiser permitir que os visitantes do site façam compras por meio dele.
Mas não se preocupe! Encontramos uma maneira fácil de adicionar imagens compráveis do Instagram ao WordPress usando o plug-in Smash Balloon. Essa solução permite criar um feed do Instagram para compras em seu site, ajudando a transformar seu conteúdo de mídia social em uma poderosa ferramenta de vendas.
O que é um feed do Instagram comprável?
Um feed do Instagram que pode ser comprado é uma série de fotos em que cada uma está vinculada a uma página de produto. Ao clicar na foto, você será direcionado para o produto mostrado na foto.
Você pode estar familiarizado com esse recurso quando entra no Instagram e vê que uma foto tem uma tag de produto especial, como esta:
No próprio Instagram, esse recurso é útil para os usuários que desejam comprar imediatamente um produto que veem no aplicativo. E se você for proprietário de uma pequena empresa, talvez queira trazer esse recurso para o feed do Instagram incorporado em seu site também.
O problema é que não é fácil de configurar. Você terá que configurar um catálogo do Facebook, um catálogo de produtos e uma página comercial do Facebook.
Além disso, você precisará obter aprovação do Instagram para usar esses recursos de compras.
Mais importante ainda, mesmo que você incorpore uma publicação do Instagram com uma tag de produto em seu site, essa tag pode não aparecer. Em outras palavras, você pode perder muitas oportunidades de conversão em potencial.
Felizmente, há uma alternativa fácil com o Smash Balloon Instagram Pro. Então, vamos ver como você pode adicionar facilmente imagens que podem ser compradas no Instagram ao seu site WordPress.
Você pode usar esses links rápidos para navegar pelas etapas:
- Step 1: Install an Instagram Photos Plugin With Shoppable Support
- Step 2: Connect an Instagram Account to WordPress
- Step 3: Enable Smash Balloon's Shoppable Feature
- Step 4: Filter Your Shoppable Instagram Feed
- Step 5: Customize Your Shoppable Instagram Feed
- Step 6: Embed Your Shoppable Instagram Feed in WordPress
Etapa 1: Instale um plug-in de fotos do Instagram com suporte para Shoppable
A melhor maneira de adicionar imagens compráveis do Instagram no WordPress é usar o Smash Balloon Instagram Pro. Esse plug-in gratuito permite mostrar fotos de uma ou mais contas do Instagram em um feed totalmente personalizável.
À medida que você publicar novas imagens compráveis no Instagram, elas aparecerão no seu site automaticamente, de modo que os visitantes sempre verão as últimas publicações sem que você precise adicioná-las manualmente.
Neste guia, usaremos a versão premium do Smash Balloon, pois ela tem os recursos avançados de que você precisa para adicionar imagens compráveis no WordPress. No entanto, há também uma versão gratuita que permite incorporar o Instagram no WordPress.
Antes de começar, você precisará conectar sua conta do Instagram a uma página do Facebook.
Se você tiver uma conta pessoal no Instagram, talvez também queira transformá-la em uma conta comercial, pois isso permite que o Smash Balloon mostre sua biografia e seu cabeçalho do Instagram automaticamente.
Para obter instruções passo a passo sobre como fazer essas duas coisas, consulte a seção de perguntas frequentes no final deste guia.
Quando estiver pronto, instale e ative o plug-in Smash Balloon Instagram Pro. Para obter mais detalhes, consulte nosso guia sobre como instalar um plug-in do WordPress.
Após a ativação, vá para Instagram Feed ” Settings e insira sua chave de licença no campo “License Key”.
Você encontrará essas informações em sua conta no site da Smash Balloon.
Depois de inserir a chave, basta clicar no botão “Activate” (Ativar).
Etapa 2: Conecte uma conta do Instagram ao WordPress
Depois de ativar o plug-in, sua primeira tarefa é conectar sua conta do Instagram ao WordPress. Basta acessar Instagram Feed ” Settings e clicar em “Add New”.
Com o Instagram Feed Pro, você pode criar feeds a partir de publicações marcadas e hashtags ou até mesmo criar um mural social com conteúdo de vários sites de mídia social diferentes.
Queremos mostrar imagens compráveis da nossa linha do tempo do Instagram, portanto, basta selecionar “User Timeline” (Linha do tempo do usuário) e clicar em “Next” (Avançar).
Agora, escolha a conta do Instagram de onde você obterá as imagens para compra.
Para começar, clique no botão “Add Source” (Adicionar fonte).
Depois disso, escolha se deseja mostrar imagens para compra de uma conta pessoal ou comercial do Instagram.
Se você marcar a caixa ao lado de “Personal”, o Smash Balloon não incluirá o avatar e a biografia do Instagram em seu cabeçalho por padrão. No entanto, você sempre pode adicionar o avatar e a biografia do Instagram manualmente nas configurações do plug-in.
Depois de escolher “Pessoal” ou “Comercial”, clique em “Fazer login com o Facebook”.
Agora, você pode selecionar a conta do Instagram que deseja apresentar em seu site do WordPress e clicar em “Next” (Avançar).
Depois disso, marque a caixa ao lado da página do Facebook que está vinculada à conta do Instagram com suas imagens para compra.
Depois de fazer isso, basta clicar no botão “Next” (Avançar).
Agora você verá uma janela pop-up com todas as informações às quais o Instagram Feed Pro terá acesso e as ações que ele pode executar.
Para restringir o acesso do plug-in à sua conta do Instagram, basta clicar em qualquer um dos botões para mudá-lo de “Sim” para “Não”. Esteja ciente de que isso pode afetar as fotos que você pode mostrar em seu blog ou site do WordPress.
Com isso em mente, recomendamos deixar todos os interruptores ativados. Quando estiver satisfeito com as configurações, clique em “Done” (Concluído).
Agora você verá um pop-up com a conta do Instagram que acabou de adicionar ao seu site.
Basta marcar a caixa ao lado dessa conta e clicar em “Adicionar”.
O Instagram Feed Pro o levará de volta à tela Feeds do Instagram ” Todos os feeds.
Para criar um feed, basta marcar a caixa ao lado da conta do Instagram que você deseja usar. Em seguida, clique em “Next” (Avançar).
O plug-in agora criará um feed de fotos do Instagram.
Etapa 3: Ativar o recurso Shoppabledo Smash Balloon
Em seguida, você precisará ativar o recurso shoppable do Smash Balloon. Basta selecionar a guia “Settings” e clicar em “Shoppable Feed”.
Nessa tela, vá em frente e alterne o controle deslizante “Enable” (Ativar) para que fique azul.
O Smash Balloon agora mostrará um botão “Adicionar” em cada foto ou vídeo em seu feed do Instagram.
Basta localizar a primeira postagem que você deseja tornar comprável e clicar no botão “Add” (Adicionar).
Agora você pode digitar o URL do produto ou serviço no campo “Product Link” e clicar em “Add”.
Agora, ao clicar nessa foto, o URL vinculado será aberto em uma nova guia.
Basta repetir essas etapas para tornar cada imagem comercializável.
Se precisar alterar o URL de uma postagem em qualquer momento, passe o mouse sobre ela e clique em “Update” (Atualizar).
Depois de adicionar todos os seus links, não se esqueça de clicar no botão “Save” (Salvar).
Etapa 4: Filtre seu feed do Instagram para compras
Por padrão, o Smash Balloon mostra todas as imagens e vídeos de sua conta do Instagram. No entanto, como estamos criando um feed de compras, talvez você queira filtrar suas publicações e mostrar apenas as fotos com links para um produto ou serviço.
Isso pode ajudar os compradores a encontrar produtos para comprar em sua loja on-line, sem se distrair com outras fotos e vídeos em seu feed do Instagram.
Com o Smash Balloon, é fácil filtrar as postagens do Instagram com base em suas legendas. Você pode simplesmente adicionar uma palavra-chave ou hashtag às suas imagens para compra no Instagram e, em seguida, criar um filtro correspondente no Smash Balloon.
Por exemplo, na imagem a seguir, estamos usando a hashtag #ordernow para todas as imagens que queremos tornar compráveis.
Para criar um filtro no Smash Balloon, selecione a guia “Settings” (Configurações).
Em seguida, clique em “Filtros e moderação”.
Na caixa “Only show posts containing” (Mostrar somente publicações que contenham), digite as hashtags ou palavras-chave que você deseja usar no filtro.
Para usar várias palavras no filtro, basta separar cada hashtag ou palavra-chave com uma vírgula.
Quando você estiver satisfeito com a configuração do filtro, clique no botão “Save” (Salvar).
Lembre-se de que a visualização não será atualizada imediatamente, portanto, você precisará atualizar a página para ver o filtro em ação.
Etapa 5: Personalize seu feed do Instagram para compras
Quando estiver satisfeito com as fotos e os vídeos que aparecem no seu feed de compras, talvez você queira alterar a aparência do feed.
Para personalizar seu feed do Instagram para compras, basta clicar na guia “Personalizar”. No lado esquerdo estão todas as configurações que você pode usar para alterar a aparência do feed de mídia social.
A maioria dessas configurações é autoexplicativa, mas abordaremos rapidamente algumas áreas importantes que podem ajudá-lo a obter mais vendas.
Vamos começar na parte superior, selecionando “Feed Layout”. Aqui, você pode escolher diferentes layouts para seu feed de compras, como destaque e carrossel.
À medida que você fizer alterações, a visualização será atualizada automaticamente para que você possa experimentar configurações diferentes e ver qual é a melhor.
Dependendo do layout, você terá algumas configurações extras que podem ser usadas para ajustar seu feed.
Por exemplo, se você escolher “Highlight” (Destacar), poderá dizer ao Smash Balloon para destacar publicações com base em um padrão, ID de publicação ou uma hashtag específica. Isso é ótimo para destacar seus produtos mais populares.
Você deve se certificar de que o feed do Instagram para compras tenha uma aparência tão boa em smartphones e tablets quanto em desktops.
Por padrão, o Smash Balloon mostrará o mesmo número de fotos em computadores desktop e dispositivos móveis.
Você pode visualizar como o feed de compras será exibido em computadores desktop, tablets e smartphones usando a linha de botões no canto superior direito.
É possível mostrar menos fotos para compra em dispositivos móveis alterando as configurações nas seções “Número de publicações” e “Colunas”.
Depois de fazer as alterações, clique no link “Customize” (Personalizar). Isso o levará de volta ao editor principal do Smash Balloon, pronto para você explorar a próxima opção, que é “Color Scheme” (Esquema de cores).
Por padrão, o Smash Balloon usa um esquema de cores herdado do seu tema do WordPress, mas também tem os temas “Claro” e “Escuro” que você pode querer usar para o feed de compras.
Outra opção é criar seu próprio esquema de cores selecionando “Personalizado”. Em seguida, basta usar os controles para alterar a cor do link, a cor do plano de fundo, a cor do texto no WordPress e muito mais.
Por padrão, o Smash Balloon adiciona um cabeçalho ao feed de compras, que é a foto do seu perfil e o nome da sua página.
Para alterar a aparência dessa seção, clique em “Header” (Cabeçalho) no menu à esquerda e use as configurações para alterar a cor do plano de fundo, o tamanho do cabeçalho, adicionar o texto da biografia do Instagram e muito mais.
Você também pode adicionar uma biografia diferente. Por exemplo, você pode incentivar as pessoas a comprarem seus produtos ou oferecer aos visitantes um código de cupom exclusivo.
Para obter mais informações sobre como criar esses códigos, consulte nossa seleção especializada dos melhores plug-ins de código de cupom do WordPress para sua loja on-line.
Para criar uma biografia exclusiva no Instagram, basta digitar na caixa “Adicionar biografia personalizada”.
Feito isso, clique em “Customize” (Personalizar) para voltar ao editor principal do Smash Balloon.
Em seguida, selecione “Posts”.
Isso o levará a uma tela com algumas opções diferentes.
Você pode examinar essas configurações e fazer as alterações que desejar, mas vamos nos concentrar em ‘Caption’.
Se você adicionou links shoppable às suas legendas, é importante fazer com que o texto se destaque. Por exemplo, você pode aumentar o tamanho da legenda.
Você pode até usar uma cor diferente para a legenda.
Feito isso, clique em “Posts” para voltar à tela anterior.
Aqui, você também verá uma opção “Hover State”, que é a sobreposição que o Smash Balloon adiciona a uma publicação quando você passa o mouse sobre ela.
Isso permite que os visitantes vejam os links em suas legendas sem precisar abrir a publicação do Instagram primeiro.
Nessa tela, você pode usar as configurações para criar uma sobreposição colorida atraente.
Depois de selecionar “Hover State”, você poderá alterar a cor de fundo e a cor do texto que aparece quando você passa o mouse sobre cada publicação.
Em “Informações a serem exibidas”, você verá todas as informações diferentes que o Smash Balloon pode mostrar como parte da sobreposição. Basta marcar a caixa ao lado de cada informação que você deseja exibir.
Se estiver adicionando links shoppable às suas legendas, certifique-se de deixar a opção “Caption” ativada.
Quando estiver satisfeito com as alterações, clique em “Customize” (Personalizar) para voltar à tela principal do editor do Smash Balloon. Agora você pode selecionar a próxima opção, que é “Load More Button” (Carregar mais botões).
Por padrão, o Smash Balloon adiciona um botão “Load More” (Carregar mais) na parte inferior do seu feed do Instagram para que os visitantes possam percorrer suas publicações de compras.
Aqui, você pode alterar a cor de fundo do botão, a cor do texto e o estado do mouse.
Você também pode adicionar sua própria mensagem ao botão, digitando-a no campo “Texto”.
Embora recomendemos deixar o botão “Load More” ativado para obter mais vendas, você pode removê-lo.
Por exemplo, você pode incentivar as pessoas a visitarem sua página do Instagram limitando o número de fotos que elas podem ver em seu marketplace ou loja on-line.
Para remover o botão, basta clicar no controle deslizante “Enable” (Ativar) para mudá-lo de azul para cinza.
Se os compradores gostarem do que virem, eles poderão decidir segui-lo no Instagram usando o botão “Seguir no Instagram” que aparece abaixo do feed de compras.
Por ser um botão tão importante, você pode querer destacá-lo selecionando “Follow Button” (Seguir botão) na tela principal do editor do Smash Balloon.
Aqui, você pode alterar a cor de fundo do botão, o estado do mouse e a cor do texto.
Você também pode substituir o texto padrão “Seguir no Instagram” por sua própria mensagem.
Como sempre, quando terminar de fazer essas configurações, basta clicar em “Customize” (Personalizar) para voltar à tela principal do editor.
Se você tiver ativado o recurso de compra do Smash Balloon, clicar em qualquer publicação no feed do Instagram abrirá uma nova guia e o levará diretamente para a página do produto vinculado.
No entanto, se você não tiver ativado o recurso shoppable, talvez queira dar uma olhada no recurso lightbox do Smash Balloon.
Esse recurso permite que os visitantes abram a imagem ou o vídeo em um pop-up de lightbox sem sair do seu site. Em seguida, eles podem clicar nos links de compra em suas legendas do Instagram.
Para ativar ou desativar a lightbox, basta selecionar “Lightbox” no menu à esquerda.
Aqui, você pode remover ou adicionar esse recurso usando o controle deslizante “Enable” (Ativar).
Você também pode alterar a quantidade de comentários que o Smash Balloon mostrará na lightbox. Da mesma forma que as avaliações de produtos, os comentários positivos podem ajudá-lo a vender mais produtos e serviços.
No entanto, eles também podem distrair, portanto, talvez você queira digitar um número máximo na caixa “No. of comments” (Número de comentários).
Outra opção é ocultar completamente os comentários clicando no botão de alternância “Comentários”.
Quando estiver satisfeito com a aparência do feed do Instagram, não se esqueça de clicar em “Save” (Salvar) para armazenar suas alterações. Agora você está pronto para adicionar o feed do Instagram que pode ser comprado ao seu site.
Etapa 6: Incorpore seu feed do Instagram comprável no WordPress
Você pode adicionar o feed de compras ao seu site usando um bloco, widget ou shortcode do Gutenberg.
Se você tiver criado mais de um feed usando o plug-in Smash Balloon, precisará saber o código do feed se for usar um widget ou bloco.
Para obter esse código, vá para Instagram Feed ” All Feeds e copie o valor na coluna “Shortcode”.
Se quiser incorporar o feed do Instagram em uma página ou publicação, recomendamos o uso do bloco Instagram Feed.
Basta abrir a página ou o post em que você deseja incorporar seu feed de fotos e vídeos compráveis. Em seguida, clique no ícone “+” para adicionar um novo bloco e comece a digitar “Instagram Feed”.
Quando o bloco certo aparecer, clique para adicioná-lo à página ou postagem.
O bloco mostrará um de seus feeds do Smash Balloon por padrão. Se, em vez disso, você quiser mostrar um feed diferente do Instagram, localize “Shortcode Settings” (Configurações do código curto) no menu à direita.
Aqui, basta adicionar o shortcode e clicar em “Apply Changes” (Aplicar alterações).
O bloco agora mostrará todas as fotos e vídeos de seu feed do Instagram. Basta publicar ou atualizar a página para tornar o feed ativo em seu site.
Outra opção é adicionar o feed a qualquer área pronta para widget, como a barra lateral ou seção semelhante. Isso permite que os visitantes façam compras usando seu feed do Instagram em qualquer página do site.
Basta acessar Appearance ” Widgets no painel do WordPress e clicar no botão azul “+”.
Na barra de pesquisa, digite “Instagram Feed” e selecione o widget correto quando ele for exibido.
Esteja ciente de que o WordPress tem um widget integrado do Instagram, portanto, certifique-se de escolher aquele que mostra o logotipo oficial do Instagram.
Em seguida, basta arrastar o widget para a área em que deseja exibir o feed do Instagram para compras, como a barra lateral ou uma seção semelhante.
O widget mostrará automaticamente um dos feeds que você criou usando o Smash Balloon. Se esse não for o feed comprável do Instagram que você acabou de criar, digite o código do feed na caixa “Shortcode Settings” (Configurações de código curto).
Depois disso, clique em “Apply Changes” (Aplicar alterações).
Agora você pode ativar o widget clicando no botão “Update” (Atualizar). Para obter mais informações, consulte nosso guia passo a passo sobre como adicionar e usar widgets no WordPress.
Outra opção é incorporar o feed do Instagram em qualquer página, publicação ou área pronta para widget usando um shortcode.
Para obter ajuda na colocação do shortcode, consulte nosso guia sobre como adicionar um shortcode.
Além disso, se você estiver usando um tema habilitado para blocos, poderá usar o Full Site Editor para adicionar o bloco Instagram Feed em qualquer lugar do seu site.
Para obter mais informações, consulte nosso guia para iniciantes sobre como usar a Edição Completa do Site do WordPress.
Como adicionar imagens compráveis do Instagram no WordPress: Perguntas frequentes
O Instagram Feed Pro facilita a exibição de publicações que podem ser compradas em seu site WordPress. Dito isso, aqui estão algumas das perguntas mais frequentes sobre como adicionar imagens compráveis do Instagram ao WordPress.
Preciso de uma conta comercial no Instagram para criar um feed de compras?
O Instagram Feed Pro da Smash Balloon pode exibir imagens para compra de uma conta pessoal ou comercial do Instagram.
No entanto, o Smash Balloon não pode buscar automaticamente o avatar e a biografia do Instagram em uma conta pessoal do Instagram. Portanto, talvez seja necessário verificar se você tem uma conta pessoal ou comercial e, em seguida, mudar para uma conta comercial.
Em seguida, o Smash Balloon pode buscar seu avatar e sua biografia automaticamente.
Para verificar, basta acessar sua conta do Instagram e clicar no ícone de três linhas.
Depois disso, selecione “Configurações”.
Se você não tiver uma conta comercial no Instagram, essa tela mostrará “Mudar para conta profissional” no menu do lado esquerdo.
Se você atualmente tem uma conta pessoal e deseja mudar para uma conta comercial, clique nesse link.
Como faço para conectar uma página do Facebook a uma conta do Instagram?
Antes de adicionar imagens compráveis do Instagram ao WordPress, você precisará conectar sua conta do Instagram a uma página do Facebook.
Para fazer isso, vá até a página do Facebook que você deseja usar e clique em “Configurações” no menu à esquerda.
Depois disso, clique em “Conta vinculada” e selecione “Instagram”. Por fim, clique no botão “Connect” (Conectar).
O Facebook agora mostrará todas as informações que poderá acessar e as ações que poderá executar no Instagram.
Se você concordar em prosseguir, clique no botão “Connect” (Conectar).
Esteja ciente de que qualquer outra pessoa que gerencie sua página do Facebook poderá ver as mensagens do Instagram de seus clientes e respondê-las. Se você quiser manter suas mensagens do Instagram privadas, clique para desativar a opção.
Quando estiver satisfeito e pronto para continuar, basta clicar em “Confirmar”.
Isso abre uma janela pop-up na qual você pode digitar seu nome de usuário e senha do Instagram.
Quando estiver pronto, clique em ‘Log In’.
Após alguns instantes, você verá uma mensagem informando que suas contas do Instagram e do Facebook estão conectadas.
Esperamos que este artigo tenha ajudado você a aprender como adicionar imagens compráveis do Instagram no WordPress. Talvez você também queira ver nosso guia sobre como incorporar vídeos do TikTok no WordPress ou ver nossas escolhas de especialistas para os melhores plug-ins do WooCommerce para sua loja.
Se você gostou deste artigo, inscreva-se em nosso canal do YouTube para receber tutoriais em vídeo sobre o WordPress. Você também pode nos encontrar no Twitter e no Facebook.
Talat Mehmood
Sir very useful tutorial. So nice to find you here. Sir I am lucky to found your advise. My pleasure to do as you advise. Thanks a lot. Sir keep sending me tutorials.
WPBeginner Support
Glad you found our tutorial helpful
Administrador
Shelley R Zurek
Can the URL be an affiliate link that goes off your site to say a store or Amazon?
WPBeginner Support
If you wanted, you can reach out to Smash Balloon for the specifics on how to set something like that up.
Administrador
Optik Inspektor
Does it mean you can use instagram like a shop, or can connect it to an existing shop on another page?
WPBeginner Support
You would be connecting it to a shop on a page that is not Instagram.
Administrador