sábado, 18 de fevereiro de 2012

Como colocar o menu dentro do cabeçalho.

Oi meus gatinhos de chocolate! Tudo beleza? Então, tirando a poeira da tag "Tutoriais", trago um tutorial exclusivo de como colocar o menu dentro do cabeçalho, assim como no Cutie Encomendas ~print ae~
image
Source: Tumblr 
Então clique no link leia + e aprenda como fazer!
Então pessoal, primeiro você precisará excluir o cabeçalho. Tem um tutorial sobre isso aqui.
Depois é só fazer um cabeçalho com um espaço bem amplo para colocar o menu.  Fiz um cabeçalho de exemplo:
Clique para ampliar - Cabeçalho apenas para exemplo, se usar, credite.
Eu sei, não ficou aquela coisa linda (fiz correndo), mas enfim. Depois de fazer o cabeçalho, hospede a imagem em hospedador de imagens e guarde a url da sua imagem. Depois escolha um menu. Tem alguns tutoriais tipo esse aqui, esse aqui e esse aqui
Agora vamos usar um script para inserir o menu em cima do cabeçalho.
<div style="background:url(Url da imagem do cabeçalho aqui) right no-repeat; height: 330px; width: 950px;"><div style='float:right; padding-top:19px; padding-right:0px;'>Script do menu</div></div>
Explicando:
height: Altura da imagem
width: Largura da imagem
float: Lado onde o menu vai "flutuar" (right: direito/left: esquerdo)
padding-top: Número em px que o menu vai ficar (cima). Quanto mais aumentar esse número, mais o menu abaixa.
padding-right: Número em px em que o menu vai ficar pelo lado direito
Script do menu: É onde você coloca o código de instalação do seu menu, exemplo:
<div class="menu"><a href="http://cutieteens.blogspot.com">Home</a></div>
Depois é só adicionar um gadget HTML/Javascript e pronto!
Espero ter ajudado, beijins :*

11 comentários:

  1. Fofa gostaria de fazer afiliação. Aceita?
    www.cute-bii.blogspot.com

    ResponderExcluir
  2. Gostei do tutorial, já vi em alguns blogues o menu dentro do cabeçalho e fica lindo.
    http://plumasepaets.blogspot.com/

    ResponderExcluir
  3. Oii tem selinho para você lá no blog!

    http://rosarosalina.blogspot.com/2012/02/selinhos.html

    ResponderExcluir
    Respostas
    1. Flor, eu não aceito mais selinhos nem tags pois não tenho tempo para repassar ' - '

      Excluir
  4. Obrigada por passar no meu blog ^^ Vc será sempre bem-vinda. Te espero mais vezes no Teen Style Viu ? E aceita fazer afiliação comigo? Estou esperando a resposta
    Http://teenstyle-oficial.blogspot.com/

    ResponderExcluir
  5. Amei seu blog. Muito legal as dicas.
    http://sucessoparaseublog.blogspot.com/

    ResponderExcluir
  6. Oi, amei o tutorial, vc visitou o blog da minha BFF e ela ficou emocionada, se der tempo olha la o meu blog , naum tem muitas coisas, mas msm assim tem...

    http://someonelikeme-duda.blogspot.com/

    ResponderExcluir
  7. Vivyh, obrigada pela visita no CG! Concordo com você, os dois são importantes ^^
    Amei esse tutorial, pretendo um dia faz um lay com menu no cabeçalho assim, agora já sei como fazer! Valeu pelo tutorial!
    Beijoo ;*

    ResponderExcluir
  8. Adorei o tutorial, mas... Você não disse onde coloca o script! Realmente não consegui fazer isso aí.
    www.justdebee.blogspot.com

    ResponderExcluir
    Respostas
    1. Moça, tu deve colocar o código no HTML/JavaScript, assim como dito anteriormente em: "Depois é só adicionar um gadget HTML/Javascript e pronto!" '-' Espero ter ajudado, bjs.

      Excluir

Obrigada pelo comentário! Mas ó,
- Leia as Regras do blog.
- Não se esqueça de deixar o link do seu blog para eu visitar. <3
- Retribuo quase todos os comentários.
- Se tiver dúvidas,visite a Faq.
- Eu não aceito selinhos nem tags :@