Postagens | Dicas blog, Imagem, Pc Windows

Colocar códigos na lateral do blogger

Mostrarei como colocar códigos na lateral do blogger, ou seja, área de gadgets e alguns problemas relacionados.

Atualização importante 2012, o modo para colocar códigos na lateral do blogger mudou, clique aqui para ver como colocar códigos na lateral de blogs do blogger

Já postei sobre como colocar link leia mais e como evitar um problema que poderia fazer a lateral do BlogSpot descer abaixo dos posts, um problema similar pode acontecer, mas desta vez apenas um código que quebra ao ser adicionado como gadget(HTML/Javascript)

Uma coisa importante é usar o Mozilla Firefox para inserir código, veja porque

Esses gadgets que você cria podem ser colocados em vários locais, veja como organizar os gadgets do blogger

  1. Acesse blogger.com
  2. Procure e clique em Layout Design (Design substituiu a palavra Layout. Atualização:2010)
  3. Na aba Elementos da página
  4. Clique em Adicionar um Gadget

    Adicionar gadget pode estar do lado direito ou esquerdo, acima ou abaixo da área de Postagens do blog, isso depende do modelo que você usa.


  5. Na página que abrir observe se você está em noções básicas, se não, clique nela
  6. Procure e clique em HTML/JavaScript e abrirá uma nova página para você adicionar códigos
  7. Observe que deve estar aparecendo o link Formato Rick text

    Entenda o Problema
    O link Formato Rick text ao ser clicado faz o editor mudar para Modo Escrever, evite clicar nele, ao ser visto indica que você está colocando códigos e, se clicar nele estará usando ele(ativa a opção), ao clicar em Formato Rick text esse link muda para Editar html, porém, quando aparecer o link/opção Editar Html indica que você estará usando o Modo Escrever e pode "quebrar o código", os códigos tem uma forma correta, e, qualquer caracter trocado, adicionado ou faltando pode dar um erro grave ou leve.
    Resumido, para adicionar códigos na lateral você deverá estar visualizando o link Formato Rick text mas não clicar nele

  8. Coloque o código no campo(área de texto) para Conteúdo
  9. O campo para Título é opcional
  10. Clique em SALVAR
  11. Após ter salvado o código, você deve retornar a página Elementos da página(3) onde, se preciso for, poderá Editar o gadget(elemento com código) que você colocou no seu blog.
  12. É só clicar em SALVAR e ver como ficou seu blog

    Se você clicou em Formato Rick text é altamente aconselhável ver seu blog com outros navegadores(IE, Mozilla e Chrome) para ter certeza que não houve problema

  13. Clique para ampliar colocar codigo na lateral de um blog do blogger


    Dicas para evitar erro
    Algumas coisas a se ter cuidado e que podem ocasionar problemas são:
  • Ao copiar um código deixar um caracter faltando ou não copiar todo o código.
  • Copiar um código de um site e colocar em um documento de texto com formatação, ou até mesmo com quebra de linha, os documentos as vezes substituem um caracter por outro semelhante, e, se ele inserir um espaço ou uma linha em branco num local onde não poderia causam um erro no código.
  • Raramente o código disponibilizado em um site pode estar errado ou ser incompatível, então, quando usá-los, leia as instruções do site e, se der erro certifique-se que fez tudo corretamente e, se sim, tente avisar sobre o problema e se quiser/puder peça ajuda naquele mesmo site.


