Tutorial - Fantasmas voando no blog

Essa imagem está em gif ,bom não sei quem fez  ela .

Para ver o tutorial clique em leia mais ...

Vamos  começar ?

1°  Vá até seu "blog" .

2° Vá em "Layout" .

3° Vá em  "Adicionar Um  gadget" .

4°  Adicionar "HTML /JavaScript" .

5° E adicione o código  abaixo :

<script language="JavaScript">if ((document.getElementById) &&window.addEventListener || window.attachEvent){(function(){//Configuracionvar numberOfGhosts = 10; /* Numero de fantasmas */var ghostSpeed = 0.9; /* Velocidade */var inTheFace = 5;var setTimeOutSpeed = 50; /* Velocidade a que os fantasmas aparecem*///Fin de la configuracionvar h,y,cy,cx,sy,sx,ref,field,oy1,oy2,ox1,ox2,iy1,iy2,ix1,ix2;var d = document;var domWw = (typeof window.innerWidth == "number");var domSy = (typeof window.pageYOffset == "number");var pi1 = 180/3.14;var pi2 = 3.14/180;var y = [];var x = [];var strs = [];var gro = [];var dim = [];var dfc = [];var vel = [];var dir = [];var acc = [];var dtor = [];var xy2 = [];var idx = document.getElementsByTagName('div').length;var zip = [];var pix = "px";for (i = 0; i < numberOfGhosts; i++){document.write('<div id="ghosts'+(idx+i)+'"'+' style="position:absolute;top:0px;left:0px;'+'width:40px;height:40px;background-color:transparent;'+'font-size:0px;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjv5Ej4ByJwKO7qgLtFROt2ouAZBWyBQdb8A98Uaoy-TJf85iK7K8D2Pqs19F3cSYgrgEnxaJUXjXsc35Dt0kwHqQ0MirLimMLfRSGYSOXbLi26WftkTCXuxqiAI60sme_Hj0WW9KVzd7a/s1600/ghost.gif" class="ghost" width="70"/></div>');}if (domWw) ref = window;else{if (d.documentElement &&typeof d.documentElement.clientWidth == "number" &&d.documentElement.clientWidth != 0)ref = d.documentElement;else{if (d.body &&typeof d.body.clientWidth == "number")ref = d.body;}}function win(){var mozBar = ((domWw) &&ref.innerWidth != d.documentElement.offsetWidth)?20:0;h = (domWw)?ref.innerHeight:ref.clientHeight;w = (domWw)?ref.innerWidth - mozBar:ref.clientWidth;cy = Math.floor(h/2);cx = Math.floor(w/2);oy1 = (75 * h / 100);oy2 = (oy1 / 2);ox1 = (75 * w / 100);ox2 = (ox1 / 2);iy1 = (18 * h / 100);iy2 = (iy1 / 2);ix1 = (18 * w / 100);ix2 = (ix1 / 2);field = (h > w)?h:w;}function rst(s){var cyx;sy = (domSy)?ref.pageYOffset:ref.scrollTop;sx = (domSy)?ref.pageXOffset:ref.scrollLeft;acc[s] = 0;dim[s] = 1;xy2[s] = 0;cyx = Math.round(Math.random() * 2);if (cyx == 0){y[s] = (cy - iy2) + Math.floor(Math.random() * iy1);x[s] = (cx - ix2) + Math.floor(Math.random() * ix1);}else{y[s] = (cy - oy2) + Math.floor(Math.random() * oy1);x[s] = (cx - ox2) + Math.floor(Math.random() * ox1);}dy = y[s] - cy;dx = x[s] - cx;dir[s] = Math.atan2(dy,dx) * pi1;dfc[s] = Math.sqrt(dy*dy + dx*dx) ;zip[s] = 10 * (dfc[s] + inTheFace) / 100;vel[s] = ghostSpeed * dfc[s] / 100;dtor[s] = (field - dfc[s]);if (dtor[s] < 1) dtor[s] = 1;gro[s] = 0.003 * dtor[s] / 100;}function animate(){for (i = 0; i < numberOfGhosts; i++){y[i] += vel[i] * Math.sin(dir[i] * pi2);x[i] += vel[i] * Math.cos(dir[i] * pi2);acc[i] = (vel[i] / (dfc[i] + (vel[i] * zip[i])) * vel[i]);vel[i] += (acc[i]);dim[i] += gro[i] + acc[i] / zip[i];xy2[i] = dim[i] / 2;if (y[i] < 0 + xy2[i] ||x[i] < 0 + xy2[i] ||y[i] > h - xy2[i] ||x[i] > w - xy2[i]){rst(i);}strs[i].top = (y[i] - xy2[i]) + sy + pix;strs[i].left = (x[i] - xy2[i]) + sx + pix;strs[i].width = (strs[i].height = (Math.round(dim[i])) + pix);}setTimeout(animate,setTimeOutSpeed);}function init(){win();for (i = 0; i < numberOfGhosts; i++){strs[i] = document.getElementById("ghosts"+(idx+i)).style;rst(i);}animate();}if (window.addEventListener){window.addEventListener("resize",win,false);window.addEventListener("load",init,false);}else if (window.attachEvent){window.attachEvent("onresize",win);window.attachEvent("onload",init);}})();}//End.</script>
Configurando :
Mudando o numero de fantasmas  :
Procure por : 
numberOfGhosts =10; /* Numero de fantasmas */
E troque  a parte que eu destaquei .
Mudando  a velocidade dos fantasmas :
Procure por :
var ghostSpeed = 0.9; /* Velocidade */
E troque  a parte que eu destaquei .
 Mudando a velocidade que ps fantasmas aparecem :
Procure por :
var setTimeOutSpeed = 50; /* Velocidade a que os fantasmas aparecem*/
E troque  a parte que eu destaquei .

Tutorial - Como botar botão leia mais

Clique em ver postagem para ler o tutorial ....

Tutorial :

1 - Abra seu Blog vá em Design -> Editar Html e marque a caixinha  Expandir modelos de widgets.

2 - Aperte CTRL+F em seu teclado e procure pela tag  <data:post.body/> e cole o seguinte código abaixo da tag <data:post.body/>:

Código:

<b:if cond='data:post.hasJumpLink'>

<div class='jump-link'>

<a expr:href='data:post.url + "#more"'><img src='url da sua imagem' style='width: 443px; height: 60px;'/></a>

</div>

</b:if > 

3- Edite as partes em azul .

Conselho :

Aconselho criar um leia mais  tamanho  300 x 100


Leia mais para vocês :

Minha logo :

Tutorial - Widget de guia

Tutorial :

1° Entre nesse site . (clique aqui).

2° Clique  no menu Widgets.

3° Clique em  " O Widget de  cor".

4° Defina a  o lado , esquerdo ,direito  ou fundo .

Abaixo um exemplo

(você devera  trocar no site) 

Esquerda

 

tabpos:left-upper

 Topo  

tabpos:left-middle

 Centro  

tabpos:left-lower

 Fundo

Fundo

 

tabpos:bottom-left

 Esquerda  

tabpos:bottom-center

 Centro  

tabpos:bottom-right

 Direito

Direito

 

tabpos:right-upper

 Topo  

tabpos:right-middle

 Centro  

tabpos:right-lower

 Fundo

5° Copie o código .

Botando em seu blog :

1° Vá até  o blogger 

2° Vá em layout  > Adicionar  Gadget > HTML/JavaScript .

3° Cole o código e salve .

Ex : 

Tutorial - Widget de cor user on

Tutorial :

1° Entre nesse site . (clique aqui).

2° Clique  no menu Widgets.

3° Clique em  " O Widget de  cor".

4° Defina a cor  de traz , e a cor da fonte . 

Abaixo um exemplo

(você devera  trocar no site) 

   

  

5° Copie o código .

Botando em seu blog :

1° Vá até  o blogger 

2° Vá em layout  > Adicionar  Gadget > HTML/JavaScript .

3° Cole o código e salve .

Ex : 

Tutorial -Widgets clássico users

Tutorial :

1° Entre nesse site . (clique aqui).

2° Clique  no menu Widgets.

3°Clique em  " O Widget de  clássico".

4° Copie o código .

Botando em seu blog :

1° Vá até  o blogger 

2° Vá em layout  > Adicionar  Gadget > HTML/JavaScript .

3° Cole o código e salve .

Ex : 

Tutorial - Barra de rolagem colorida

Olá Galera do Web Design Downloads hoje eu ''Nayan Baizek''

estarei ensinando a coloca barra de rolagem colorida no seu blog.

1. Vá em design > Editar HTML > Ctrl + F e procure por :

]]></b:skin>2. Antes de ]]></b:skin>  , coloque :

