Como adicionar Twitter Alimentar para Shopify Site

Se você assinar um serviço de um link nesta página, a Reeves and Sons Limited pode ganhar uma comissão. Veja nosso Declaração de ética.

Aprendendo a adicionar um Twitter alimentar para o seu Shopify website permite que sua marca mostre sua presença social em páginas como sua página inicial, blog e até mesmo páginas de produtos.

A grande parte sobre a incorporação de um Twitter feed em seu site é que ele atualiza automaticamente Twitter conteúdo em seu site, o que significa que você não precisa copiar postagens de seu Twitter Disputas de Comerciais.

Além disso, um Twitter feed é uma excelente maneira de injetar uma quantidade significativa de imagens em seu site; muitas marcas usam Twitter galerias ou feeds para servir como suas galerias de imagens da página inicial.

Há duas maneiras de adicionar um Twitter alimentar para o seu Shopify site:

  1. Com um aplicativo
  2. Incorporando código para um Twitter Widget

Neste guia, vamos orientá-lo através de ambos os métodos, permitindo que você decida qual deles funciona melhor para você. Recomendamos experimentar cada opção, pois você pode descobrir que uma parece ou funciona melhor que a outra, dependendo do layout e do fluxo de trabalho do seu site.

Continue lendo para aprender tudo sobre como adicionar um Twitter alimentar a um Shopify local na rede Internet!

Como adicionar Twitter Alimentar para Shopify Site

Para começar, vamos explorar como adicionar um Twitter alimentar para Shopify com um aplicativo. Existem vários Twitter aplicativos no Shopify App Store, todos com funcionalidades exclusivas. Alguns oferecem botões de mídia social, Twitter contagens de seguidores ou até postagem automática. O que estamos procurando, no entanto, é um aplicativo para sincronizar seu atual Twitter feed, exibindo um determinado número das postagens mais recentes de sua conta (ou outra conta pública).

Método 1: Adicionar Twitter Alimentar para Shopify com um aplicativo

Há alguns gratuitos e alguns pagos, Twitter aplicativos de feed disponíveis para download através do Shopify Loja de aplicativos. Neste tutorial, usaremos o Zestard Twitter Aplicativo de feed, pois fornece a funcionalidade necessária e é gratuito. Se você decidir por um aplicativo diferente, sugerimos experimentar todos os aplicativos gratuitos primeiro, pois esse não é exatamente um recurso pelo qual você deveria pagar.

Para começar, instale o Zestardo Twitter aplicativo de alimentação na sua Shopify loja. Se você ainda está começando com Shopifyaprenda como criar sua loja aqui. Você pode encontrar aplicativos fazendo login no seu Shopify conta e indo para Adicionar aplicativosou navegando diretamente para a App Store.

Clique Adicionar aplicativo no Shopify App Store, então Instalar aplicativo quando ele o leva de volta à tela do painel com informações sobre permissões e privacidade.

instalando o aplicativo - como adicionar Twitter alimentar para Shopify site do produto

Depois de instalado, você verá uma nova guia para Twitter alimentação sob a Apps guia em Shopify. Há também uma seção sobre Como usar o aplicativo, que você pode seguir para configurá-lo corretamente.

Alguma configuração é necessária antes de visualizar qualquer Twitter alimenta no frontend. Vá para Configurações da linha do tempo para iniciar.

indo para o Twitter aplicativo de alimentação

Esta página fornece vários campos para personalizar a aparência geral e o conteúdo do feed.

O campo mais importante a ser preenchido é o Nome do Feed; digite ou cole no Twitter alça da qual você deseja puxar. É possível exibir o feed de qualquer público Twitter perfil.

Outras configurações incluem:

  • Largura da caixa de alimentação
  • Altura da caixa de alimentação
  • Tema do feed (claro ou escuro)
  • Limite de feed (exibindo apenas um certo número de tweets recentes)
  • Cor do link de dados
  • Cor de fundo do feed

Quando terminar de personalizar, certifique-se de clicar no botão Salvar alterações para renderizar uma visualização.

colocando no nome do feed

Depois de clicar Salvar alterações, o aplicativo gera uma visualização do Twitter alimentar. Sinta-se à vontade para percorrer o feed e voltar para ajustar as configurações com base no que você gostaria de alcançar.

uma prévia do Twitter alimentar em Shopify

Logo acima da visualização, você verá que o aplicativo também gerou um shortcode para o feed. Este é um trecho de código exclusivo para você colar em qualquer lugar do seu Shopify local na rede Internet. Clique para Copiar o código para a área de transferência.

o shortcode

