Hello pessoas vivos :0 . Tudo na paz? Hoje eu trago um tutorial bem procurado e pedido pelo o Léo do blog Waverly Place, que é o de como personalizar o menu padrão do blogger! Eu aburra que não sabe mecher sem tutoriais que as pessoas inteligentes fazem dessa vez eu agradeço e dou os créditos ao blog Go Imagine e a Any donadoblog por terem me ajudado, eu procurei esse tutorial e nunca consegui achar.
Bem o resultado será semelhante a este:
fiquei com preguiça de fazer um print do meu e copiei a imagem dela- desculpa- Entre no seu html é procure por /* Tabs, abaixo você encontrará algo parecido a isso: Click aqui para ver o printFeito isso, substitua todo esse código por esse: /* Menu do blogger personalizado by Go Imagine - goimagines.blogspot.com ----------------------------------------------- */ .tabs-inner { margin: 1em 0 0; padding: 0; margin-top: 0px; /*para subir ou descer o menu troque o número*/ margin-left: 0px; /*para afastar o menu para esquerda ou direita troque o número*/ } .tabs-inner .section { margin: 0; } .tabs-inner .widget ul { padding: 0; background: $(tabs.background.color) $(tabs.background.gradient) repeat scroll top center; } .tabs-inner .widget li { border: none; } /*Estado normal do menu*/ .tabs-inner .widget li a { display: inline-block; padding: 1em 1.5em; color: #fff; /*cor da fonte*/ font: $(tabs.font); /*fonte*/ border-radius: 50px; /*bordas arredondadas, apague a linha se n quiser*/ line-height: 5px; padding: 12px; background: #BFCED5; /*cor do fundo normal*/ margin-left: 8px; /*espaço entre os botões*/ } /*Estado hover e selecionado*/ .tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover { position: relative; z-index: 1; background: #8BC2C9; /*cor do fundo hover/selecionado*/ color: #fff; /*cor da fonte*/ border-radius: 50px; /*bordas arredondadas, apague a linha se n quiser*/ line-height: 5px; padding: 12px; /*espaçamento interno*/ }Lembrando que no margin-top números positivos descem e negativos sobem. Já no margin-left números negativos vão para a esquerda e positivos para a direita. Em font se você manter como está no código a fonte será aquela que você estabeleceu -ou que veio com o template- no designer do modelo, mas você pode mudar colocando o nome da fonte que preferir, assim:font: nome da fonte (ex: font: calibri;)
Testado somente no template TRAVEL!
Já participou do nosso sorteio? Não e o que etá esperando? Ganhe um anel e um par de brincos lindos! Beijos! |
13 idiotas perfeitos me amaram (::
Que lindo o menu, amei muito o tutorial!!
http://garotavertigem.blogspot.com.br
Nossa ameei o tutorial *--*
--->sonhossemsaida.blogspot.com.br
Eu adoro esses tutus de menu,acho que dá um efeito bem demais no blog,e deixa bem organizado,mas as vezes tenho preguiça de fazer..haha...
Beijos~>Seguindo =**
http://www.cotidianodeumabarbie.blogspot.com.br/
Olá tudo bem?
Amei seu blog de paixão! ele é super fofo e feminino!
Já estou seguindo! você pode visitar o meu e se gostar segue?
Beijos...
http://mundopinkvicky.blogspot.com.br/
Aiin ameei o seu blog, acheei tudo lindo principalmente o lay *--*
-- sonhossemsaida.blogspot.com
Ótimo tutorial! Amei muito!!
http://garotavertigem.blogspot.com.br/
Ótimo tutorial *-* Ameei!
Beijo
candygirl-blog.blogspot.com
Yoo! Está rolando um grande concurso no Menina Blogueira! Você concorre a afiliação (opcional), divulgação por um mês e uma caricatura original feita a lápis da sua cara em estilo mangá (será enviado por sedex)!
http://meninablogueiratutoriais.blogspot.com.br/2012/08/concurso-de-uma-caricatura-personalizada.html
amei seu log o layout apezar de simples é muito lindo é disso q eu gosto! ah estou divulgando blogs se quiser que eu divulgue o seu se cadastra la no meu blog
http://glamourdocupcake.blogspot.com.br/
Super fofo e personalizável!
Seguiindo
#Nhaac -> http://blog-pinkberry-oficial.blogspot.com.br/
mt massa mesmo eu ja sabia esses, é mt fácil dar estilos ao menu do blog, basta ter criatividade, gostei !!
BEIJÃO, IANA PAULINHA
http://ianapaulinhaaaa.blogspot.com.br/
ótimo tutorial, até porque o do blog é muito feio, né?
candyces.blogspot.cfom
Que fofo, adorei o tutorial <3
Seguindo o blog!!
Postar um comentário
Tem até regra para comentar é? Não é assim.. é que eu não gosto muito de coisas que pessoas falam ou fazem!
✓ Logico que pode dar opiniões, dicas de posts.
✓ Fale sempre o que você mais gosta e o que você não gosta aqui no blog!
✓ Pode deixar o link do seu blog eu seguirei se gostar!
✗ Não xingue e nem ao menos discuta pelos comentários do blog.
✓ Quer ajuda para fazer o lay do blog? Claro que ajudo mais terá que ao menos divulgar o blog pelo menos uma vez!
✗ Os comentários falando mal do blog serão imediatamente excluídos!
✓ Retribuirei todos os comentários!
✓ Não entendeu algo? Pode perguntar!
✗ Não aceito parceria com blogs.
✓ Aceito somente parceria com lojas!
✓ Quer se afiliar? Vai nas categorias e procura por Afiliados-Inscrições!
Muitíssimo obrigada por comentar! ♥