29 setembro 2012

Como colocar o menu dentro do cabeçalho.



Como podem ter notado,já a algum tempo,o menu do blog é dentro do cabeçalho (print do lay antigo abaixo).Se você tem interesse em aprender,hoje trouxe um tutorial que ensina exatamente isso,com todos os créditos ao Dicas Blogger (como excluir o cabeçalho) e o Cherry Bomb (geral)





Antes de tudo, você deve ter feito a imagem de cabeçalho com o menu dentro, é só fazer seu cabeçalho e colocar os títulos das páginas em algum lugar. 

Agora você tem que deletar o cabeçalho original do blog pelo HTML. Não esqueça de salvar uma cópia do seu modelo antes caso algo dê errado.

Vá no HTML do seu blog, aperte Ctrl+F e procure por Header1

Você deverá achar algo parecido com isso: <b:widget id='Header1' locked='true' title='NOME DO SEU BLOG (Cabeçalho)' type='Header'/>

Agora,substitua  'true'  por 'false' salve e vá no layout do seu blog.Note que,agora,tem o botão de "excluir\\\' no seu cabeçalho

Agora vamos ao mapeamento da imagem.Entre nesse site: www.image-maps.com

Lá tem a opção de fazer upload da imagem, mas eles não hospedam ela. Você deve hospedar a imagem em outro site como o www.tinypic.com e depois colar a url dela lá no site. Veja o print:

a

Depois que sua imagem for carregada, clique no botão image  na lateral do site e faça um retângulo em volta de onde você quer por um link. Veja o exemplo:


Depois é só clicar em save. Faça isso em todos os links do menu. Quando terminar, clique em:  , depois clique na guia HTML Code.
Selecione o código só até </map>  e copie.
image

Vá no blogger > Design e adicione um gadget de HTML/Javascript. Cole o código do gadget e depois do fim do código, coloque a tag </div> para fechar o código.

Salve o gadget e arraste ele para o topo do blog. Depois clique em Salvar lá em cima, e seu cabeçalho com menu está pronto!

image

Abraços,Sááh!

23 comentários:

  1. Gosti do tutorial certo o nome? Aceita afiliação com o meu blog?

    ResponderExcluir
    Respostas
    1. Claro. Lhe colocarei ali. Me coloque também :D

      Excluir
  2. Olá Sááh,adorei o tuto,mas parece que da um trabalho né?
    Bem queria que vc se possivel fizesse a divulgação do meu blog.
    O Barbie Seu Mundo Pink.
    Por favor,desde já muito obrigada.
    Beijos

    ResponderExcluir
    Respostas
    1. Farei sim flor. Colocarei na barra lateral junto com os outros que estão sendo divulgados.

      Abraços

      Excluir
  3. Sááh porque esses dias quando entro no chat eu falo com você e você nem tá mim respondendo como antes ='(

    ResponderExcluir
    Respostas
    1. Não é nada disso flor. Você também tem que aparecer + lá.
      Ahh, e muda autor pra ADM lá no SNSE. Eu já aceitei ;)

      Abraços ♥

      Excluir
  4. Tem um selinho pra vc lá no blog viu!

    ResponderExcluir
  5. Ola Saah gostaria de divulgaçao o link do blog voce ja sabe mundobarbienews.blogspot.com.br

    ResponderExcluir
  6. Otimo tutu ..
    Maluquinha para recebe sua visita
    e tbm seu cometaro fofo .
    Clique no meu perfil (blog maluco)

    ResponderExcluir
    Respostas
    1. É ótimo mesmo.
      Irei visitar seu blog agorinha.

      Abraços ♥

      Excluir
  7. Quando Clico Pra Salva Modelo Nao Vai :((
    Aceita Parceiria?
    http://mundodosbackgroudss.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Oxi, comigo foi '-'
      Aceito sim, vou te colocar nas afiliações.


      Abraços, Saah!
      ---------------♥------------------

      Excluir
  8. Goostei, mais realmente parece que da trabalho.

    Visita?? http://blogpapocorderosa.blogspot.com

    ResponderExcluir
    Respostas
    1. Sim sim, dá muito trabalho :3

      Beijos ♥.♥

      Excluir
  9. No meu eu clico qm recicle e sío aparece a imagem

    ResponderExcluir
    Respostas
    1. você mapeou a imagem pelo site?



      Excluir
    2. Coloquei no site que mandou a imagem, carregou e eu peguei o URL dela, se quiser aqui está o print:
      http://2.bp.blogspot.com/-1im3AeCcbBU/UazXyAAeqLI/AAAAAAAAAkM/HdIELxw1zpA/s1600/ce.png

      Excluir
    3. vou falar como faço: em vez de hospedar no typinic, faço uma postagem no blog de testes e copio o url por lá (clicando no botão direito, "copiar url da imagem") Então, já vou direto no www.image-maps.com

      bjs~

      Excluir
  10. Deu certo ♥ muito obrigada! Sucesso bjs

    ResponderExcluir
  11. Nossa esse seu tuto foi o primeiro que funcionou no meu blog obrigada aceita afiliação com o meu blog?ele ta sendo personalizado ainda:

    www.kissesbad.blogspot.com

    ResponderExcluir
    Respostas
    1. Obrigada você, pelo comentário. Bom, as regras pra afiliados aqui tem que ter mais de 10 seguidores..... mas vou ficar de olho no seu blog, assim que você completar te coloco aqui ^^

      Beijoos!

      Excluir

.Não gostou do blog? Cada um tem o direito de gostar ou não gostar, claro, mas expresse isso de modo civilizado, sem palavrão e ofensas.
.Não tenho nada contra o famoso ''seguindo, segue de volta?'' desde que você comente pelo menos algo sobre o post.
.Eu sempre comento de volta, e se gostar do blog, sigo.
.Viu alguma coisa sua aqui? Me contate e discutiremos o assunto.
Obrigada pelo comentário!