10 janeiro 2018

Como colocar o instagram no blog

instagram no blog

Aprenda agora como colocar o instagram no blog de
forma simples e profissional.

O instagram é uma rede social que cresce absurdamente todos os dias, e é fundamental para qualquer blog ter um perfil para ajudar na interação com os leitores e na divulgação dos conteúdos. Confesso que o manual ainda não tem o seu espaço no instagram, mas em breve quero resolver essa questão. Nesse tutorial você vai aprender como colocar as imagens do feed, mais e uma frase de ação com um botão clicável, veja:


instagram no blog

Ao clicar no botão, o leitor será direcionado para outra janela, ou seja, para o seu perfil. O manual da blogueira também já ensinou uma forma simples de como adicionar o instagram no rodapé do blog que vale a pena conferir. Acompanhe agora o passo a passo de como colocar o instagram no blog.

1. Acesse o site SnapWidget.
2. Caso não tenha uma conta no site, será preciso se cadastrar. Faça isso clicando em Sign up. Mas caso você já seja cadastrado, basta acessar o seu painel clicando em Log in.
3. Agora clique em EDIT WIDGET.

instagram no blog

4. Clique sobre o box do username e uma janela vai se abrir.

instagram no blog

5. Na janela vai aparecer um botão com fundo azul com um símbolo de mais, clique sobre ele e outra janela irá se abrir. Digite nos campos o seu e-mail e senha de acesso a sua conta no instagram, e em seguida clique em Entrar. Outra janela vai se abrir, agora clique no botão Authorize, como a imagem abaixo está ilustrando. Sua função nada mais é do que autorizar o site SnapWidget exibir o seu feed.

instagram no blog

6. Deixe o seu painel com os mesmos dados que imagem abaixo demonstra, em seguida clique em UPDATE & GET WIDGET para gerar o código.

instagram no blog

7. Agora copie e guarde o código para a próxima etapa.

instagram no blog

8. Procure por Layout, Adicionar um Gadget, clique em HTML/JAVASCRIPT e dentro da caixa de edição, cole esse código. Onde está escrito COLE O SEU CÓDIGO AQUI adicione o código que você gerou no site SnapWidget. Salve e verifique se está tudo ok.

É importante você saber:

O que pode ser mudado no estilo do código, está sinalizado com uma frase explicando a função de cada elemento CSS. Caso você não queira cor de fundo no botão, basta mudar o código da cor (#c05697) em background por transparent, tanto no botão em estado normal, como quando se passa o mouse, lembrando que sem o sinal de jogo da velha.

É possível também mudar o @seuinstagram pelo seu user, e a frase Me acompanhe no pela frase que você desejar. Caso as imagens do feed fiquem cortadas, é sinal de que você precisa diminuir o tamanho das miniaturas do código porque a sua lateral não comporta a largura total do widget. Pra resolver essa questão, basta trocar o número 125 em Thumbnail size por um número menor, e gerar um novo código. Faça testes até a largura ficar da forma que você deseja.

Gostou do tutorial? Compartilhe e marque uma amiga que precisa adicionar o instagram no blog mas não sabe como. Acompanhe o manual nas redes sociais e assine nossa newsletter.


6 comentários:

  1. Nossa, estava falando com a minha irmã hoje sobre colocar o instagram no blog. Parece que você adivinhou kkk!

    Beijos

    Boas de Papo

    ResponderExcluir
    Respostas
    1. Ai que bom, que eu "adivinhei" rsrsrs.
      Depois me conta se deu certo!
      Grande beijo :*

      Excluir
  2. Faz um post de como colocar o pinterest!!!!!!!!!

    ResponderExcluir
    Respostas
    1. O próximo tutorial será esse Millena =)
      Obrigada pela sugestão <3

      Excluir
  3. Adorei esse tutorial, era exatamente o que eu estava precisando. Muito obrigada e super parabéns por seu trabalho, toda vez que uso seus códigos eles sempre funcionam.
    - Grande beijo Andréia Blog

    ResponderExcluir
    Respostas
    1. Que linda gente <3 Obrigada Andréia! Fico feliz em saber que deu certo, fui no seu blog e vi mesmo que ficou perfeito. Um grande beijo :*

      Excluir