33 comentários:

  1. Amigo... Não estou conseguindo o , a explicação não foi tão explicativa! Mas flwo!

    ResponderExcluir
  2. Eu pensava que dava para colocar o gadget na lateral do blogger mais nao deu pq?

    ResponderExcluir
  3. ruan

    Praticamente todos os modelos tem como colocar gadget na lateral, alguns até acima do post, e também código se quiser, esse post mostra os passos e relata um problema e cuidados ao adicionar códigos na lateral.


    Quanto ao outro comentário de que não ficou tão explicativo, admito, é difícil passar a mensagem de que se a pessoa clicar na opção/link Formato Rick text desse editor/local do blogger pode causar um problema em alguns códigos.

    ResponderExcluir
  4. Anônimo7/5/10

    Ola!
    Eu gostaria de perguntar como faz para colocar um video do youtube em um post??

    ResponderExcluir
  5. Anônimo

    Até ter algo melhor veja esse post aqui

    ResponderExcluir
  6. Anônimo11/5/10

    Ameiii esse Blog!!!
    Gostaria de perguntar qual a melhor maneira de se devulgar um blog, para torna-lo conhecido e atrair bastante seguidores para ele??

    ResponderExcluir
  7. Anônimo

    Não existe uma formula mágica, o que eu faço é adicionar o feed do meu nestes abaixo
    keegy
    blogcatalog
    BlogBlogs
    Dihitt
    No lado esquerdo tem link deles, bem abaixo, no rodapé tem umas imagens pequenas, também são sites de divulgação, só que optei por usar rel="nofollow" para os links delas, eles já recebem resumo do meu conteúdo, deviam se dar por satisfeitos. Você pode ficar atento a cada blog que visitar se eles tem algum que você não conhece.

    Além disso, o melhor mesmo é postar coisas interessantes e que ninguém fez, ou fazê-lo do seu jeito desde que as pessoas entendam.

    ResponderExcluir
  8. Anônimo14/5/10

    Como fasso para excluir um blog??
    tenho dois e enjoei de um...
    Parabens pelo seu blog
    Bjss

    ResponderExcluir
  9. Nossaaa, o seu Blog e muuuuito Mara *----*
    Parabens!!
    A minha pergunta e a seguinte:Quero colocar um video do Youtube no lugar de um gadget da lateral, so que quando eu ponho o video e vou visualizar o blog, o video fica cortado na metade... Pq?? O que devo fazer??
    Bjss

    ResponderExcluir
  10. Anônimo

    Se teu blog é do blogger pode seguir esse link para ver como exclui

    Mitchanzinha

    No site do youtube tem abaixo do vídeo um botão Incorporar, ao clicar nele aparece opções de cores de borda e tamanho, pode facilitar e escolher o menor tamanho, apesar de ser grande para essa área.

    Depois você pode alterar o código referente a largura e atá altura, veja como é o código e o que irei alterar a código html de largura concreta para um código style Css de largura baseada em porcentagem.

    <object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/eFdSF7DW2T8&hl=pt_BR&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/eFdSF7DW2T8&hl=pt_BR&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>


    Agora veja atentamente como ficaria um código com largura alterada:


    <object style="width:95%;" height="300"><param name="movie" value="http://www.youtube.com/v/Wxh75vKppBo&hl=pt_BR&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/Wxh75vKppBo&hl=pt_BR&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" style="width:95%;" height="300"></embed></object>

    O vídeo terá 95% da largura do local onde você colocar ele, se for um local estreito ele ficará estreito(como na lateral do blogspot), porém, também diminui um pouco a altura, essa não pode ser em porcentagem, deve continuar um valor concreto, e, você pode fazer o mesmo no código de um vídeo, pode diminuir mais o valor da altura, se preciso for.

    Muito cuidado com os códigos, uma vírgula ou outro caracter faltando ou a mais pode dar erro, até um espaço faltando.

    Finalizando, substitui os códigos html de largura concreta→ width="425" pelo código style Css de largura em porcentagem→ style="width:95%;" e lembrando que os 95% não é são do tamanho real do vídeo, mas sim, correspondente a largura da lateral do blog ou outro local que queira colocar ele.

    ResponderExcluir
  11. Muuuuito obrigado pela dica de como colocar video do youtube em um gadget da lateral!!! =D
    Consegui fazer e deu certo!!
    Bjss

    ResponderExcluir
  12. Amigo Agradeço de todo Coração pelas Instruçoes
    sou novo na construção de blogs e confesso que vou aprender muito aqui, valeu!

    ResponderExcluir
  13. a barra lateral do meu blog(q fica na pág. principal sumiu),porém, na pág de elementos do blog ela está lá c/ todos os elementos(contador de visitas,seguidores,postagens).como faço p/resolver esse problema?

    ResponderExcluir
  14. Este comentário foi removido pelo autor.

    ResponderExcluir
  15. Luciana Fiel

    Poderia ser várias coisas, alguma modificação errada no código HTML do blogger, por isso é bom sempre ter uma cópia de seu modelo, poderia ser a função de link leia mais do blogger.

    É bom sempre pensar no que você fez antes de ver o problema, Luciana, no seu caso, a lateral não sumiu, quando você estava na opção de adicionar gadget e HTML/JavaScript você deixou varias linhas em branco quando adicionou códigos ou texto num gadget(HTML/JavaScript ou texto) que está bem acima dentro da lateral, e, por isso o restante da lateral está la embaixo. Você deve ir em Editar Gadget e retirar essas linhas abaixo do código ou texto daquele gadget que está no alto da sua lateral.

    Cuidado com linhas em branco nos editores, isso vale para as áreas do blogger onde você pode escrever e vale para outros editores.

    Um jeito de ver se deixou linha em branco é tentar mover o cursor para baixo dentro da área de edição e, se conseguir é porque pode ter linhas em branco, para retirá-las posicione o cursor abaixo do texto ou código e use a tecla delete, cuidado, no editor, se você tiver algo abaixo do cursor poderá ser apagado.

    Luciana, no seu último post você postou uma imagem que estava no seu email, isso vale para todos, 'é impossível postar imagens que estão dentro de email', você deve salvar ela em seu Pc primeiro e usar aquela que está no Pc, isso porque essa imagem é destinada a você e protegida de tal forma que só você possa ver, você vê ela e os outros não. Isso também pode valer para outros locais protegidos por login e não aberto ao público(privativo), como alguns álbuns na web, etc.

    ResponderExcluir
  16. Olá
    Bom no meu blog fiz atualização de plano de fundo e agora os gadgets da lateral sumiram.
    Li sobre: "se a pessoa clicar na opção/link Formato Rick text desse editor/local do blogger pode causar um problema em alguns códigos."
    Não entendi muito bem aonde, se faz isso mas não creio que o fiz.
    Se puder me auxiliar agradeço

    ResponderExcluir
  17. Cristiane

    Se você seguir os passos acima, no passo 6 chegará a opção para adicionar gadgets do tipo Código, é a opção HTML/JavaScript.

    Nem sempre os gadgets somem, sempre que mexer no Html do modelo é bom fazer uma cópia de seu modelo antes.

    Se você mexeu no código Html do modelo, pode ter errado em alguma coisa, um de seus blogs está com os gadgets no final do blog, possivelmente ao alterar o fundo você pode ter mexido em algum caracter que causou o erro ou la largura da área do post, isso fez com que não sobrasse espaço para os gadgets, varias coisas podem causar esse problema, o jeito é pegar uma cópia anterior de seu modelo e usar ela para substituir essa que está com erro.

    Sempre que alterar o código do modelo prefira fazer em um blog de testes antes.

    ResponderExcluir
  18. Obrigada pela resposta, o problema aconteceu no blog ntecamposnovos.blogspot.com..... eu fiz tudo que esta no passo a passo , porém mesmo assim eles não aparecem, refiz todos os elementos, a única forma de aparecer é deixando-os no final da tela.

    ResponderExcluir
  19. Olá, meu blog é recém-nascido, mas já tem visitas internacionais, sou pouco experiente.
    O imageshack vive bloqueando meu widget tradutor, então resolvi simplificar e pergunto:
    -Posso simplesmente cancelar este widget,salvar e depois inseri o tradutor do google?
    -E desta forma, terei que fazer backup?
    -Este google tradutor exige registro no imageshack?
    Desculpe, sei que são 3 perguntas, mas a dias estou pedindo ajuda a outro site de dicas e por algum motivo não estão respondendo, então.... estou aqui.
    no aguardo,..........grata!

    ResponderExcluir
  20. Márcia

    O backup do modelo do blogger não inclui os códigos dos gadgets(widgets), para guardar eles, você deve copiar o código deles, quando possível, e colar em um documento de texto sem formatação(como o bloco de notas do windows).

    O botão cancelar apenas cancela uma ação ou modificação feita naquele momento e se você ainda não salvou, para retirar um gadget você usa o botão excluir, mas não tem volta.

    O gogle tradutor não exige registro em outro site.

    O que pode acontecer é, os gadgets geralmente usam uma linguagem chamada javascript, e, alguns entram em 'conflito', fazendo com que um deles não funcione, pode estar ocorrendo algo assim, se você já tentou deixar um apenas e sozinhos eles funcionam, isso significa que é um desses conflitos, aí, você terá que escolher apenas um deles. Se você está usando um widget do imageshack, nesse site veja se não tem opções de outros tipos de códigos, talvez um que não tenha a palavra script no código.

    É muito importante ter cuidado ao adicionar os códigos, você deve colocar eles separados, por exemplo, se você colocar o código, vá até o final dele e adicione o outro apenas na outra linha depois do primeiro código. Você pode imaginar um trecho de código como uma frase, se você colocar outra no meio dela uma delas ou as duas não serão entendidas. No caso dos códigos, um ou os dois não funcionarão.

    Também, prefira o navegador Firefox para colocar códigos no blogger, eu tive um problema onde o navegador IE7 modificava o código quando eu salvava e dava problema.

    ResponderExcluir
  21. Muito obrigado! seu post me ajudou muito! :)

    ResponderExcluir
  22. Oi muito obrigado pela dica me achudou muito

    ResponderExcluir
  23. Olá, muito interessante todas as suas explicações, porem, falando sobre o Gadget SlidShow ficaria mais interessante clicando na imagem fosse direcionado para a postagem correspondente.
    Parabéns
    Abraço lucidreira

    ResponderExcluir
  24. lucidreira

    Eu tentei muito fazer isso mas não consegui, aí acabei desistindo.

    ResponderExcluir
  25. mas qual e o codigo para por no bloog para aparecer o simbolo para gostar do facebook?

    ResponderExcluir
  26. jpjimmyjp

    Esse post só mostra como colocar códigos na lateral do blogspot, você deve pegar o código no facebook, ou pesquisar na web um código para isso.

    ResponderExcluir
  27. Como eu faço para personalizar meu blog?

    tenho esse blog:

    http://universitariosconcursos.blogspot.com.br/

    Mas quero personaliza-lo porque os recursos oferecidos são simples. Quero tem aquela barra abaixo da imagem, posso dizer como uma atalho para meus colegas acessarem com mais facilidade. Como eu faço para colocar essa barra de ferramentas, e os atalhos como inicio - videos - comentários, estou perdido pode me ajudar?

    ResponderExcluir
    Respostas
    1. Isso que você falou deve ser o menu páginas do blogger e que fica abaixo do logotipo, para ver como colocar links no menu páginas, clique aqui

      Excluir
    2. Nossa muito obrigado mesmo, me ajudou demais. Agora como eu faço para colocar várias fotos minhas aparecerem na barra lateral do meu blog?

      Como slider, e como eu faço para colocar um album de fotos no blog?

      http://universitariosconcursos.blogspot.com.br/

      Excluir
    3. Você pode usar o PicasaWeb pra criar um SlideShow, clique para ver como, o Picasa é do Google e quem usa o blogger.com já possui uma conta no PicasaWeb, fica até fácil porque você já possui os álbuns do seu blog, mas pode criar outros com outras fotos.

      Excluir
    4. Obrigado pela dica :)
      Tentei colocar um HTML no meu blog, mas deu o erro 500 XML, qual será o problema? O novo modelo de Blogger tem um site especifico para HTML?

      Queria saber qual eu posso usar para alterar o meu?

      http://universitariosconcursos.blogspot.com.br/

      Excluir
    5. Quando dá esses erros você pode tentar novamente se ficar na mesma página, ou se for direcionado para uma página diferente do blogger, aí pode tentar o botão voltar do seu navegador e tentar novamente e, se o mesmo erro persistir é porque você colocou uma tag que não é aceita.

      O blogger não usa HTML comum, ele usa uma combinação de Html com Xml, sendo assim você precisaria entender Xhtml para essas alterações, veja aqui como mudar estilos no blogger, o que não for possivel dessas maneiras sem mexer em códigos, aí, você pode tentar mudar estilos usando a linguagem Css, algumas tags Html são aceitas em determinadas partes do 'código HTML' do blogger, você pode tentar, mas sempre em últimos casos.

      Crie um novo blog no blogger, um blog de testes para praticar.

      Excluir
  28. Muito obrigado, consegui colocar um gadget de calendário, meu blog é novo estou tendo dificuldades mas, aos poucos vou conseguindo.Suas dicas me ajudaram muito!!

    ResponderExcluir

→Dê sua opinião. Faça comentário relacionado ao post.
Comentário com e-mail será excluído
Antes de perguntar leia o texto até comentários e pesquise, a resposta virá no comentário, para ser avisado use uma conta e o link: Subscribe by email(abaixo)
Será excluído comentário não relacionado ou com Url de blog/site(Divulgar? Clique)

Comentário reflete a opinião do comentarista. Desde já, Obrigado!

Postagens Populares