Slide da Habbid V10

by: Unknown

Neste post irei ensinar como criar um slide tipo o da habbid v10. 

1 - Acesse o seu Painel do Blogger e selecione Layout, então clique em Editar HTML para entrar no modo de edição do código do seu Template. 

2 - Encontre o seguinte código (utilizando o Ctrl+F do seu navegador): 
<head>

Então cole o seguinte código ANTES: 

Click aqui para baixar o código 
3 - Agora vá em Elementos da página e abra uma nova Gadget HTML/JavaScript. 
Cole o seguinte código: 
Click aqui para baixar o código 
4 - Editando Slide. 
Trocando as imagens note que exitem UMA imagem mas sendo utilizado DUAS vezes; 
uma para a imagem grande e a outra para caixa pequena (com dimensão 300 X 185) 
Imagem 01 - http://i46.tinypic.com/dqnr5f.jpg 
Imagem 02 - http://i49.tinypic.com/o9oo5k.jpg 
Imagem 03 - http://i49.tinypic.com/24ljukm.jpg 
Imagem 04 - http://i45.tinypic.com/ayp078.jpg 
Agora substitua pela suas imagens; 
Trocando o link das imagens 
Link 01 
Link 02 
Link 03 
Link 04 
Agora substitua pelos links de seu site; 
Decrição 
Frase 01 
Frase 02 
Frase 03 
Frase 04 
Agora substitua pelas suas descrições:
FRASE 01
FRASE 02
FRASE 03
FRASE 04

ESPERAMOS TER AJUDADO !

Libélula Que fica voando pelo site/blog

by: Unknown

Está procurando um mascote pro seu blog? Que tal essa pequena libélula para fazer companhia aos seus leitores?

Com base no script do pássaro do Twitter resolvi dar uma modificada no lindo passarinho azul, e substitui por uma libélula bem bacana, que assim como o pássaro, ela fica nas páginas de postagem do blog e não deixa seus visitantes sozinhos.

Olhem Abaixo:

Então é isso ae... Para colocar no seu blog, vá em "Design" - "Ediar HTML" , marque a caixinha "Expandir modelos de widgets".

Agora procure pela linha <data:post.body/> (CTRL+F para procurar).

Logo acima dessa linha cole o código abaixo e depois salve!

<b:if cond='data:blog.pageType == "item"'><script src='http://oloblogger.googlecode.com/files/tripleflap.js' type='text/javascript'></script>

<script type='text/javascript'>

var birdSprite="http://img152.imageshack.us/img152/4514/libelulae.png";

var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");

var twitterAccount = "http://www.cblogger.net";

tripleflapInit();

</script>

</b:if>

Torre Fixa de botões de compartilhamento

by: Unknown

Ter uma barra de com redes sociais possibilitando o compartilhamento de um artigo é fundamental para divulgar seus posts, ainda mais quando são várias opções para compartilhamento, que é o caso dessa barra .

A torre conta com o sistema do AddThis com algumas modificações e possui 13 opções para compartilhamento fora os que aparecem quando clicamos no botão +. Então que tal colocar uma barra bem divertida em seu blog! A barra é na vertical em forma de uma torre que é fixa na tela para melhor acessibilidade dos usuários. Gostou? Então prossiga os passos abaixo.

1º- Acesse o painel principal do seu blog;

2º- Procure por:

<div id='content-wrapper'>

3º- Abaixo dessa linha cole seguinte código:

<div style="position: fixed;

text-align: center;

margin-left: -114px;

padding: 12px;

height: 100%;

width: 36px;

border-radius: 22px;

-moz-box-shadow: 5px 6px 12px #dcdcdc;

-webkit-box-shadow: 5px 6px 12px #dcdcdc;

box-shadow: 5px 6px 12px #dcdcdc;

">

<div class="addthis_toolbox addthis_default_style addthis_32x32_style">

<a class="addthis_button_preferred_1"></a>

<a class="addthis_button_preferred_2"></a>

<a class="addthis_button_preferred_3"></a>

<a class="addthis_button_preferred_4"></a>

<a class="addthis_button_preferred_5"></a>

<a class="addthis_button_preferred_6"></a>

<a class="addthis_button_preferred_7"></a>

<a class="addthis_button_preferred_8"></a>

<a class="addthis_button_preferred_9"></a>

<a class="addthis_button_preferred_10"></a>

<a class="addthis_button_preferred_11"></a>

<a class="addthis_button_preferred_12"></a>

<a class="addthis_button_preferred_13"></a>

<a class="addthis_button_compact"></a>

</div>

<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e69021503b178cd"></script>

</div>

4º- Agora salve e deixe seus visitantes desfrutar da nova funcionalidade que seu blog oferece! ;D

Colocando "POSTAGENS MAIS ANTIGAS" ETC...

by: Unknown

Esse é um tutorial bem simples pra mudar aquele botão que fica lá embaixo do blog, "Postagens mais antigas", "Postagens mais recentes" e "inicio".

Então vamos lá.

Vá em Layout/Design - Editar Html - e marque a caixinha: "Expandir modelos de widget" ;

Procure por <data:newerPageTitle/>

Substitua por:

<img alt='Página Anterior' border='0' src='http://icons2.iconarchive.com/icons/dryicons/simplistica/48/back-icon.png'/>

Agora Procure por: <data:olderPageTitle/>

Substitua por:

<img alt='Próxima Página' border='0' src='http://icons2.iconarchive.com/icons/dryicons/simplistica/48/next-icon.png'/>

