Como Fazer um Menu Vertical Fixo no Blogger

Vamos mostrar como colocar um menu vertical fixo na lateral do seu blog, mas esse menu tem o estilo expansível, ou seja, quando passa o mouse sobre o menu o ícone expande e mostra o título do menu dando uma melhor aparência e atraindo atenção dos visitantes. Caso esteja procurando um menu com links lado a lado veja como fazer um menu horizontal.Fonte: DicasParaBlogsO código é muito simples de colocar no blog você só precisa entrar na pagina layout, adicionar gadget, escolher a opção HTML/javascript e colar o seguinte código:<style type="text/css">/* CSS Style for Horizontal Menu - info @ http://www.spiceupyourblog.com*/#hor {list-style:none;padding:0;margin:0;}#hor
Leia Mais! »
Johny Michael

sábado, 24 de março de 2012

COMO MUDAR PRIMEIRA LETRA DO TITULO DO POST

Eae galerinha, hoje vou ensinar como mudar de cor a primeira letra do post e da sidebar. 1º Vá no painel do seu blog > Design > Editar HTML2º Aperte CTRL+F e procure pela tag ]]></b:skin>3º ACIMA desta tag coloque o seguinte código: DOWNLOAD DO CODIGOOBS.: Se não funcionar, pode estar ocorrendo algum conflito entre CSS, entao para resolver isso coloque o codigo um pouco mais acima, MAS ATENÇÃO, cuidado para não interromper nenhuma outra CSS.
Leia Mais! »
Johny Michael

sábado, 24 de março de 2012

Adicionar Box Expansível do Facebook com Efeito Jquery em seu Blog

Hoje nós iremos aprender a como adicionar uma box expansível do Facebook no Blogger. Essa box possui o efeito Jquery isso faz que a box contenha um efeito mais elegante. Esse Box tem o seguinte funcionamento: ao adicionar esse widget, aparecerá o botão do Facebook flutuando no seu blog, mas quando você posicionar o mouse por cima desse botão, irá expandir e aparecerá a caixa de curtir do Facebook. Veja a Demostração:  http://demo2ub.blogspot.comVamos ao Tutorial:1º - Vá no Painel de Controle de seu Blog e clique na Guia Modelo.2º - Clique no Botão Editar HTML.3º - Agora pressione as
Leia Mais! »
Johny Michael

sábado, 24 de março de 2012

Menu Hover

Peguei um Menu Hover no Google todo Bugado , as Imagens Tudo ja tinham sido deletadas ,entao eu tirei os bugs e  criei novas imagens irei estar postando um tutorial para colocar no bloge o download as png e psd :DAntes de ]]></b:skin> :#menuimagem{width:100px;height:100px;display:block;position:absolute;margin:399px 0 0 150px;}#home {background:url(http://img16.imageshack.us/img16/6269/homeedz.png) no-repeat;width:173px;height:70px;float:left;}#home:hover {background:url(http://img822.imageshack.us/img822/6388/homehoverw.png) no-repeat;width:173px;height:70px;float:left;}#HOME{width:208px;height:57px;display:block;position:absolute;margin:-22px 0 0 20px;}#contato2 {background:url(http://img19.imageshack.us/img19/1042/contatohover.png) no-repeat;width:173px;height:70px;float:left;}#contato2:hover {background:url(http://img19.imageshack.us/img19/1042/contatohover.png) no-repeat;width:173px;height:70px;float:left;}#CONTATO2{width:208px;height:57px;display:block;position:absolute;margin:-22px 0 0 200px;}#parceiros {background:url(http://img402.imageshack.us/img402/2631/parceiross.png) no-repeat;width:173px;height:70px;float:left;}#parceiros:hover {background:url(http://img600.imageshack.us/img600/493/parceiroshover.png) no-repeat;width:173px;height:70px;float:left;}#PARCEIROS{width:208px;height:57px;display:block;position:absolute;margin:-22px 0 0 380px;}#pedidos {background:url(http://img694.imageshack.us/img694/3673/pedidosjm.png) no-repeat;width:173px;height:70px;float:left;}#pedidos:hover {background:url(http://img10.imageshack.us/img10/9739/pedidoshover.png) no-repeat;width:173px;height:70px;float:left;}#PEDIDOS{width:208px;height:57px;display:block;position:absolute;margin:-22px 0 0 560px;}#equipe {background:url(http://img205.imageshack.us/img205/2010/equipea.png) no-repeat;width:173px;height:70px;float:left;}#equipe:hover {background:url(http://img38.imageshack.us/img38/7741/equipehover.png) no-repeat;width:173px;height:70px;float:left;}#EQUIPE{width:208px;height:57px;display:block;position:absolute;margin:-22px 0 0 741px;}Depois de <body> no lugar que quiser onde o menu fique coloque isto :<div id='menuimagem'><div id='HOME'><a href='#' id='home'
Leia Mais! »
Johny Michael