A Twitter O aplicativo Feed revela um pop-up para você copiar facilmente o código. Tudo o que você precisa fazer é usar o shortcode do teclado CTRL + C (Command + C para Mac) para copiar o shortcode para a área de transferência do seu computador.

copiando o shortcode para saber como adicionar Twitter alimentar para Shopify site do produto

Você pode querer colocar o Twitter alimentar-se de um Shopify página da Web, como nas páginas Sobre nós, Contato ou Suporte. Para fazer isso, vá para Loja Online > Páginas in Shopify. Abra a nova página para a qual você gostaria de adicionar o feed. Clique no <> (Mostrar HTML) botão para alternar do Editor Visual para o Editor de Código HTML.

escolhendo o editor de HTML

Cole o shortcode copiado anteriormente no editor de HTML. Se houver outro conteúdo na página, basta escolher onde deseja que o feed vá e inserir o código lá. Certifique-se de salvar a página.

colando código em Shopify página

Navegue até o front-end dessa página visualizando ou acessando seu endereço da web. Agora você verá o Twitter feed exibido exatamente onde você inseriu o shortcode.

os resultados no front-end

Muitos donos de lojas online preferem aprender como adicionar Twitter alimentar a um Shopify pagina inicial. Nesse caso, Shopify fornece um personalizador visual para a página inicial, facilitando ainda mais a inserção do Twitter código curto de alimentação.

Para isso, acesse Loja Online > Temas > Personalizar.

Em seguida, encontre a área em que você gostaria de colocar o Twitter alimentar. Clique no Adicionar Seção botão nesta área. Procure o Líquido Personalizado seção de tema e insira-o em Shopify.

adicionando uma seção

A Líquido Personalizado A seção de temas apresenta várias configurações no lado esquerdo. O mais importante deles é o Líquido Personalizado campo. Cole o shortcode previamente copiado do Twitter Aplicativo de alimentação.

Depois de clicar Economize, você verá o Twitter alimentação processada no Shopify visualização da página inicial à direita.

Você pode até personalizar um pouco a seção com opções para:

  • Esquema de cores
  • Preenchimento de seção
  • CSS customizado
como adicionar Twitter alimentar para Shopify site usando a seção líquida personalizada

A última maneira de inserir um shortcode do Twitter O aplicativo Feeds é adicionado ao código-fonte do tema real. Isso geralmente é recomendado apenas se você quiser que o Twitter feed para aparecer globalmente em determinadas seções ou páginas.

Para fazer isso, vá para Loja online > Temas in Shopify. Clique no Elipse (…) botão para revelar mais opções. Clique em Editar Código No menu suspenso.

código de edição

Escolha o theme.liquid arquivo e cole o código onde quiser dentro da codificação do tema. Como alternativa, você pode optar por modificar Modelos or seções para mais controle sobre onde o Twitter alimentação aparece.

como adicionar Twitter alimentar para Shopify site através dos arquivos do tema

Outras configurações que você pode encontrar no Twitter O aplicativo de alimentação inclui:

  • Opções para incorporar um único Tweet (ou Retweet)
  • Uma ferramenta para gerar um Twitter botão de compartilhamento
  • Opções para mostrar feeds de hashtag

Método 2: Adicionar Twitter Alimentar para Shopify com um embutido Twitter widget

Twitter oferece uma maneira de publicar qualquer linha do tempo pública em seu site. Isso significa que você pode mostrar o feed da sua marca ou as postagens de outra conta.

Para começar, vá para Publicar.Twitter.com.

Cole ou digite o URL do Twitter perfil que você gostaria de exibir como um feed em seu Shopify loja. Clique no botão de seta para prosseguir.

colando em um Twitter URL

Aqui, você tem duas opções:

  1. Linha do tempo incorporada
  2. Twitter botões

A Twitter botões são úteis para adicionar um botão Seguir ou Mencionar em algum lugar do seu site. Mas para este artigo, estamos mais focados em obter uma Twitter alimentar para aparecer. Então, selecione o Linha do tempo incorporada opção.

escolhendo uma linha do tempo incorporada em Twitter

Twitter gera automaticamente o Twitter código do widget de alimentação. No entanto, sugerimos clicar no botão Definir opções de personalização link para formatar o feed completamente antes de publicá-lo em seu site.

definir opções de personalização

Isso revela várias configurações para alterar a aparência do seu widget de feed:

  • Altura
  • Largura
  • Olhar (escuro ou claro)
  • Idioma (normalmente, você pode optar por Automático)

Clique na Botão atualizar para ver suas modificações na visualização abaixo. Como você pode ver, nossa simples mudança de Claro para Escuro já renderizado na visualização.

