clique aqui para abrir um popup

domingo, 24 de fevereiro de 2013

Criar Menu para Blog


Se deseja criar um menu (vertical ou horizontal) para o seu blog tem agora ao seu dispor o programa gratuito CSS Tab Designer.
O programa possui vários modelos de menus prontos a usar. Na prática, basta selecionar o menu que pretende adicionar no seu blog e clicar no botão “Fill with Examples” (menu esquerdo).
Download programa: CSS Tab Designer
Como usar o CSS Tab Designer
Após instalar o programa execute o CSS Tab Designer. No separador “Tab Styles” você encontrará dezenas de menus prontos a usar. Selecione o menu que mais lhe agrada e clique no link “Fill with Examples”.
Você poderá editar o texto apresentado fazendo duplo clique sobre o texto que pretende alterar (no separador Itens).
Por fim, selecione “Generate HTML & Images” (no topo do programa) para criar o seu menu. Indique a pasta onde pretende guardar o seu Menu.
Criar Menu para Blog Vertical e Horizontal
Agora, abra o arquivo (.html) gerado pelo CSS Tab Design com o bloco de notas (botão direito do rato – abrir como – bloco de notas). Copie o código CSS inserido após a tag <style type="text/css"> até </style>.

Agora, aceda ao Painel de Controlo do seu Blog – Separador “Modelo” – Editar HTML e marque a opção “Expandir modelos do widget”.
Importante: Não se esqueça de criar um backup do seu template, antes de proceder a qualquer alteração.
Cole o código do CSS imediatamente a seguir a tag <style type="text/css"> e guarde as alterações.
Dica: Poderá alterar as cores do seu Menu alterando a propriedade “Color”. Se o seu menu for constituído por imagens, poderá alterar a sua cor com o editor de imagens gratuito Gimp (Download SafePC Tuga). Menu “Colors” – “Colorize”.
Para terminar….

Menu Vertical

Para inserir um Menu Vertical volte a abrir o arquivo (.html) gerado pelo CSS tabs e copie o código imediatamente a seguir à tag <body> até </body> (não incluído). Aceda ao menu Esquema (ou Layout) e clique em “Adicionar uma miniaplicação (ou Adicionar um Gadget), na zona lateral do blog.
musica no blogger
Por fim, cole o código gerado no Gadget e guarde as alterações. Por exemplo:
<div id="navigation">
                        <ul>
                                <!-- CSS Tabs -->
<li><a href="Home.html"><span>Inicio</span></a></li>
<li><a href="Products.html"><span>Produtos</span></a></li>
<li><a href="Services.html"><span>Serviços</span></a></li>
<li><a href="Support.html"><span>Contato</span></a></li>
<li id="current"><a href="News.html"><span>Novidades</span></a></li>
<li><a href="About.html"><span>Sobre</span></a></li>
                        </ul>
                </div>
Verifique o resultado final.

Menu Horizontal

Para inserir um Menu Horizontal volte a abrir o arquivo (.html) gerado pelo CSS Tab Designer e copie o código imediatamente a seguir à tag <body> até </body> (não incluído). Aceda ao menu Esquema (ou Layout) e clique em “Adicionar uma miniaplicação (ou Adicionar um Gadget), na zona superior do blog. Se necessário arraste a miniaplicação para a zona superior do template.
Dica: Você poderá criar um menu apontando para as categorias do seu blog, dessa forma, obterá um menu de navegação eficiente, que permite o visitante navegar por todas as páginas do seu Blog.
Para isso, crie o seu link da seguinte forma:
<a href="http://linkdoseublog.blogspot.com/nomedaetiqueta">Nome do seu menu</a>
Caso possua dúvidas deixe o seu comentário.

0 comentários:

Postar um comentário