Pretende apresentar incorporações responsivas do Twitter para envolver os visitantes do sítio Web?
Se quiser envolver todos os que visitam o seu sítio Web, uma solução fácil é incorporar mensagens responsivas do Twitter.
Mas adicionar incorporações responsivas do Twitter por si próprio pode ser confuso, especialmente se não estiver habituado a lidar com código.
Neste artigo, vamos guiá-lo através do processo de incorporação de feeds responsivos do Twitter no seu site.
Mas primeiro, vamos ver as diferentes formas de tornar os seus Twitter embeds responsivos.
Ou pode clicar aqui para ir diretamente para o tutorial.
Formas de adicionar incorporações responsivas do Twitter ao seu site
Para incorporar conteúdo do Twitter e garantir que os tweets são reactivos, existem 2 opções que pode utilizar:
- Maneira manual: Gerar um código de incorporação, ajustar o código para o tornar responsivo e adicioná-lo ao seu sítio.
- Maneira automática: Utilize um plug-in de redes sociais que possa apresentar automaticamente feeds do Twitter adaptados a telemóveis.
Se optar pela forma manual, terá de abrir o gerador oficial de código de incorporação do Twitter publish.twitter.com no seu browser.
Depois de gerar o código de incorporação HTML, abra novamente o seu sítio Web e insira o código de incorporação.
Infelizmente, os seus tweets podem não responder sempre se estiver a utilizar a forma manual. Para resolver esse problema, pode adicionar este código CSS.
.twitter-timeline {
width: 100vw !important;
}
E se quiser personalizar as suas publicações no Twitter utilizando iFrames, terá de editar manualmente o código ainda mais ou contratar um programador.
Como pode ver, a incorporação de conteúdo responsivo do Twitter pode ser demorada e complicada se utilizar este método.
O que é melhor: iFrame ou Twitter Embeds?
Embora algumas pessoas utilizem iFrames para apresentar conteúdos do Twitter, isso pode prejudicar o seu sítio Web de várias formas.
Uma vez que os iFrames não são responsivos por defeito, terá de editar manualmente o código para os tornar compatíveis com dispositivos móveis.
Como resultado, os visitantes em dispositivos móveis podem não conseguir ver os seus tweets corretamente.
Além disso, os motores de busca como o Google não conseguem ler o conteúdo dentro dos iFrames, o que pode ser mau para a SEO.
A boa notícia é que pode utilizar a forma automática de incorporar facilmente publicações responsivas do Twitter. Pode utilizar um plugin do WordPress que pode ligar-se ao Twitter utilizando a sua API e agregar tweets no seu site.
Vejamos este método abaixo.
A forma mais fácil de incorporar conteúdo responsivo do Twitter
Se estiver à procura da forma mais simples de incorporar conteúdo do Twitter, a melhor opção é experimentar um plug-in como o Twitter Feed Pro.
Com o Twitter Feed Pro, pode criar, personalizar e incorporar facilmente feeds do Twitter no seu site - sem necessidade de HTML, Javascript, CSS personalizado ou qualquer código.
Basta seguir um simples guia de 3 passos e pode ter um belo feed do Twitter pronto a utilizar. Pode incorporar uma linha cronológica do Twitter, hashtag, resultados de pesquisa, linha cronológica da página inicial e muito mais.
Uma vez que o Twitter Feed Pro copia automaticamente o design do seu sítio Web, o seu conteúdo do Twitter corresponderá perfeitamente ao aspeto da sua marca, logo à partida.
Pode então personalizar ainda mais o seu feed do Twitter, selecionando um modelo pré-concebido que pretenda importar.
Para uma maior personalização, o plugin vem com um editor visual onde pode definir o seu layout, cor, número de tweets, estilo de cabeçalho, carregar mais botões e muito mais.
Além disso, pode acompanhar todas as suas alterações utilizando a pré-visualização em direto.
O plugin tem um sistema de cache inteligente que guarda uma cópia do seu conteúdo do Twitter. Assim, o seu sítio pode mostrar a cópia guardada aos visitantes em vez de carregar os seus tweets de raiz de cada vez.
Como resultado, o seu sítio Web pode carregar muito mais depressa. E com um sítio Web mais rápido, também obtém uma SEO muito melhor.
Uma vez que o Twitter Feed Pro guarda uma cópia de segurança, os seus tweets incorporados estarão online mesmo quando o próprio Twitter estiver temporariamente em baixo.
Em suma, é o melhor plugin de feeds do Twitter que existe e uma solução fantástica se quiser incorporar o Twitter de forma reactiva.
Pronto para incorporar feeds responsivos do Twitter? Vá e pegue sua cópia do Twitter Feed Pro hoje mesmo!
Agora, vamos ver como pode utilizar este plugin para adicionar incorporações responsivas do Twitter ao seu site.
Como incorporar um feed do Twitter responsivo no seu site
Para começar a adicionar incorporações responsivas do Twitter, basta seguir as instruções passo a passo abaixo:
Passo 1: Instalar e ativar o Twitter Feed Pro
Pode começar por obter a sua cópia do plugin Twitter Feed Pro a partir daqui. Quando tiver o plugin, instale-o e active-o no seu site WordPress para continuar.
Para mais informações, pode consultar este guia de fácil utilização sobre como instalar plug-ins do WordPress.
Depois de o fazer, pode ir para o passo 2 e criar um feed do Twitter reativo.
Passo 2: Criar um feed do Twitter
Uma vez que o plugin vem com um fluxo guiado simples, pode criar um novo feed do Twitter com apenas alguns cliques.
Primeiro, abra o seu painel de controlo administrativo e navegue no menu Twitter Feed " All Feeds antes de clicar no botão Add New (Adicionar novo ) na parte superior.
Em seguida, o plugin pedir-lhe-á para escolher o tipo de Twitter embeds que pretende no seu website. Existem 6 opções que pode escolher, e cada uma apresentará tweets de uma fonte diferente.
- Linha do tempo do utilizador: Escolha os perfis do Twitter cujos tweets pretende incorporar
- Hashtag: Selecionar hashtags específicas e, em seguida, incorporar os tweets com essa hashtag
- Linha do tempo da página inicial: Incorporar tweets da timeline da página inicial da sua conta
- Pesquisar: Escolha termos de pesquisa e incorpore os resultados da pesquisa do Twitter no seu site
- Menções: Mostrar tweets que mencionam a conta do Twitter da sua marca
- Listas: Mostrar conteúdo da sua lista selecionada do Twitter
Pode até selecionar mais do que uma opção se pretender combinar diferentes tipos de feed num único feed do Twitter.
Para continuar, selecione o tipo de feed do Twitter e, em seguida, clique no botão Seguinte.
No nosso exemplo, vamos utilizar um feed de hashtag para apresentar incorporações responsivas do Twitter.
Agora que o seu feed do Twitter está criado, pode ligá-lo à sua conta do Twitter no passo 3.
Passo 3: Ligar a sua conta do Twitter
Para mostrar incorporações responsivas no seu site, o plugin liga-se agora à sua conta do Twitter.
Para o fazer, primeiro, clique no botão Ligar .
Em seguida, o Twitter Feed Pro pedirá acesso somente leitura à sua conta. O plugin pode então usar o acesso para ver informações do Twitter, mas não pode fazer alterações na sua conta.
Como resultado, o plugin Twitter Feed Pro é completamente seguro.
Para o fazer, basta clicar no botão Autorizar aplicação .
Assim que o fizer, o Twitter Feed Pro abrirá o seu sítio Web para que possa adicionar uma fonte ao seu feed do Twitter.
Uma fonte é o perfil do Twitter, hashtag, termo de pesquisa, lista, etc. que pretende incorporar no seu site.
Para continuar, introduza a fonte na janela de contexto e clique em Seguinte.
Para este feed responsivo do Twitter, estamos a utilizar a hashtag "KEEB_PD" como fonte.
Agora que ligou o seu feed ao Twitter e adicionou a sua fonte, está na altura de o personalizar.
Passo 4: Personalizar os seus Twitter Embeds responsivos
Para o ajudar a definir rapidamente a forma como os tweets responsivos aparecem no seu site, pode importar um modelo pré-concebido.
Eis os modelos de feed que pode selecionar:
- Predefinição
- Alvenaria
- Carrossel simples
- Cartões simples
- Carrossel de montras
- Últimos tweets
- Widget
Clique em Seguinte quando escolher um modelo de feed que prefira.
Agora, está pronto para personalizar o seu feed do Twitter utilizando o editor de feed em direto. No lado esquerdo, pode encontrar as opções de personalização para alterar o layout do feed, o design do cabeçalho, a opção de lightbox, o esquema de cores e muito mais.
Também pode utilizar as opções de moderação nas definições do feed para selecionar os tweets que aparecem no seu site.
O plugin tem uma pré-visualização simples em tempo real à direita para o ajudar a acompanhar as suas alterações.
Para começar, pode alterar o esquema dos tweets no seu Web site.
Para isso, procure a opção Layout do feed à esquerda e clique nela.
De seguida, o Twitter Feed Pro mostra-lhe 3 layouts que pode escolher: Lista, Carrossel e Alvenaria.
Vamos dar uma vista de olhos abaixo:
Se pretender mostrar os tweets de uma forma semelhante à do site oficial do Twitter, pode optar pela disposição em lista .
Além disso, desta forma, o seu feed do Twitter ficará claramente visível na sua página Web.
Se pretender utilizar colunas para apresentar as incorporações do Twitter, pode utilizar o esquema de alvenaria.
Pode mostrar toneladas de tweets de uma só vez utilizando este esquema.
Se optar pela opção de disposição em carrossel , pode mostrar os seus tweets numa apresentação de diapositivos interactiva do Twitter.
Os seus visitantes terão outra forma de interagir com o seu sítio.
Depois de selecionar um esquema de alimentação, clique no botão Guardar .
Em seguida, clique no botão Personalizar para continuar a personalizar o aspeto do seu feed do Twitter.
Desta vez, pode escolher as cores do seu feed responsivo do Twitter.
Primeiro, clique na opção Esquema de cores .
O Twitter Feed Pro vem com 4 opções de esquema de cores que pode experimentar:
- Herdar do tema: Copiar as cores do seu tema do WordPress para os seus tweets
- Claro: Cor de letra escura com um fundo claro
- Escuro: Fundo escuro e um tipo de letra de cor clara
- Personalizado: Selecionar manualmente todas as suas cores
Para continuar, selecione o esquema de cores e, em seguida, clique em Guardar.
Quer personalizar ainda mais as suas incorporações do Twitter? Pode utilizar os restantes botões para definir o estilo do cabeçalho, o design do botão, o número de tweets, o tamanho do feed e muito mais.
Por fim, clique em Guardar para confirmar o novo design do seu feed do Twitter.
No passo 5, pode finalmente incorporar este feed do Twitter no seu sítio Web WordPress utilizando este plugin.
Passo 5: Adicionar incorporações responsivas do Twitter ao seu site
Com a ajuda do Twitter Feed Pro, existem 2 formas de incorporar conteúdo do Twitter no seu sítio Web:
- Adicionar incorporações responsivas do Twitter a uma página da Web
- Adicionar incorporações responsivas do Twitter na barra lateral ou no rodapé do sítio Web
Adicionar incorporações responsivas do Twitter a uma página da Web
Uma vez que o plugin é tão fácil de utilizar, pode começar a incorporar o seu feed do Twitter diretamente a partir do editor de feed em direto.
Primeiro, clique no botão Incorporar na parte superior do editor.
Depois de o fazer, o plugin mostra-lhe um pop-up com as diferentes formas de incorporar feeds do Twitter.
Clique em Adicionar a uma página na janela pop-up para continuar.
Pode agora escolher a página do WordPress onde pretende apresentar o feed.
Depois de selecionar a página na janela pop-up, clique no botão Adicionar para continuar.
Assim que o fizer, o plugin abrirá a página no editor do WordPress para que possa incorporar o seu feed.
Em seguida, adicione um novo bloco de conteúdo clicando no ícone de mais (+).
Utilizando a barra de pesquisa na parte superior, procure o bloco "twitter feed" e, em seguida, clique no bloco Twitter Feed abaixo.
Verá então o seu Twitter incorporado no editor do WordPress.
Por fim, clique no botão Atualizar e o seu feed do Twitter ficará online.
Se abrir a sua página Web, pode ver o aspeto das suas incorporações responsivas do Twitter.
Como pode ver, o Twitter Feed Pro torna muito fácil mostrar conteúdo do Twitter compatível com dispositivos móveis no seu site.
Com isso, vamos ver a próxima maneira de incorporar feeds do Twitter.
Adicionar incorporações responsivas do Twitter na barra lateral ou no rodapé do site
A próxima opção é utilizar um widget do Twitter para apresentar tweets reactivos na barra lateral ou nas áreas de rodapé do seu Web site.
Tal como no método anterior, desta vez pode utilizar o editor em direto.
Se pretender abrir novamente um feed no editor de feed em direto, abra primeiro o menu Feed do Twitter " Todos os feeds no seu painel de controlo do WordPress.
Depois de o fazer, clique no feed do Twitter que pretende incorporar.
Como pode ver, é muito fácil reabrir um feed do Twitter no editor de feed em direto.
A partir daí, clique no botão Incorporar na parte superior para começar.
Pode agora utilizar o pop-up para criar um novo widget do Twitter para mostrar tweets reactivos.
Em seguida, clique no botão Adicionar a um Widget na janela pop-up.
Agora, o plugin abrirá a página de widgets do seu site, onde pode adicionar o seu widget de feed do Twitter.
Uma vez lá, pode escolher a localização dos seus tweets.
Se pretender mostrar as incorporações responsivas do Twitter na barra lateral, clique no painel Barra lateral .
Ou pode clicar em Rodapé para começar a apresentar tweets no rodapé do seu Web site.
Para este exemplo, vamos utilizar uma barra lateral do WordPress.
Para adicionar um novo widget, clique no ícone de mais (+) na parte inferior.
Depois de o fazer, selecione o widget Twitter Feed entre as opções disponíveis para continuar.
Pode agora terminar a incorporação do seu feed do Twitter clicando no botão Atualizar.
Assim, pode ter um feed de incorporações responsivas do Twitter na sua barra lateral ou áreas de rodapé.
E já está!
Como pode ver, adicionar incorporações responsivas do Twitter ao seu site pode ser muito fácil com a ajuda do Twitter Feed Pro.
Pode agora mostrar tweets relevantes para manter os visitantes interessados, aumentar os seus seguidores no Twitter, impulsionar as suas conversões e muito mais.
Quer incorporar feeds responsivos do Twitter? Clique aqui para obter o Twitter Feed Pro para o seu site!
Enquanto estiver aqui, não se esqueça de consultar esta lista das melhores formas de ganhar dinheiro no Twitter.
Se achou que isto foi útil, por que não nos segue no Facebook e no Twitter para obter mais dicas e truques informativos sobre as redes sociais?
