Aprenda a criar menus descolados para o seu site

 

Aprenda a criar menus descolados

Um menu (ou “lista de opções”), como todos sabem, é fundamental para a boa navegabilidade de sites ou blogs. (Leia o artigo: O menu é a tábua de salvação dos navegantes)

Um menu bem feito e com estilo pode dar um visual diferenciado ao layout de um site, servindo também como uma vitrine de opções…

Sem entrar no contexto da navegabilidade e da funcionalidade dos menus, iremos apresentar nesta dica um aplicativo gratuito que cria menus Horizontais, Verticais e em Drop Down com vários estilos que poderão ser adicionados no seu site.

O CSS MenuMaker é um serviço que oferece vários tipos de menus, onde o usuário cria  e faz o download do código HTML, código CSS e das imagens do menu. São vários tipos, cores e estilos para deixar qualquer webdesigner bem satisfeito.

Usando o CSS Menu Maker

 

Acesse o site: www.cssmenumaker.com

 

Escolha o tipo de menu, clicando nos links [Drop Down], [Horizontal] ou [Vertical].

Como exemplo, usaremos menus Drop Down. Agora escolha o tipo de menu que deseja criar, clicando sobre a imagem…

Como exemplo, escolhemos o menu “Blue Dawn Drop Down”. Clique em [Customize]

Para acrescentar os links do menu, clique em [Add Button]

Descreva o títulos dos botões e acrescente os links das páginas de destino. No nosso exemplo, utilizei “marcadores” do blogger e links externos…

Mas você poderá colocar qualquer link que desejar. É desejável você fazer um planejamento prévio da estrutura do seu site ou blog, para que o menu seja uma ferramenta eficiente na navegação…

Defina o “target”, se a página de destino abrirá na mesma janela [Same Window] ou em uma nova aba [New Window].

Para acrescentar sub menus, clique no botão [+] ao lado do link desejado. Acrescente os links do sub menu. Veja o exemplo abaixo, onde criaremos um sub menu para o “Dicas para Blogs”…

Agora clique em [Back to Main Menu] e crie outros submenus, caso desejar…

Clique em [Menu Preview] para visualizar o menu pronto.

Se tudo estiver correto, clique no botão [Step 3: Download] e depois em [Download Now].

Como instalar o menu

Descompacte o arquivo .zip

A – Instalar em um Website hospedado

1- Através do FTP, faça o upload da pasta [Menu] para a raiz de onde está hospedado o site. (Leia: O que significa FTP e para que serve?)

2- Abra o arquivo [Installation_instruction.html] e copie o código HTML e cole no local desejado do seu site.

Veja o exemplo abaixo, onde foi inserido um módulo do menu do exemplo, apenas para efeito de teste (Portal Visual Dicas). Para visualizar, clique aqui: Teste do Menu CSS MenuMaker

Obs.: Se você tem conhecimento em HTML e CSS, ajuste as dimensões do menu para se adequarem ao seu site. Para isto é necessário alterar o código HTML e o arquivo menu_style.css que está dentro da pasta Menu.

B – Instalar o menu no Blogger

Para instalar o menu criado pelo CSS MenuMaker no seu blogger, siga as instruções apresentadas no link Como Instalar Menus do CSS Menu Maker no Blogger. Neste artigo, a autora mostra com muita propriedade todos os passos necessários para você colocar o menu que foi criado pelo aplicativo CSS MenuMaker em seu blog…

Bom trabalho…