23 de outubro de 2012

16

Colocando Barra de rolagem em um determinado Gadget do Blog



Olá! Esta sema mostrarei como colocar Barra de rolagem em um  determinado gadget do blog, pode ser qualquer gadget você pode adicionar uma barra de rolagem e isso no blog é muito útil, pois ele diminuirá os espaço que o gadget ocupa no seu Layout...




Só lembrando, este tutorial estou fazendo a pedido de uma leitora do nosso blog, a Patricia ela disse que há vários Sites que ensina a colocar barra de rolagens nos gadgets, mas o modo em que os Sites ensinam ela não conseguiu compreender e ela pediu que nós fizesse um tutorial ensinando de um mode mais fácil de entender e explicado...

Voltando o assunto, pra colocar essa barra de rolagem é bastante fácil.
Primeiro vamos acessar o HTML do Blog, então vá em MODELO>> depois emEditar HTML>> e em Prosseguir


Agora preste atenção: Como queremos acrescentar uma barra de rolagem em um determinado Gadget, é preciso sabermos qual é o ID daquele gadget, pra quem ainda não sabe o ID se trata da "Identidade" daquele gadget. E pra encontrar o ID de um Gadget é fácil, é só você ir no HTML do seu blog e procurar pelo título que você pois no gadget.

Então procure pelo título que você colocou no seu Gadget, pra facilitar utilize as teclas Ctrl+ F e busque pelo titulo do gadget.

Exemplo:
vou pesquisar pelo meu gadget, o titulo dele está assim: "Veja mais"...

Quando encontrar, a linha em que ele se encontra vai estar assim:
<b:widget id='Label1' locked='false' title='Veja mais' type='Label'/>

Observe: quando você buscar pelo titulo do seu gadget a linha em que ele se encontra vai aparecer como mostra no exemplo acima, mas preste a atenção que cada gadget tem uma ID diferente ( Palavras e números diferentes) no meu caso o  id do meu gadget está assim:Label1mas no seu HTML pode estar de outro jeito...
O ID é só aquela palavra que está entre aspas, veja o exemplo abaixo:
 id='seu id'
Pronto! já aprendemos como encontrar o ID de um gadget, mas se você quiser aprender mais sobre como encontrar o ID de um gadjet, eu lhe convido a lê o nosso tutorial...

E por fim, vamos colocar a Barr de rolagem no Gadget
Ainda no HTML, vamos procurar por esse Tag:
]]></b:skin>
E acima dele você vai colocar esse CSS:
#Label1 {height: 180px;overflow: auto;}

Altere o Código:
No código a parte que eu destaquei em cor de rosa você vai substituir polo ID do seu Gadget
A parte destacada em Vermelho você vai Ajustar a Altura do Gadget.

Prontinho pessoal, agora é só você clicar em visualizar e vê se você fez certo e depois salvar.


16 comentários:

  1. Ufa... até que enfim consegui hehehe rsrs , ficou perfeito ! Muito boa a dica, obrigada e mais uma vez parabéns !

    ResponderExcluir
  2. Olá amigo,
    Será que tem algum código que quando o height for menor que o valor estipulado, ele (height) não fique fixo? Exemplo: #BlogArchive1 { height: 500px; overflow: auto; } Esse é o gadget do arquivo do blog, quando está no início do mês ele diminui consideralvelmente por causa que não tem nenhuma postagem ainda, ou seja a altura que antes ultrapassava os 500px agora tá em torno de 300px, daí o gadget fica com 200px de espaço em branco. Você sabe como contornar isso meu caro? Desde já agradeço.

    ResponderExcluir
  3. cara o teu modo de explicação é 100% !! peguei varias dicas sua !!valeu mesmo nota 10!!!!!

    ResponderExcluir
  4. Parabéns pela dica! Só uma pergunta, teria como pertencer à rolagem apenas o conteúdo sem o título? Obrigado.

    ResponderExcluir
  5. Muito Obrigada! Tentei com explicação de outros blogs e não deu certo.. a sua foi perfeita e funcionou direitinho!

    Obrigada! =)

    ResponderExcluir
  6. gente não consigo colocar barra de rolagem algem pode mim esplicar melhor agradeço

    ResponderExcluir
  7. Muito Obrigado Deus te abençoe conseguir...

    ResponderExcluir
  8. MUITO OBRIGADO!DEU TUDO CERTO.FICA NA PAZ,JESUS TE AMA.

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

    ResponderExcluir
  10. Q estranho, at a parte de visualizar modelo aparece que deu certo, eu salvo, mas não blog não tá certo :(

    ResponderExcluir
  11. Oii gostaria da ajuda de vcs, sempre quando tem que colocar o código acima nunca da certo para mim, mas ao lado e abaixo da certo será que vcs podem me ajudar e dizer o que estou fazendo de errado. obrigado

    ResponderExcluir

Observe:
Faça seu comentário dentro do assunto tratado na postagem.
Não pode divulgar endereço de Sites ou Blog.
Comentário que conterem divulgação serão moderados, somente serão aceitos links caso necessite de informar alguma fonte.


Copyright © - Todos os Direitos Reservados: Várias Dicas para Blogs |
Design by Kelven Pedro | Tecnologia do Blogger - É Proibido a copia do conteúdo deste blog sem autorização
    Twitter Facebook