Algumas pessoas já me perguntaram sobre o menu deste blog que tem botões com barra de rolagem. O código para fazer esse menu é dividido em duas partes:
O estilo CSS do botão que deve ser colocado junto com o restante do CSS do seu site:
.botao a, .botao a:visited{
width: 220px;
color: #000000;
text-decoration: none;
padding-top: 3px;
display: block;
padding-bottom: 3px;margin-bottom: 1px;
background-image: url(Imagem do botão);
font-family: "Comic Sans MS";
font-size: 10pt;
text-align: left;
text-indent: 6px;
}
.botao a:hover{
color: #0000FF;
background-color: #FFFFCC;
background-image: url(Imagem do botão quando o mouse estiver sobre ele);
}
E a outra parte que deve ser colocada onde o menu irá aparecer, no caso do Blogspot isso é na pagina layout, adicionar elemento, html/javascript.
<div style="width: 240px;height: 295px; overflow: auto;border: 1px
solid #999999">
<div class="botao">
<a href=”Endereço do Site” target="_blank">Nome
do Site</a>
</div></div>
Na parte do CSS a linha background-image: url(Imagem do botão); e background-image: url(Imagem do botão quando o mouse estiver sobre ele), você deve hospedar a imagem em algum site e colocar a url aqui. Se preferir pode usar uma cor de fundo trocando essas linhas por background-color: #CCCCCC; escolhendo a cor que desejar, caso use uma cor de fundo em vez de uma imagem sugiro que coloque bordas(adicione essa linha jundo com a outra border: 1px solid #333333;) está também pode ser de qualquer cor. Lembre-se de colocar a cor de fundo e borda nas duas partes do CSS. Sobre o tamanho pode ser alterado como você quiser: width: 240px é a largura do menu e width: 220px é do botão, quando fizer alterações faça nas duas larguras.
Ol´! Td bem? Eu gostariade saber como q faço pra ter um menu de parceiros igual ao seu. Gostei muito. Qq coisa me mande email ou entre no meu blog. Seu site eh bemlegal e util hein. parabéns. Vlw! FUi!
ResponderExcluirVocê poderia me indicar em que lugar do css eu coloco este código e onde fica o css no código do blogspot?
ResponderExcluirAbraço e obrigado!
Gostaria de saber como colocar os meus marcadores em uma janela com barra de rolagem, parecida com esta que está acima a direita ou como a janela do conteúdo do elblogdenya.blogspot.com. Você sabe como eu faço isso? Um abraço e obrigado.
ResponderExcluiroi estou tendo muito trabalho para deslocar a coluna do meu blog para a direita, será que vc poderia ME DAR UMA MÃOZINHA?
ResponderExcluirBJOS BOM FINL DE ANO!
Srta.Lua
ResponderExcluirpelo que entendi você quer aumentar o espaço entre as colunas, entre na pagina layout, depois editar html e procure por:
#outer-wrapper {
width:740px;
margin:0 auto;
text-align:left;
font: italic normal 100% Arial, sans-serif;
}
e aumente um pouco o valor 740, isso faz o blog ficar mais largo e portanto as colunas ficam mais afastadas. Mais para baixo encontrará essa mesma palavra width com outros valores, todas elas são larguras que você também pode alterar :sidebar(menu), main(coluna principal)
Poxa gostaria de saber como posso ter uma barra dessa igual a sua que esta escrito arquivo do blog para poder separar as coisas do meu blogger vlw
ResponderExcluirWe Ediçãoisso são imagens de fundo no titulo da sidebar
ResponderExcluiré só entrar na pagina editar html e colocar um fundo no estilo h2, consulte nosso guia rapido sobre imagem de fundo
Como faço para criar esse menu "Arquivo do Blog" que esta no canto inferior direito da tela?
ResponderExcluirwalparente@gmail.com
Wallace Parente, o nosso arquivo não tem nada de especial, entre na pagina layout, adicionar gadget, arquivo e verá as opções entre elas menu suspenso
ResponderExcluirObrigado Fabiano.
ResponderExcluirNa verdade vc me ajudou a descobrir a ferramenta q eu procurava para criar no meu blog: "Menu Suspenso"
iae manblz.
ResponderExcluireu gostaria de saber como muda o jeito da barra ali do canto,mostra um jeito meio estranho no começo eu queria trocar
Cs1.6
ResponderExcluirnão entendi o que está querendo... mudar o inicio do que?
omg omg omg *-*
ResponderExcluirera isso que tava procurando *-*
em todos sites que achava, só tinham menus prontos~
yay, obrigada~
eu gostaria de colocar uma imagem ao lado , como posso ?
ResponderExcluirAngelo e Qui
ResponderExcluirno código css que mostramos tem onde colocar imagem
background-image: url(Imagem do botão);
mas se quiser uma imagem como link o código é assim
<a href="http://www.dicasparablogs.com.br"><img src="endereço da imagem" border="0" /></a>
Fabiano, sou professora e tenho um blog, gostaria de colocar um menu com barra de rolagem, mas não conseguir, você poderia me explicar onde fica esse menu suspenso no gadget.? meu blog é: http://edleudasam.blogspot.com
ResponderExcluirDe já agradeço a consideração.
beijos
A CAMINHO DO FUTURO
ResponderExcluirmenu suspenso é como usamos o arquivo do blog.
o código que falamos aqui é para colocar uma barra de rolagem em uma lista de links, ou seja você colocaria o código num gadget de html/javascript com quantos links quiser só repetindo o trecho
< a href=”Endereço do Site” target="_blank" >Nome
do Site< /a >
e aparece a barra de rolagem para a lista não ficar longa demais e ocupar muito espaço na pagina
boa tarde....td certo?
ResponderExcluircomo faço pra fazer um menu como essa desse site? "http://www.baixarsertanejo.com/"
pode me explicar?
abraços
está falando da barra de rolagem no menu dos marcadores? no exemplo que citou o menu artistas?
ResponderExcluirse for é só colocar no html do blogger o código
#Label1 {height: 300px; overflow: auto}
e ajustar o valor 300 para o tamanho que desejar