Como Incorporar Instagram em Posts no Blog: Fotos e Vídeos

O Instagram é uma das mídias sociais mais populares para o compartilhamento de fotos e vídeos.

Se você administra um blog, provavelmente já pensou em aproveitar o poder visual dessa rede social para enriquecer seus conteúdos. Felizmente, incorporar posts do Instagram no Blogger é simples e prático.

Neste tutorial, você aprenderá como fazer isso de forma otimizada, garantindo uma experiência incrível para seus leitores.

© Transforme seu Blog em uma Plataforma Visual: Incorporando Fotos e Vídeos do Instagram!

Sumário

Por Que Incorporar Posts do Instagram no Blog?

Ao incorporar posts do Instagram, você:

• Valoriza o conteúdo visual: Fotos e vídeos tornam seu blog mais atrativo.
• Dá créditos ao autor original: A incorporação mantém o link para o perfil do autor, promovendo respeito aos direitos autorais.
• Aumenta o engajamento: Com posts interativos, seus leitores podem acessar o Instagram diretamente a partir do seu blog.

Passo a Passo para Incorporar Instagram no HTML do Blogger

Aqui está um guia completo para incorporar fotos e vídeos do Instagram nos seus posts no Blogger. Siga cada etapa com atenção!

1. Copiando o Link do Post no Instagram

   • Acesse o site oficial do Instagram pelo computador:
     👉 https://www.instagram.com
   • Navegue até a foto ou vídeo que você deseja incorporar.
   • Clique no ícone de três pontos no canto inferior direito do post e selecione Copiar Link.

   

   © Transforme seu Blog em uma Plataforma Visual: Incorporando Fotos e Vídeos do Instagram!

   Dica: Certifique-se de que o perfil do Instagram seja público. Caso contrário, a mídia não será exibida corretamente no blog.

2. Colocando o Código de Incorporação no HTML do Blog

   Agora que você tem o link, siga estas etapas para incorporar o post ao seu blog:

   • No editor de postagens do Blogger, alterne para a aba HTML.
   • Cole o código a seguir no local desejado da postagem:

   <style>.instagram-embed{max-width:320px;width:100%;margin:20px auto;}</style>
   <div class="instagram-embed">
     <blockquote class="instagram-media" data-instgrm-permalink="LINK_DA_FOTO" data-instgrm-version="10">
         <a href="LINK_DA_FOTO" target="_blank" rel="nofollow noopener noreferrer"></a>
     </blockquote>
   </div>
   <script async src="//www.instagram.com/embed.js"></script>

   No código acima, substitua LINK_DA_FOTO pelo link direto da foto que você deseja incorporar.

   Informação: O código utiliza o script oficial embed.js do Instagram. Certifique-se de que seus leitores tenham acesso à internet para que a incorporação funcione corretamente.

3. Personalizando o Estilo da Incorporação

   Você pode ajustar o estilo da mídia incorporada para que combine com o design do seu blog. Por exemplo:

   • Largura Máxima: Modifique o valor em max-width no código CSS.

4. Exemplo de Post Incorporado

   Se inserir com sucesso imagens do Instagram em um post no blog, o resultado será assim. Não se esqueça de seguir o Instagram da gatinha também. 😅

Postagens relacionadas

Conclusão

Neste tutorial, você aprendeu a incorporar fotos e vídeos do Instagram nos posts do seu blog no Blogger.

Com isso, seus conteúdos ficam mais atrativos e dinâmicos, oferecendo uma experiência enriquecedora aos seus leitores.

Gostou deste guia? Compartilhe com outros blogueiros e deixe seu comentário abaixo! Ah, e não esqueça de seguir nosso blog para mais dicas!

Perguntas Frequentes (FAQ)

Como posso incorporar posts do Instagram no meu blog?

Para incorporar posts do Instagram, basta copiar o link do post no Instagram e colá-lo em um código HTML específico no editor do seu blog. O post será exibido diretamente no seu conteúdo, com o crédito ao autor original.

O que fazer se o perfil do Instagram for privado?

Se o perfil do Instagram for privado, o post incorporado não será exibido corretamente no seu blog. Para garantir que o conteúdo apareça, o perfil do autor deve ser público.

Como posso personalizar a exibição de um post incorporado do Instagram?

Você pode personalizar a exibição do post incorporado ajustando o código CSS. Por exemplo, alterando a largura máxima da imagem ou adicionando bordas e sombras para destacar o conteúdo no seu blog.