Agora Procure por: <data:homeMsg/>

Substitua por:

<img alt='Home' border='0' src='http://icons2.iconarchive.com/icons/dryicons/simplistica/48/home-icon.png'/>

Salve e Pronto!

3 menus de redes sociais com efeito CSS3

by: Unknown

Neste pequeno artigo irei disponibilizar 3 menus com botões de redes sociais bem legais para seu blog. O menu possui alguns efeitos em CSS3, bem como o efeito de rotação e opacidade. Apresentam botões das principais redes sociais da internet mais conhecidas até então, como o Facebook, Twitter e a mais nova rede social. Veja:

Para instalar um desses no seu blog, apenas copie um dos códigos abaixo com seus respectivos códigos. Depois vá em “Layout” –> “Adicionar um gadget” –> “HTML/Javascript” e cole-os, em seguida faça as devidas alterações "URL PERFIL TWITTER" , "URL PERFIL FACEBOOK" , "URL PERFIL GOOGLE PLUS" , "URL CANAL YOUTUBE".

<style>

.minhasredes1 {
padding: 15px;
}

.minhasredes1 a {
-webkit-transition:All 1s ease;
-moz-transition:All 1s ease;
opacity: 0.5;
}

.minhasredes1 a:hover {
opacity: 1;
}

.minhasredes1 img {
-webkit-transition:All 0.2s ease;
-moz-transition:All 0.2s ease;
}
.minhasredes1 img:hover {
-webkit-transform: rotate(10deg) scale(1.2) skew(1deg) translate(0px);
}

</style>

<div class="minhasredes1">
<a href="URL PERFIL TWITTER" title="Siga-me no Twitter"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%201/twitter-icon.png"/></a>
<a href="URL PERFIL FACEBOOK" title="Me adicione no Facebook"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%201/facebook-icon.png"/></a>
<a href="URL PERFIL GOOGLE PLUS" title="Me circule no Google Plus"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%201/googleplus-icon.png"/></a>
<a href="URL CANAL YOUTUBE" title="Inscreva-se no nosso canal"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%201/youtube-icon.png"/></a>

<style>

.minhasredes2 {

padding: 15px;

}

.minhasredes2 a {

-webkit-transition:All 1s ease;

-moz-transition:All 1s ease;

opacity: 0.5;

}

.minhasredes2 a:hover {

opacity: 1;

}

.minhasredes2 img {

-webkit-transition:All 0.2s ease;

-moz-transition:All 0.2s ease;

}

.minhasredes2 img:hover {

-webkit-transform: rotate(10deg) scale(1.2) skew(1deg) translate(0px);

}

</style>

<div class="minhasredes2">

<a href="URL PERFIL TWITTER" title="Siga-me no Twitter"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%202/Twitter-icon.png"/></a>

<a href="URL PERFIL FACEBOOK" title="Me adicione no Facebook"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%202/Facebook-icon.png"/></a>

<a href="URL PERFIL GOOGLE PLUS" title="Me circule no Google Plus"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%202/Google-Plus-icon.png"/></a>

<a href="URL FEED" title="Assine nosso Feed"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%202/RSS-icon.png"/></a>

</div>

<style>

.minhasredes3 {
padding: 15px;
}

.minhasredes3 a {
-webkit-transition:All 1s ease;
-moz-transition:All 1s ease;
opacity: 0.5;
}

.minhasredes3 a:hover {
opacity: 1;
}

.minhasredes3 img {
-webkit-transition:All 0.2s ease;
-moz-transition:All 0.2s ease;
}

</style>

<div class="minhasredes3">
<a href="URL PERFIL TWITTER" title="Siga-me no Twitter"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%203/twitter-icon.png"/></a>
<a href="URL PERFIL FACEBOOK"title="Me adicione no Facebook"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%203/facebook-icon.png"/></a>
<a href="URL FEED"title="Assine nosso Feed"><img src="http://dl.dropbox.com/u/47734544/Icones/RS%203/rss-icon.png"/></a>
</div>

Caixinha Link-me

by: Unknown

Colocando Caixa de Pesquisas

by: Unknown

Esse é um tutorial bem simples pra mudar aquele botão que fica lá embaixo doblog, "Postagens mais antigas", "Postagens mais recentes" e "inicio".

Então vamos lá.

Vá em Layout/Design - Editar Html - e marque a caixinha: "Expandir modelos de widget" ;

Procure por <data:newerPageTitle/>

Substitua por:

<img alt='Página Anterior' border='0' src='http://icons2.iconarchive.com/icons/dryicons/simplistica/48/back-icon.png'/>

Agora Procure por: <data:olderPageTitle/>

Substitua por:

<img alt='Próxima Página' border='0' src='http://icons2.iconarchive.com/icons/dryicons/simplistica/48/next-icon.png'/>

Agora Procure por: <data:homeMsg/>

Substitua por:

<img alt='Home' border='0' src='http://icons2.iconarchive.com/icons/dryicons/simplistica/48/home-icon.png'/>

Salve e Pronto!

Assinar: Postagens (Atom)

Baixar arquivo 5 Baixar arquivo 6 Baixar arquivo 4 arquivo 4 do ET downloads arquivo 5 do ET downloads arquivo 6 do ET downloads arquivo 7 do ET downloads arquivo 8 arquivo

Downs Brasil Top Novos Baixar Templates Novos ET downloads

▲ Topo