*{ scrollbar-face-color:#FF69B4; scrollbar-highlight-color:#FF69B4; scrollbar-3dlight-color:#343434; scrollbar-darkshadow-color:#343434; scrollbar-shadow-color:#FF69B4; scrollbar-arrow-color:#343434; scrollbar-track-color:#343434; } ::-webkit-scrollbar {width: 12px; height: 4px; background: #343434; } ::-webkit-scrollbar-thumb { background: #00EE00; }3. na parte que se encontra #00EE00 é a cor da barra.
E onde se encontra #343434 é a cor do fundo da rolagem .Veja nossa Tabela de cores : Clicando Aquir !

Tutorial -Zoom nas imagens

Olá Galera hoje eu ''Nayan Baizek'' estarei ensinando

a colocar efeito zoom na imagens do seu blog .

/span>sss

1. Vá em Modelo > Edita HTML > Ctrl + F 

e coloque o codigo abaixo .

]]></b:skin>

2. Em cima desse tag acima coloca esse codigo abaixo .

/*--Zoom-Imagens-- */ a:hover img { transform: translate(0px, -4px); -moz-transform: scale(1.1) translate(0px, -4px); -webkit-transform: scale(1.1) translate(0px, -4px); -ms-zoom: 1.1; opacity: 1 !important; -moz-opacity: 1 !important; -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; transition: all 0.2s ease; }

