quinta-feira, 21 de julho de 2011

Como instalar um menu criado no cssmenumaker.com no blog

image Muitos sonham com um menu perfeito no blog. E menu perfeito para todos os gostos, você cria no www.cssmenumaker.com. Porém, criar é fácil, mas colocar no blog, complica. Vários blogueiros têm essa dúvida, como colocar instalar um menu criado no CSS MENU MAKER no blog? Por meio deste tutorial vou responder esta pergunta.

O que parece ser difícil pode ficar fácil, se você prestar atenção e seguir todos os passos direitinhos. Para facilitar sua vida, dividi o tutorial por partes, e numerei cada passo. Então veja e faça corretamente.

Criando e baixando o menu

1. Para colocar o menu no seu blog, primeiramente temos que ter o menu, então entre no www.cssmenumaker.com e crie seu menu;

2. Criado o menu direitinho, vamos ter que baixar o mesmo em nosso computador, então clique no botão “Download Source” e faça o download;

Baixe o menu no seu computador

Instalando no blogger

3. Após ter feito o download do seu menu, vá até a pasta onde ele se encontra e extraia o arquivo no formato .rar;

Extraia a pasta

4. Depois abra a pasta extraída. Repare que dentro dela vem uma pasta chamada “images”, que contém todas as imagens do seu menu, e mais 2 arquivos, ‘index’, vizualização do seu menu e ‘menu_style’, que é o estilo css do seu menu;

image5. Agora preste atenção. Abra o arquivo ‘index’ com o bloco de notas e copie de
<div class="menu"> até antes de fechar a tag </body>;

Copie o que tiver entre as tags <body> e </body>

6. Agora vá até o Editor HTML do seu blog. Você pode colar onde você preferir, ou até mesmo adicionar como um novo gadget ‘HTML/Javascript’ no seu layout, então só como exemplo, colocaremos o menu no topo do blog. Para isso, colaremos o código depois da tag:

<body>

Cole depois de <body> 

8. Agora temos que instalar o estilo do menu. Para isso, voltamos na pasta do menu que você baixou, abrimos o arquivo ‘menu_style’ com o bloco de notas e copiamos tudo que estiver lá;Copie todo o código de estilo

9. Em seguida, vá no Editor HTML do seu blog novamente e procure pela tag:

]]></b:skin>

10. Cole o código acima dela.

11. Volte no na pasta do menu, abra a pasta ‘images’, hospede todas as imagens que estiver dentro dela em algum serviço de hospedagem de imagens na internet. Como por exemplo:

12. Depois de ter hospedado todas as imagens do seu menu, temos que substituir no estilo css dele. Para isso, vá na pasta do menu, entre na pasta ‘images’ copie o nome da primeira imagem;

Copie o nome da primeira imagem

13. Vá no Editor HTML, aperte CTRL + F e em seguida CTRL + V para colar o nome da imagem copiada anteriormente;

Procure pelo nome da imagem

14. Achado o nome da imagem no código do estilo, apenas substitua o que estiver entre parênteses pelo endereço da mesma imagens hospedada na internet;

Substitua pelo endereço da imagem hospedada na internet

15. Faça o mesmo processo com as demais imagens;

16. Após o término de todo o processo, salve o modelo e veja como ficou.

Espero que tenham entendido, caso ainda tenha dúvida, deixe um comentário.

Marcadores: , ,

4 Comentários:

Às 15 de agosto de 2011 17:44 , Blogger Lucas disse...

Muito foda valew , muito bem explicado

 
Às 24 de agosto de 2011 18:37 , Blogger Gregory Anacleto disse...

Vlw cara, me ajudou p caramba!
XD

 
Às 24 de outubro de 2012 15:51 , Blogger Sae Kawaii disse...

O meu não veio com pasta Images :(
Como faz?

 
Às 24 de outubro de 2012 15:53 , Blogger Sae Kawaii disse...

Será que de lá pra cá eles já mudaram a forma como eles fazem isso?

 

Postar um comentário

Se você gostou deste artigo deixe um comentário!

Duvidas ou sugestões comentem aqui! =D
*Não insultar autor ou leitores da postagens
*Não pedir parceria por comentários
*Não publicar spam ou similar.

Assinar Postar comentários [Atom]

Links para esta postagem:

Criar um link

<< Página inicial