Como colocar um menu do menu maker no blogger - Parte 1

 Como colocar um menu personalizado do site Menu Maker no blogger

Deixe seu blog mais bonito colocando um menu personalizado nele, são vários modelos e cores.

 Acesse o site do menu maker e escolha o modelo

Para que o menu funciona direito é preciso dá atenção a alguns detalhes, os modelos Drop Down, Horizontal e Tabbed são indicados para colocar no topo do blog / header, o modelo Flyout é indicado para a coluna da esquerda e o Vertical é indicado para as colunas da esquerda e direita, também pode ser colocado no footer (rodapé) do blog.

colocar menu maker no blogger
 
Os menus marcados como "premium" necessitam login e podem ser pagos.
Para exemplo, eu escolhi o menu Vertical Massive Blue, que não é premium, abrirá uma janela e clique em "customize / download", abrirá uma outra janela onde poderá editar os links e fazer os downloads no menu.
 
colocar um menu no blogger
 

Siga o passo-a-passo para editar e inserir o menu

 
1_ No menu maker, clique nos itens do menu a esquerda e em "edit item" mude o nome, insira o link e caso queira que o link abra em uma outra janela deixe a caixa "new window" marcada.
Para excluir um item clique no X ao lado do item, para adicionar um novo item escreva o nome na caixa em branco (lado esquerdo) e clique no X em azul.
 

Concluído a edição do menu vamos inseri-lo no blogger

2_ No menu maker, clique em "HTML" e copie o código.
No blogger, clique na guia "layout" e escolha o local onde quer colocar o menu, clique em "adicionar gadget", abrirá uma janela selecione "html / javascript", cole o código e salve.
 
3_ No menu maker clique em "CSS" e copie o código, abra o bloco de notas e cole, o uso do bloco de notas é apenas para facilitar a edição do código. Se o menu não usar imagens, pode colar o código direto (passo 6)
 
4_ No menu maker clique em "IMAGES" e clique em cada uma delas, elas abrirão em uma nova janela, com o botão direito do mouse clique sobre a imagem e em "salvar imagem como", faça isso com todas as imagens. Alguns menus não usam imagens.
 
Agora precisamos hospedar as imagens na internet para que elas apareçam no menu, você pode fazer isso usando o próprio blogger, clique no logo do blogger que fica na parte de cima da página e em "novo blog" para criar um blog, esse novo blog servirá como hospedagem para as imagens do menu e para qualquer outra que você quiser. Crie uma postagem para o novo blog e nela insira as imagens, publique o post e visualize.
 
 
5_ Com a página do post aberta, clique com o botão direito sobre a imagem e em "copiar atalho", no bloco de notas substitua a url das imagens, faça com todas as imagens, fique atento para substituir as imagens certas, caso alguma das imagens baixadas não conste no css não tem problema. Copie o código.
 
 
 
6_ No blogger, vá na guia "modelo" e em "personalizar",  ao lado esquerdo da página clique em "avançado" e em "adicionar css", cole o código editado, ajuste a largura da coluna se necessário, salve. Clique em visualizar e veja se o menu tá funcionado direito.
 
Acesse o link para ver o menu em funcionamento.
 
Nesse post ensinei como colocar um menu do site menu maker no blogger, no próximo post ensinarei como colocar mais de um menu sem que eles entrem em conflito e também como mudar as cores.
 

leia também:



Assine nossa newsletter e seja avisado por e-mail de novos posts.

4 comentários:

  1. Oi Eu não estou conseguindo pegar o Css. Aparece um anuncio escrito para eu pagar. Você pode me ajudar?

    ResponderExcluir
    Respostas
    1. Vi o site, ele mudou um pouco, agora se alguém quiser editar o menu pelo próprio site tem que pagar, isso é um pouco chato. Mas pode pegar o código sem edição, ao escolher o menu você verá logo abaixo um link 'source.zip', você baixa o código e edita/insere os itens do menu pelo código fonte, em breve vou criar uma 'parte 3' desse tutorial do menu maker ensinando a editar o menu pelo código fonte.

      Excluir
  2. Olá, eu já tenho um menu em cima e outro embaixo, mas eu gostaria de fazer exatamente assim como no seu, uma lista de links abaixo do rodapé e com os botons ao lado. Poderia me ensinar como fazer assim que nem o seu? Se quiser e puder dê uma olhadinha no meu blog http://leticiasellefotografia.blogspot.com.br/
    Obrigada

    ResponderExcluir
    Respostas
    1. Olá Letícia, esse menu eu inserir direto do painel do blog. Pra fazer é assim: você clica no link 'layout' do blogspot e em 'adicionar um gadget' que fica no rodapé do template, vai abrir uma pequena janela, pra adicionar o menu você seleciona a opção 'lista de links' para uma lista diversificada, 'marcadores' para que seja criada uma lista com os marcadores usados nos posts ou 'postagens populares' será criada uma lista apenas com os posts mais lidos. Para inserir os botões para se inscrever no blog é 'links de inscrição', para adicionar a caixinha do google+ é 'seguidores do google+' e para adicionar as caixas do facebook é 'html/javascript' você cola o código (veja como http://bit.ly/1O5T4KB).
      Caso o seu template não tenha 3 colunas de gadgets no rodapé você pode adicionar através do design de modelo (se o modelo for do próprio blogger): clique na aba 'modelo' e em 'personalizar', vá na opção 'layout' e em 'layout de rodapé' escolha o tipo de modelo.
      Vi seu blog ele é muito bonito!

      Excluir