Colocar as atualizações do Instagram no rodapé do blog, ocupando a largura total da página - Elaine Gaspareto- Dicas para blogs e inspirações para a vida

Colocar as atualizações do Instagram no rodapé do blog, ocupando a largura total da página

Publicado em 04/12/2017


Eu já ensinei aqui no blog como gerar o widget das atualizações do Instagram e inseri-lo no blog.
Sempre coloquei o widget na lateral ou no footer do blog, mas nunca fiquei satisfeita porque queria que ele ocupasse a largura total da página.
Mexi, remexi e achei o jeito certo.
Depois de pronto fica assim:


Demonstração do tutorial


Para colocar em seu blog é bem simples.
Comece gerando o código em um dos sites que explico no tutorial que fiz tempos atrás:



Código gerado?
Acesse então a página com o código do tutorial:


Copiar o código


A seguir acesse a aba Tema de seu blog e clique em Editar HTML.
Na caixa do código-fonte tecle Ctrl+F e na barra de pesquisa digite ]]></b:skin> e localize teclando Enter.
Acima de ]]></b:skin> cole o CÓDIGO CSS e salve.
A seguir, na barra de busca, digite </body> e localize.
Acima de </body> cole o CÓDIGO HTML.
No campo onde marquei SEU CÓDIGO DO WIDGET AQUI coloque, claro, o código gerado no site Snapwidget ou Lightwidet.
Salve.
E está pronto.

Dicas extras importantes

1- Se seu blog usa o subdomínio Blogspot precisa gerar o código do widget no site Snapwidget.
Acontece que depois que o Blogger implementou o protocolo https em seus blogs a versão http do widget free fornecido pelo site Lightwidget não funciona mais em blogs sem domínio próprio.
2- No CÓDIGO CSS  está a parte onde você dita cor, fonte e tamanho de fonte do título do seu widget.
3- No CÓDIGO HTML tem a parte onde você pode trocar a frase Atualizações do Instagram pela frase que preferir.
No meu exemplo eu usei a fonte Parisienne no título.
Para usa-la ou qualquer outra fonte especial do Google fonts leia este tutorial:


E é isso, querido leitor!
Faça em seu blog e me diz, vou gostar de ver!
Se tiver alguma dúvida diga nos comentários e eu ajudo se for possível.
A aproveita pra me seguir lá no Instagram:






11 comentários

  1. Elaine, eu fiz de um jeito um pouco diferente. Na verdade, nem me lembro como mais. kkk. Mas já usei muitos tutoriais aqui do seu blog pra me ajudar. então, obrigada! Beijoss, saiba que sou leitora ativa sempre.
    thaisammaral.blogspot.com

    ResponderExcluir
  2. Oi Elaine, eu estou procurando um tutorial que me ensine a colocar fotos no final do blog, exatamente como esse seu tutorial, só que não fotos do instagram, que não tenho nem pretendo ter, eu queria colocar imagens de postagens em destaque, será que tem jeito ???

    ResponderExcluir
    Respostas
    1. Luciana, jeito tem, requer um tutorial específico.
      Assim que der eu crio um, mas preciso testar antes porque terei que juntar 2 tutoriais e ver se funciona.
      Falou, garota?
      bjssss

      Excluir
  3. Já tentei seguir esses passos, mas não aparece. Talvez porque eu tenha copiado um dos seus templates e, por isso, seria o caso de substituir e não incluir (no template ainda aparecem as suas fotos). Fato é que eu não achei no EDITAR HTML nenhum desses trechos de código. To mais perdida que mulher na promoção do shopping - no casou eu mesma!

    ResponderExcluir
    Respostas
    1. Carol, procure no código fonte por Atualizações do Instagram
      Abaixo disso vai aparecer o meu código do Snapwidget começando com <script src. Apague-o e coloque o seu.
      bjsss

      Excluir
  4. Não consegui tirar as suas fotos :/ da barra de fotos do instagram

    ResponderExcluir
    Respostas
    1. Veja a resposta ao comentário acima do seu, ele explica como fazer.

      Excluir
  5. Você sempre me salva haha. Amei, muito obrigada, deu super certo!

    ResponderExcluir
  6. Muito obrigado pelas diaca!!!
    Na parte do instagram no blog
    Acrescentei
    Para centralizar os slides

    ResponderExcluir
  7. O meu deu certo, só que não ficou o mesmo tamanho, como uso a Template Clarissa só alterei o meu snapwidget,o que será que errei, amada?

    ResponderExcluir
    Respostas
    1. Isabel, provavelmente o motivo é a configuração que vc fez no Snapwidget.
      Tem que definir lá o tamanho das miniaturas.

      Excluir

Olá! Muito obrigada por ler meu blog e obrigada também por se dispor a comentar meus posts. Seja muito bem-vindo(a)!

Importante!
Devido à falta de tempo hábil eu não me comprometo a responder perguntas referentes aos tutoriais postados neste blog.
Pedidos de ajuda individual serão respondidos conforme o meu tempo e disponibilidade permitirem.
Deixe sua pergunta ou solicitação sempre nos comentários, eu infelizmente não tenho como responder pedidos de ajuda por email.
Por favor, entenda: comentários sem relação alguma com o post não serão liberados e nem respondidos.

Para saber mais sobre a melhor forma de utilizar este blog leia Termos de uso do blog.



Muito obrigada, fique à vontade para interagir.
Mas lembre-se:
Gentileza, educação e boas maneiras servem também para a vida nos blogs…