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: , ,

Votação encerrada! O que nossos leitores acharam da nova interface do blogger?

Imagem por cblogger.net

Votação eeeencerrada! Que votou, votou. Quem não votou não vota mais. Há um mês atrás lancei uma enquete aqui no cblogger com a seguinte pergunta: O que você achou da nova interface do blogger?. Eis  o resultado:

imageNo total foram 49 pessoas que votaram, sendo que 16 não gostaram que correspondendo 32% do total.

Mas porque as pessoas não gostaram da nova interface?

Não resta dúvidas de que a nova interface melhorou gradativamente em relação a que estava antes. A nova interface conta com um designer exclusivo e padronizada.

Pelo o que eu analisei, nossos leitores não gostaram da nova interface por o blogger não ter cumprido o que prometeu, Ainda. Muitos contavam com novos recursos. Mas alguns novos recursos já foram implantado este ano no blogger. Confira algumas:

NOVIDADE: COLOCAR FAVICON NO BLOGGER PELO PAINEL
NOVIDADE: NOVO BOTÃO RECOMENDAR (+1) DO GOOGLE
NOVAS ATUALIZAÇÕES NO BLOGGER - GEOLOCALIZAÇÃO E UPLOAD
NOVIDADE: EDITAR IMAGENS COM PICNIK DIRETAMENTE DO POST
NOVIDADES NO BLOGGER – VISUALIZAÇÕES DINÂMICAS
GADGET SEGUIR POR EMAIL NO BLOGGER

Não foram lá grandes mudanças, mas já é um bom sinal que novos recursos de pirar o blogueiro ainda estão por vim. O ano 2011 não terminou ainda, então resta esperar para que novos recursos sejam divulgados pela equipe.

Respeito a opiniões de todos que votaram. Mas quem votou achando que faltam novos recursos, aguardem, pois tenho fé que não ficará só nisso.

Obrigado a todos que votaram. Aproveite e deixe seu comentário! Abraços!

Marcadores: , , ,

Sistema de Busca Personalizado

Você que quer um sistema de busca para seu blog bonito, entrou no blog certo!
olha o sistema de busca que vou ensinar como colocar em seu blog nesse tutorial de hoje veja na imagem abaixo:




Bonito não? então para colocar em seu blog é muito simples e fácil .

1- Faça o login no blogger
2- Vai em design
3-Editar HTML

Agora procure por :
]]></b:skin>
em seguida cole esse código acima da tag procurada :
/* ----- Busca ----- */.txt_busca{
background-image:url(http://codigosblog.net/servidor/search.png);
background-position:2px 2px;
background-repeat:no-repeat;
padding-left:20px;
border:1px solid #999999;
padding-right:2px;
padding-bottom:2px;
padding-top:2px;
color:#006699;
background-color:#FFFFFF;
} 
Salve.

Em seguida vai em 'Elementos da pagina ' e vai em adicionar gadget (onde você quer adicionar o sistema de busca)

em seguida adicione o gadget  HTML/Javascript e cole o seguinte código :

<div align="center"><form action='/search' id='searchthis' method='get' style='display:inline;'><input class='txt_busca' id='search-box' name='q' type='text'/><input id='search-btn' type='submit' value='Buscar'/></form></div>
Pronto. =)

Créditos : http://www.codigosblog.com.br/2008/05/busca-no-blog-3.html

Marcadores: , ,