sábado, 24 de março de 2012

Icone de Feed Flutuante no blog

Atendendo a pedidos, através de 'Sugestão de postagens', hoje vou ensinar como colocar um ícone de Feed com efeito flutuante, igual ao usado aqui no Gothic Darkness.A primeira coisa que você deve fazer é escolher um ícone (imagem) de Feed.Agora clique na aba "Layout" e entre na edição HTML do seu template, clique em "Expandir modelos de widgets" e procure pela tag ]]> e cole logo ABAIXO dela:VER CODIGOAjuste os valores em:top:10px; -> Distância da imagem para o topoleft:10px; -> Aqui você define a distância da imagem para esquerda.Se quiser que a imagem fique flutuando à direita, altere "left"
Leia Mais! »
Johny Michael

sábado, 24 de março de 2012

Como colocar xat no blog

Faça um backup do template antes.Vamos lá.Faça login no blogger.Clique em design/editar html.De um ctrl+f e procure por ]]></b:skin>Vc vai colar o código abaixo antes desse código#banner-xat{width:125px;height:125px;margin-top:220px;float:right;margin-right:23px;border:0;}.xat-xdesigner {background:url(http://i.imgur.com/kQPAv.png) no-repeat;width:650px;height:400px;clear:both;margin:0 0 30px 100px;padding:20px 0 0 0;}.xat-xdesigner embed{width:435px;height:341px;overflow:hidden;margin-top:10px;margin-left:-1px;margin-right:-4px;}.xat-xdesigner h2{width:0px !important;;height:0px !important;;overflow:hidden !important;;}Agora a segunda parte e mais enjoadao segundo código deve ser colado antes do código do rodapé do blog!!no meu blog o código é esse <div class='rodape'>cole o código abaixo acima do código do rodapé<center><div class='xat-xdesigner'><embed align='middle' allowscriptaccess='sameDomain' flashvars='id=154777308' height='290' name='chat' pluginspage='http://xat.com/update_flash.shtml' quality='high' src='http://www.xatech.com/web_gear/chat/chat.swf' type='application/x-shockwave-flash' width='375'/><div id='banner-xat'><a href='http://downspluss.blogspot.com' target='_blank'><img border='0' src='Codigo do Seu Banner 125x125'/></a></div></div></center>OBS: Aonde Estiver Isso Coloke o Codigo do Seu Xat Apartir do <Embed> Até </Embed><embed align='middle' allowscriptaccess='sameDomain' flashvars='id=154777308' height='290' name='chat' pluginspage='http://xat.com/update_flash.shtml' quality='high' src='http://www.xatech.com/web_gear/chat/chat.swf' type='application/x-shockwave-flash' width='375'/>
Leia Mais! »
Johny Michael

sábado, 24 de março de 2012

Fontes

                                                   Para Baixar Basta Clicar Na fonte Em Que Você Quer Credito Fonts500
Leia Mais! »
Johny Michael

sábado, 24 de março de 2012

Assinar: Postagens (Atom)