personalizando o Twitter Widget

Assim que estiver satisfeito com a forma como o seu Twitter feed de looks, clique no botão Copiar Código botão para copiar o código do widget para a área de transferência do seu computador.

copiando o Twitter código

Agora é hora de aprender como adicionar o Twitter alimentar para o seu Shopify local na rede Internet. A opção mais fácil é colocar o feed no seu Shopify página inicial, através de um Shopify seção.

Acesse Loja Online > Temas > Personalizar para abrir o Shopify personalizador visual. Encontre a área da página inicial que você gostaria de inserir Twitter alimentar. Clique em um dos Adicionar Seção botões para revelar Shopifycoleção de seções. Percorra a lista ou procure o Líquido Personalizado seção. Clique para adicioná-lo à página.

adicionando uma seção

Use o Líquido Personalizado campo para colar o código copiado anteriormente (do Twitter local na rede Internet). Sinta-se à vontade para ajustar outras configurações de seção, como o Esquema de cores, Preenchimento de seçãoou CSS customizado.

Você notará que, inicialmente, tudo o que é mostrado é um link para os Tweets de seu Twitter conta.

colando no código

Você simplesmente tem que clicar no Economize botão para Shopify para renderizar o Twitter feed na visualização do personalizador.

como adicionar Twitter alimentar para Shopify site no personalizador

Uma maneira adicional de adicionar um Twitter feed via código de incorporação é colocando-o em uma página específica em Shopify. Vamos para Loja Online > Páginas para realizar isso. Abra a página na qual você gostaria de editar.

Uma vez no editor de páginas, clique no botão Mostrar HTML (<>) botão. Isso muda do Editor Visual para o Editor HTML Personalizado, que é necessário para adicionar código.

indo para uma página

Cole o código que você copiou originalmente Twitter. Clique no Economize or Publicar botão para que as alterações entrem em vigor.

colando código em uma página

Visualize a página ou vá para a visualização do frontend. Aqui, você verá o Twitter feed exibido ao lado de qualquer outro conteúdo que você possa ter nessa página.

twitter alimentar no front-end

A última maneira de incorporar um Twitter widget com código é utilizando o Shopify arquivos do tema. Vá para Loja online > Temas começar. Escolha o Elipse (…) botão e selecione Editar Código.

editar código em Shopify

A theme.liquid arquivo dá a você controle total sobre o tema que você instalou atualmente Shopify. Cole o Twitter código de feed onde você quer que o feed apareça no tema. Caso contrário, é possível utilizar Modelo e Seção arquivos caso você prefira o Twitter feed só aparecem em certas partes do seu site, como na barra lateral.

como adicionar Twitter alimentar para Shopify site usando os arquivos do tema

Isso é como adicionar um Twitter Alimentar para um Shopify Local na rede Internet!

Você deve ter notado que usar um Shopify app ainda cria um shortcode para você colocar em qualquer lugar do seu site. Isso pode fazer com que você pergunte: “qual é o objetivo de usar um aplicativo?” Existem três razões:

  1. Usar um aplicativo significa que todo o seu trabalho está contido em um painel: Shopify.
  2. Há muito mais configurações de personalização disponíveis em Twitter Aplicativos de feed em comparação com o que é oferecido pelo Twitter widget incorporável.
  3. Um shortcode é pelo menos um pouco menos intimidador do que o código fornecido por Twitter.

E isso é tudo! Esperamos que nosso guia completo sobre como adicionar Twitter alimentar para Shopify ajudou você a descobrir se um plugin ou widget de código é ideal para sua loja de comércio eletrônico. Incentivamos você a procurar outros aplicativos para incorporar feeds de mídia social alternativos, como um feed do Instagram, ou até mesmo para mostrar algo como provas sociais ou vídeos do TikTok. Deixe-nos saber nos comentários se você tiver alguma dúvida!

Joe Warnimont

Joe Warnimont é um escritor baseado em Chicago que se concentra em ferramentas de comércio eletrônico, WordPress e mídia social. Quando não está pescando ou praticando ioga, ele coleciona selos em parques nacionais (mesmo que seja principalmente para crianças). Confira o portfólio de Joe para contatá-lo e ver o trabalho anterior.

Comentários Respostas 0

Deixe um comentário

O seu endereço de e-mail não será publicado. Os campos obrigatórios são marcados com *

NOTA *

Este site usa o Akismet para reduzir o spam. Saiba como seus dados de comentário são processados.

Experimente Shopify por 3 meses com $ 1/mês!
shopify-primeira-promoção-de-um-dólar-3-meses