3. Clique no botão visualizar depois de ter feito isso

pra ver se não deu nenhum erro .

4. Se não deu nenhum erro clique ''Salvar Modelo''

e seu efeito zoom já estara em seu blog .

Tutorial - Domínio personalizado no blog

Postado por : Nayan

1° Passo Logar em sua conta depois vá em "configurações"

2° procure a palavra "Publicação"  e clique em: 

+ Adicionar um domínio personalizado 

OBS :  o meu print está com 2 pois eu já configurei .

3° Passo onde está marcado por essa seta coloque seu domínio personalizado , pronto agora não mude mais nada e salve ! 

OBS :  Esse método é para a interface novo do blogger

Tutorial - Emoticons nos comentários

---------*Começo do tutorial*----------

Entre no painel de seu blog clique em design, editar html, clique para expandir modelos de widgets e procure por:

Código :

data:blogCommentMessage

Visualize isso :

Código :



<h4 id='comment-post-message'><data:postCommentMsg/></h4>

Cole o seguinte código abaixo:

Código :


div style=' width: 370px; text-align: left; border: 2px solid #0084ce; background: #FEF9EA; padding: 10px; color:#0084ce; font-weight:bold; '>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjQNIu7Hogf0UWw0vsATg__idAbz6k3z6MMOInh4600urU0zTyjK8nBgzP5_BssGxIy7TeRRXBikfxYtrOTLRwchFJXiAjazxGddGNSn2CJ7EknitoJAeY4WTj1TwggsFCL8el_D43_Os/s800/emoticon-0100-smile.gif'/> :a
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggwKDdYqK4UHSToZM0pKNCJfcuTVqp4nFlHSsJI6FS3-1JKLe9UD6QaBZSSvsbNf4arXcTjm7U7P0vnFbP5aGbCDdhSKQkIRgdQSjbzAMN41sxPj8wFbo_4HDE-g2q-I9t3ASMNyEx9fI/s800/emoticon-0101-sadsmile.gif'/> :b
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvOU2RQc3-NGqg96XmpLzT-wh-CInTIzg4wdtbMia4iloaBtZ_ZAFP_v9VVnqMh8oBS2giRFJXhnxRf_Jk7HMs_eyKwgn6abLTbY-MnR35Zn8E1xUWgAvpDw1RDQ363ZTH2mJlKj_KwjI/s800/emoticon-0102-bigsmile.gif'/> :c
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5chkNFbPU1eN9V9PRMUYGYZ_CgwnkOY-2gd_KVcA_gIgyUUkA-L5eLK61OwR3x4JZ28prX2jmQN0A6_1sPsFLFyZQO3gAJaQpd8sk6Ia6YHBsOK30DrAstdQutGFaLewjNhgllheMvXQ/s800/emoticon-0105-wink.gif'/> :d
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVZWZauO9q3hTiSEmIXO6qqCs2z2wd5pgizgdJBYRos2hY9-azACtDt7gV8Z5GsmAZKwsorghwE94NRI_OmsQNW5akS34tYmOREzkZJDhPijN4QqNfXoFJThSckUHGq1K-Ncrb0EKpvFw/s800/emoticon-0104-surprised.gif'/> :e
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkDdSZubiDivGAxLcAvtseCIqv4FknMOZiTThmDUmGteIs6M5tgATC1LGq_sjBKmCcWGuR628yxhHkXY7pUDso8QEEKCmTV5C_D9KxKQMHm-9ReRtYKSOypZXLEN9GnnRjtDuXZ_jbDUw/s800/emoticon-0106-crying.gif'/> :f
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaK788YB5iIboNOwBQ38LFIYXXiw1qXxegSUhySvVizF296X_WINe7QvUR_67LzlAbFW9UXXk_waS_F8ooOtod-S7b6JVMBXAtZEZxx8bWD9EtJmF_h_P2BJLC3WX-0akIf2p9TKof-dQ/s800/emoticon-0109-kiss.gif'/> :g
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjl0I_n2XQIEM53ptHgzi4nEv27NN0qwkNvFct99pJ1oEenm1zdyr6dMA9JubFizbltj0uBneQHmn413htJMZWvkCR2RiM67EFjr3YHy32JGO8vR55CBgFcXu2TRpZrhFo9CSxv9JlBM1M/s800/emoticon-0111-blush.gif'/> :h
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAPjUQBU_89V1lMZoponW6rRX-vpr29RhdvDW4nc0VF7Gqnnm-oIY2McID-EOUx7lw2S4P4gkgQt2mRRTVOO6m3RJzz6MRyZ-WUsRn0VIHQV0_ylxHf_Wsrr7ni9Ch0nYl6rzLe0wCkBA/s800/emoticon-0110-tongueout.gif'/> :i
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1JiqZH95r3kdLF5wGS_GVsHgcWoJ0-sc1ZoXPF2AlLFWD8Tj6E5HbanZGJERML1VdxAW21DfXY0vhRJcL63Z1VmXX4hLHbXHo5Aw8bjw2M_NvdyL0SVsqpEC_M-a6NrDL56xfqwotOF0/s800/emoticon-0126-nerd.gif'/> :j
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5OcD12LPQydrh_1T1u-gWpP-uYkMLSzgtk35xma-j8F_2Zool2I-4Kt1JzNSUZcb2heAWXnIuMOQN67dSJGcZwn26JJWtRaNUoedVxz0XJm5xUx0HxPDHgTjYIvVJJeO9wbJCSW4Jrk/s800/emoticon-0103-cool.gif'/> :k
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCIYx-w8KzhvKw_lw0nCYxFsUKEfJw7gQz7CTuLN0R-u3uCoQEido3QyLBnK01ElICzb0-_NgjNvW2ymygMyw6xbeUtnMuUradyk6ZCC827c5tF6yBOx8gzFiWLO_7imHidLfeL23oPJg/s800/emoticon-0130-devil.gif'/> :l
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhg-0MZOUeG7zMEVtOX2euxyWKc6X7zxtCAnH-q_CIL8tyL1zuulHkyKVNyHnmfqNDEa0GLPYGQqZ9h_AcZNoVSPuwXuKaIeBaLtnEeiHVG8vVEcNaUTcDOftfAiMykMRe5c_-cfrp2buc/s800/emoticon-0133-wait.gif'/> :m
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiZoW7nH2Hld-NiIw5GWDKKHcfsbecK-gdvG2qiCIScS2Zgxd556897aC8l4QSlESJBcO_tl_eIKoAw76DvNt2GyWT9GIvrm84pAvXiorcI3GOnHu7-bA_AGqeNehEidzIlnogp3X9deQ/s800/emoticon-0137-clapping.gif'/> :n
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZz5BCCq-zvapCIoInrPggEdOTWz4SVu_2fue7pK27Yfi75dMkw3PFncpUScvzc4J3Wnzf8zMf3Jv1OGRGd7g2Md7GBwxrlJp_VCD2pFLNrKacL9h-gLyNXe8-CBCVu6xXOIS_ObuqAJk/s800/emoticon-0136-giggle.gif'/> :o
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh75FvFfXSj-lxlFbvI6vJiqtLPHaRaQjtIJ2mKS4jX19e17HHrw2Am2Lf4uUTEvevKaFtcvDG50TXvHGejh6UkyUQeG-IN6iyXtUcvkNe7Obmbk6fUCVwq99yEPecZYs0a1xxZE6W0LSA/s800/emoticon-0141-whew.gif'/> :p
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMT9OLo15BE-GCF5nft1J2Js4PLd2VgIxFf117jaZ89i2xWv3pARA3funoMW7X81T3XJ2oXeqVxxalHElXh-K6SFUBYOyHaK55z6XrFcH3MTvTJRkc322KPS_FMeomVykj8v-zvgnTVns/s800/emoticon-0148-yes.gif'/> :q
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDlQm7ki7r2sTGOSp5yv9aWJ91mPx_QlplQ37YIjLC9IYXkQHZAQ9zz50Vf3kVE6qeu2n2R-8uiqsM8yDT18zSnGp8e37_pcZ3HFHg0O7y9orTR4r-RN8c-AYfrMmEDHkY1UavauPsWVg/s800/emoticon-0149-no.gif'/> :r
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvIW6hc7lOFg_LQptQ4GStvbh3rbNb8V4oEVnvfZFX1uNqoR_wuRKq1nrVyfTtAJBa9VbRSQoEkELyuegTCe8zwAQH_DXneJoLfMuS5TanqlPu7jUqMr7S40NDmxtQIj3rIEpHyjnBvHY/s800/emoticon-0178-rock.gif'/> :s
&#160;
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwyuzHSpr9yd4y_mJM4ZmU90h5saKyHc9wSwmijKja-Pnq5NwykHwzRDZ-AMMeCsKdp2CYm_94z2i629sh544dGTPJDyS871MzlNQxPiC29SHSwbV_4FNQKL5zeWHzAPRIjCuOJBvAgiA/s800/emoticon-0155-flower.gif'/> :t
</div>

Clique para salvar.

agora  procure por: </body> e coloque o seguinte código antes dele </body> :

Código :



<script type='text/javascript'>
//<![CDATA[
a = document.getElementById('comments');
if(a) {
b = a.getElementsByTagName("DD");
for(i=0; i < b.length; i++) {
if (b.item(i).getAttribute('CLASS') == 'Author-comment-body' , 'comment-body') {
_str = b.item(i).innerHTML.replace(/:j/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1JiqZH95r3kdLF5wGS_GVsHgcWoJ0-sc1ZoXPF2AlLFWD8Tj6E5HbanZGJERML1VdxAW21DfXY0vhRJcL63Z1VmXX4hLHbXHo5Aw8bjw2M_NvdyL0SVsqpEC_M-a6NrDL56xfqwotOF0/s800/emoticon-0126-nerd.gif' alt='' class='smiley'/>");
_str = _str.replace(/:k/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5OcD12LPQydrh_1T1u-gWpP-uYkMLSzgtk35xma-j8F_2Zool2I-4Kt1JzNSUZcb2heAWXnIuMOQN67dSJGcZwn26JJWtRaNUoedVxz0XJm5xUx0HxPDHgTjYIvVJJeO9wbJCSW4Jrk/s800/emoticon-0103-cool.gif' alt='' class='smiley'/>");
_str = _str.replace(/:l/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCIYx-w8KzhvKw_lw0nCYxFsUKEfJw7gQz7CTuLN0R-u3uCoQEido3QyLBnK01ElICzb0-_NgjNvW2ymygMyw6xbeUtnMuUradyk6ZCC827c5tF6yBOx8gzFiWLO_7imHidLfeL23oPJg/s800/emoticon-0130-devil.gif' alt='' class='smiley'/>");
_str = _str.replace(/:m/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhg-0MZOUeG7zMEVtOX2euxyWKc6X7zxtCAnH-q_CIL8tyL1zuulHkyKVNyHnmfqNDEa0GLPYGQqZ9h_AcZNoVSPuwXuKaIeBaLtnEeiHVG8vVEcNaUTcDOftfAiMykMRe5c_-cfrp2buc/s800/emoticon-0133-wait.gif' alt='' class='smiley'/>");
_str = _str.replace(/:n/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiZoW7nH2Hld-NiIw5GWDKKHcfsbecK-gdvG2qiCIScS2Zgxd556897aC8l4QSlESJBcO_tl_eIKoAw76DvNt2GyWT9GIvrm84pAvXiorcI3GOnHu7-bA_AGqeNehEidzIlnogp3X9deQ/s800/emoticon-0137-clapping.gif' alt='' class='smiley'/>");
_str = _str.replace(/:o/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZz5BCCq-zvapCIoInrPggEdOTWz4SVu_2fue7pK27Yfi75dMkw3PFncpUScvzc4J3Wnzf8zMf3Jv1OGRGd7g2Md7GBwxrlJp_VCD2pFLNrKacL9h-gLyNXe8-CBCVu6xXOIS_ObuqAJk/s800/emoticon-0136-giggle.gif' alt='' class='smiley'/>");
_str = _str.replace(/:p/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh75FvFfXSj-lxlFbvI6vJiqtLPHaRaQjtIJ2mKS4jX19e17HHrw2Am2Lf4uUTEvevKaFtcvDG50TXvHGejh6UkyUQeG-IN6iyXtUcvkNe7Obmbk6fUCVwq99yEPecZYs0a1xxZE6W0LSA/s800/emoticon-0141-whew.gif' alt='' class='smiley'/>");
_str = _str.replace(/:q/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMT9OLo15BE-GCF5nft1J2Js4PLd2VgIxFf117jaZ89i2xWv3pARA3funoMW7X81T3XJ2oXeqVxxalHElXh-K6SFUBYOyHaK55z6XrFcH3MTvTJRkc322KPS_FMeomVykj8v-zvgnTVns/s800/emoticon-0148-yes.gif' alt='' class='smiley'/>");
_str = _str.replace(/:r/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDlQm7ki7r2sTGOSp5yv9aWJ91mPx_QlplQ37YIjLC9IYXkQHZAQ9zz50Vf3kVE6qeu2n2R-8uiqsM8yDT18zSnGp8e37_pcZ3HFHg0O7y9orTR4r-RN8c-AYfrMmEDHkY1UavauPsWVg/s800/emoticon-0149-no.gif' alt='' class='smiley'/>");
_str = _str.replace(/:t/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwyuzHSpr9yd4y_mJM4ZmU90h5saKyHc9wSwmijKja-Pnq5NwykHwzRDZ-AMMeCsKdp2CYm_94z2i629sh544dGTPJDyS871MzlNQxPiC29SHSwbV_4FNQKL5zeWHzAPRIjCuOJBvAgiA/s800/emoticon-0155-flower.gif' alt='' class='smiley'/>");
_str = _str.replace(/:s/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvIW6hc7lOFg_LQptQ4GStvbh3rbNb8V4oEVnvfZFX1uNqoR_wuRKq1nrVyfTtAJBa9VbRSQoEkELyuegTCe8zwAQH_DXneJoLfMuS5TanqlPu7jUqMr7S40NDmxtQIj3rIEpHyjnBvHY/s800/emoticon-0178-rock.gif' alt='' class='smiley'/>");
_str = _str.replace(/:a/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjQNIu7Hogf0UWw0vsATg__idAbz6k3z6MMOInh4600urU0zTyjK8nBgzP5_BssGxIy7TeRRXBikfxYtrOTLRwchFJXiAjazxGddGNSn2CJ7EknitoJAeY4WTj1TwggsFCL8el_D43_Os/s800/emoticon-0100-smile.gif' alt='' class='smiley'/>");
_str = _str.replace(/:b/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggwKDdYqK4UHSToZM0pKNCJfcuTVqp4nFlHSsJI6FS3-1JKLe9UD6QaBZSSvsbNf4arXcTjm7U7P0vnFbP5aGbCDdhSKQkIRgdQSjbzAMN41sxPj8wFbo_4HDE-g2q-I9t3ASMNyEx9fI/s800/emoticon-0101-sadsmile.gif' alt='' class='smiley'/>");
_str = _str.replace(/:c/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvOU2RQc3-NGqg96XmpLzT-wh-CInTIzg4wdtbMia4iloaBtZ_ZAFP_v9VVnqMh8oBS2giRFJXhnxRf_Jk7HMs_eyKwgn6abLTbY-MnR35Zn8E1xUWgAvpDw1RDQ363ZTH2mJlKj_KwjI/s800/emoticon-0102-bigsmile.gif' alt='' class='smiley'/>");
_str = _str.replace(/:d/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5chkNFbPU1eN9V9PRMUYGYZ_CgwnkOY-2gd_KVcA_gIgyUUkA-L5eLK61OwR3x4JZ28prX2jmQN0A6_1sPsFLFyZQO3gAJaQpd8sk6Ia6YHBsOK30DrAstdQutGFaLewjNhgllheMvXQ/s800/emoticon-0105-wink.gif' alt='' class='smiley'/>");
_str = _str.replace(/:e/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVZWZauO9q3hTiSEmIXO6qqCs2z2wd5pgizgdJBYRos2hY9-azACtDt7gV8Z5GsmAZKwsorghwE94NRI_OmsQNW5akS34tYmOREzkZJDhPijN4QqNfXoFJThSckUHGq1K-Ncrb0EKpvFw/s800/emoticon-0104-surprised.gif' alt='' class='smiley'/>");
_str = _str.replace(/:f/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkDdSZubiDivGAxLcAvtseCIqv4FknMOZiTThmDUmGteIs6M5tgATC1LGq_sjBKmCcWGuR628yxhHkXY7pUDso8QEEKCmTV5C_D9KxKQMHm-9ReRtYKSOypZXLEN9GnnRjtDuXZ_jbDUw/s800/emoticon-0106-crying.gif' alt='' class='smiley'/>");
_str = _str.replace(/:g/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaK788YB5iIboNOwBQ38LFIYXXiw1qXxegSUhySvVizF296X_WINe7QvUR_67LzlAbFW9UXXk_waS_F8ooOtod-S7b6JVMBXAtZEZxx8bWD9EtJmF_h_P2BJLC3WX-0akIf2p9TKof-dQ/s800/emoticon-0109-kiss.gif' alt='' class='smiley'/>");
_str = _str.replace(/:h/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjl0I_n2XQIEM53ptHgzi4nEv27NN0qwkNvFct99pJ1oEenm1zdyr6dMA9JubFizbltj0uBneQHmn413htJMZWvkCR2RiM67EFjr3YHy32JGO8vR55CBgFcXu2TRpZrhFo9CSxv9JlBM1M/s800/emoticon-0111-blush.gif' alt='' class='smiley'/>");
_str = _str.replace(/:i/ig,"<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAPjUQBU_89V1lMZoponW6rRX-vpr29RhdvDW4nc0VF7Gqnnm-oIY2McID-EOUx7lw2S4P4gkgQt2mRRTVOO6m3RJzz6MRyZ-WUsRn0VIHQV0_ylxHf_Wsrr7ni9Ch0nYl6rzLe0wCkBA/s800/emoticon-0110-tongueout.gif' alt='' class='smiley'/>")
b.item(i).innerHTML = _str;
}
}
}
//]]>
</script>

------------*fim do tutorial*----------

observação :



Clique novamente para salvar e depois é só fazer os testes, lembre-se que os comentários do blogger podem demorar uns minutos para aparecer, normalmente não demora, então se não aparecer na hora é normal, mas isso não quer dizer que deu errado, nos testes que fizemos demorou uns 2 minutos para ser visível o comentário com emoticons no blogger.
E o melhor de tudo sobre esses emoticons para colocar no blog é que você pode criar os seus emoticons facilmente, repare que os trechos que se repetem varias vezes:
_str = _str.replace(/:k/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5OcD12LPQydrh_1T1u-gWpP-uYkMLSzgtk35xma-j8F_2Zool2I-4Kt1JzNSUZcb2heAWXnIuMOQN67dSJGcZwn26JJWtRaNUoedVxz0XJm5xUx0HxPDHgTjYIvVJJeO9wbJCSW4Jrk/s800/emoticon-0103-cool.gif' alt='' class='smiley'/>");
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5OcD12LPQydrh_1T1u-gWpP-uYkMLSzgtk35xma-j8F_2Zool2I-4Kt1JzNSUZcb2heAWXnIuMOQN67dSJGcZwn26JJWtRaNUoedVxz0XJm5xUx0HxPDHgTjYIvVJJeO9wbJCSW4Jrk/s800/emoticon-0103-cool.gif'/> :k
&#160;
Cada um numa parte do código é repetido apenas trocando o endereço da imagem e o código para o emotion , portanto se trocar o endereço da imagem: https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5OcD12LPQydrh_1T1u-gWpP-uYkMLSzgtk35xma-j8F_2Zool2I-4Kt1JzNSUZcb2heAWXnIuMOQN67dSJGcZwn26JJWtRaNUoedVxz0XJm5xUx0HxPDHgTjYIvVJJeO9wbJCSW4Jrk/s800/emoticon-0103-cool.gif'


Fonte : Isabel Tutoriais .

Tutorial - Sistema de avaliação com "mão"

Vá em editar Html no seu template clique em expandir modelos wigets e procure por:

Código :




<data:post.body/>

Logo apos ele cole o seguinte codigo:

Código :

<div style="float:left; margin-right:3px;"></div>
<div class="js-kit-rating"
expr:path="data:post.url"
expr:permalink="data:post.url"
expr:title="data:post.title" view="score">
</div>

Agora Antes da Tag:  

Código :


</body>

coloque esse codigo: 

Código :


<script src="http://dl.dropbox.com/u/25793603/ratings.js">
</script>

Tutorial - Botão leia mais com imagem

Esse tutorial me ajudou muito   pra botar aqui no  blog . 

Créditos : Create pro . 

Entre no painel do Blogger, clique em design e, depois, em editar HTML.

Marque a caixa expandir modelos de widgets e procure por:

    <data:post.body/>

Substitua a linha <data:post.body/> por:

    <b:if cond='data:blog.pageType != "item"'>

    <b:if cond='data:blog.pageType != &quot;static_page&quot;'>

    <div expr:id='"summary" + data:post.id' style='display:none;'><data:post.body/></div>

    <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>

    <div style="clear:both" align='right' class='rmlink'><a expr:href='data:post.url'>Leia mais »»</a></div>

    </b:if></b:if>

    <b:if cond='data:blog.pageType == &quot;item&quot;'>

    <data:post.body/></b:if>

    <b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/>

    </b:if>

Agora vá no CSS do template e antes da tag ]]></b:skin> cole este código:

    .rmlink {

    font-size: 100%;

    float: right;

    margin-right: 30px;

    margin-top: 10px;

    font-weight: bold;}

    .rmlink a {

    font-style: normal;

    font-weight: bold;

    font-variant: small-caps;

    font-family: Arial,Sans-Serif;

    color: #24618e; /*Cor do Link*/}

    .rmlink a:visited { color: #649dc7;}/*Cor do link depois de clicado*/

    .rmlink a:hover { color: red;} /*Cor do link ao passar o mouse em cima*/

Procure então pela tag </head> e cole este outro código embaixo dela:

<!-- JavaScript Posts Resumidos-->

<!--

/*****************************************************

Auto-readmore link script, version 4.0 (for blogspot)

(C)2009 by Anhvo

Homepage:  http://vietwebguide.com

Please dont remove this copyright or change it into your own

******************************************************/

-->

<style type="text/css">

.thumbnailimg IMG {

max-width:150px;

  width: expression(this.width > 150 ? 150: true);

  max-height:120px;

  height: expression(this.height > 120 ? 120: true);

}

.thumbnailimg {

float:left;

padding:0px 10px 5px 0px;

}

</style>

<script type='text/javascript'>

var thumbnail_mode = "no-float" ;

var classicMode = false ;

var summary_noimg = 50;

var summary_img = 40;

var indent = 3;

</script>

<script  type='text/javascript'>

//<![CDATA[

function stripHtmlTags(s,max){return s.replace(/<.*?>/ig, '').split(/\s+/).slice(0,max-1).join(' ')}

function getSummaryLikeWP(id) {

       return document.getElementById(id).innerHTML.split(/<!--\s*more\s*-->/)[0];

}

function getSummaryImproved(post,max){

  var re = /<.*?>/gi

  var re2 = /<br.*?>/gi

  var re3 = /(<\/{1}p>)|(<\/{1}div>)/gi

  var re4 = /(<style.*?\/{1}style>)|(<script.*?\/{1}script>)|(<table.*?\/{1}table>)|(<form.*?\/{1}form>)|(<code.*?\/{1}code>)|(<pre.*?\/{1}pre>)/gi

  post = post.replace(re4,'')

  post = post.replace(re3,'<br /> ').split(re2)

  for(var i=0; i<post.length; i++){

   post[i] = post[i].replace(re,'');

  }

var post2 = new Array();

for(var i in post) {

 //if(post[i]!='' && post[i]!=' ' && post[i] != '\n') post2.push(post[i]);

 if(/[a-zA-Z0-9]/.test(post[i])) post2.push(post[i]) ;

}

var s = "";

var indentBlank = "";

for(var i=0;i<indent;i++){

 indentBlank += " ";

}

if(post2.join('<br/>').split(' ').length < max-1 ){

  s = post2.join(indentBlank +' <br/>');

} else {

 var i = 0;

 while(s.split(' ').length < max){

  s += indentBlank + ' ' + post2[i]+'<br/>';

  i++;

 }

}  

return s;

}

function createSummaryAndThumb(pID){

var div = document.getElementById(pID);

var content = div.innerHTML;

if (/<!--\s*more\s*-->/.test(content)) {

 div.innerHTML = getSummaryLikeWP(pID);

 div.style.display = "block";

}

else {

var imgtag = "";

var img = div.getElementsByTagName("img");

var summ = summary_noimg;

if(img.length>=1) {

 if(thumbnail_mode == "float") {

  imgtag = '<span class="thumbnailimg"><img src="'+img[0].src+'" /></span>';

  summ = summary_img;

 } else {

  imgtag = '<div class="thumbnailimg" align="center"><img src="'+img[0].src+'" /></div>';

  summ = summary_img;

 }

}

var summary = (classicMode) ? imgtag + '<div>' + stripHtmlTags(content,summ) + '</div>' : imgtag + '<div>' + getSummaryImproved(content,summ) + '</div>';

div.innerHTML = summary;

div.style.display = "block";

}

}

//]]>

</script><!-- Fim JavaScript Posts Resumidos-->


OBS: Para Botar uma imagem invés  de  leia mais  

Procure por :

leia mais  e substitua  esse trecho :
<a expr:href='data:post.url'>Leia mais »»</a>

Por:
<a expr:href='data:post.url'><img border='0' src='Url de sua imagem'/></a>