Anuncie Aki 545x260

Anuncie Aki 545x260

Anuncie Aki 545x260

Anuncie Aki Anuncie Aki 545x260

Anuncie Aki...

Anuncie Aki 545x260.

Titulo da Imagem Titulo da Imagem
Mostrando postagens com marcador Tutoriais. Mostrar todas as postagens

Tut-Colocar Avaliador

Va na sua conta no Blogger > Design > Editar HTML

Faça o backup do seu template

Expanda modelos widgets 

Procure (CTRL + F) por: <data:post.body/> ou se quiser 

colocar no titulo da postagem cole depois de <div 

class='post-header-line-1'/> esse codigo:

<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">
</div>

Procure (Ctrl + F) por: </body>  cole o codigo abaixo antes de 

</body>

<script src="http://js-kit.com/ratings.js"></script>

Procure (Ctrl + F) por: /* Coments no final de /* cole o codigo 

abaixo antes da tag: /* Coments no final de /*

.js-kit-rating {
height:20px;
margin-left: 330px;
overflow:hidden;
position:absolute;
margin-top: -2px;
width:105px;
}

Tut-Fantasma voando pelo seu blog

Entre no Blogger > Design > Elementos de Página.

Clique em Adicionar um/a miniaplicação/gadget HTML JavaScript. E cole o código abaixo.

<script language="JavaScript"> 
if ((document.getElementById) && 
window.addEventListener || window.attachEvent){ 
(function(){ 
//Configuracion 
var 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 configuracion 
var 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="http://1.bp.blogspot.com/_dsEG33PDaHw/TLUwy
8cYCsI/AAAAAAAAAZ0/kWv1B3tlak4/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> 
<style> 
.ghost { 
filter:alpha(opacity=30); 
-moz-opacity: 0.3; 
opacity: 0.3; 
-khtml-opacity: 0.3; 
} 
html { 
overflow-x:hidden; 
} 
</style>

Tut-Mudar Sidebar De Lado

Tutorial como mudar sidebar de Lado

Me andam sempre peguntando como mudar a sidebar de lado por isso procurei e achei para voces!
Funciona na perfeição eu proprio testei!


1.Design>Editar HTML>Aperte CTRL+F


2.Procure por SIDEBAR-WRAPPER


3. Após ache por "Float"
4. Terá Float: right ou Float: left , modifique eles.


5. EX: Terá float: left troque por float: right


OUTRA MANEIRA:
Troque o texto “float: left;” por “float: right;” (se a sidebar estiver Direita Para Passar Para Esquerda)


troque “float: right;” por “float: left;” (se a sidebar estiver na esquerda para passar para a direita)

Tut-Curso Editado

Este tutorial é exclusivo da Renders Create, se copiar deixe os créditos!
Ensinarei como colocar o cursor editado:
Ex:
Quando ele está normal:


Quando está sobre um link:

Então vamos lá, primeiro procure pela tag:

]]></b:skin>

Depois, abaixo dela cole o seguinte código:

<!-- Inicio seta editada -->

<style type='text/css'>body, a {cursor: url(http://cur.cursors-4u.net/cursors/cur-2/cur118.cur), progress;} a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-2/cur116.cur), progress;}</style>

<!-- Fim seta editada -->

Salve Seu Modelo, e pronto!

Tut-Botao De Seguir Flutuante

Aeee, galerinha venho trazer um tuto bem legal. Sabe aquele bug que dá no widget dos seguidores então diga Adeus aos problemas, esse tutorial irá facilitar suas vidas. então vamos ao tutorial!


1º vá em Design > Elementos da página > Adicionar um Gadget> HTML/JavaScript. 
AGORÁ COLE O SEGUINTE CÓDIGO:

CÓDIGO:
<a href="http://www.blogger.com/follow-blog.g?blogID=SEU ID"              style="display:scroll;position:fixed;top:10px;left:12px;" target="_blank" title="Clique Para Seguir NOME DO SEU SITE">
<img src="http://th1010.photobucket.com/albums/af230/daianepiva/th_seguir.png" /></a>

TUT-Como Cria Uma Gifs

                                              Como Cria Gif Animado
                           

TUT-Como Cria Um Blog

                                               Tae Um Tuto  Bem Until :D

Tut-Menu De Imagens



Olá Galerinha Hoje Vol Encinar Vocês Como Por Esse Menu A Hover De Imagens no
Blogger
Primeiro De CTRL + F e Digite 
]]></b:skin>
Depois de Encontrar Logo Acima Adicione esse Codigo:

/*menu imagem*/
#buscaemenu {
}
#menuimagem {
float:right; Indica o lado que ele vai Flutuar ou seja ficar delete essa parte
margin:0 0px 0 0px;
margin-left:400px; o quanto o menu ira ficar para esquerda
margin-top:-100px; a altura que ele vai ficar depois delete essa parte
z-index:2;
position:absolute;
}
#themes {
display:block;
background:url(http://dl.dropbox.com/u/18943078/The/Fundo%20Menu.png) no-repeat 0px -70px;
height:70px;
float:left;
margin:0;
padding:0;
width:121px;
}
#themes:hover {
background:url(http://dl.dropbox.com/u/18943078/The/Fundo%20Menu.png) no-repeat 0px 1px;
}
#renders {
display:block;
background:url(http://dl.dropbox.com/u/18943078/The/Fundo%20Menu.png) no-repeat -121px -70px;
height:70px;
float:left;
margin:0;
padding:0;
width:171px;
}
#renders:hover {
display:block;
background:url(http://dl.dropbox.com/u/18943078/The/Fundo%20Menu.png) no-repeat -121px 1px;
height:70px;
float:left;
margin:0;
padding:0;
width:171px;
}
#tutoriais {
display:block;
background:url(http://dl.dropbox.com/u/18943078/The/Fundo%20Menu.png) no-repeat -292px -70px;
height:70px;
float:left;
margin:0;
padding:0;
width:130px;
}
#tutoriais:hover {
display:block;
background:url(http://dl.dropbox.com/u/18943078/The/Fundo%20Menu.png) no-repeat -292px 1px;
height:70px;
float:left;
margin:0;
padding:0;
width:130px;
}
#utensilios {
display:block;
background:url(http://dl.dropbox.com/u/18943078/The/Fundo%20Menu.png) no-repeat -423px -70px;
height:70px;
float:right;
margin:0;
padding:0;
width:115px;
}
#utensilios:hover {
display:block;
background:url(http://dl.dropbox.com/u/18943078/The/Fundo%20Menu.png) no-repeat -423px 1px;
height:70px;
float:left;
margin:0;
padding:0;
width:115px;
}

Depois Vamos Para Segunda parte
Vocês Vão Adicionar esse Codigo Abaixo da tag:
<body>

<div id='menuimagem'>
<a href='http://thecreatos.blogspot.com/search/label/Templates' id='themes' target='_blank'/>
<a href='http://thecreatos.blogspot.com/search/label/Renders' id='renders' target='_self'/>
<a href='http://thecreatos.blogspot.com/search/label/Tutoriais' id='tutoriais' rel='nofollow' target='_blank'/>
<a href='http://thecreatos.blogspot.com/search/label/Utens%C3%ADlios' id='utensilios' rel='nofollow' target='_blank'/>
</div>

Tut-Colocar Botao De Seguir

Ae pessoal venho trazer um tutorial bem legal. Sabe aquele bug que dá no widget dos seguidores então diga Adeus aos problemas, esse tutorial irá facilitar suas vidas. então vamos ao tutorial!




1º vá em Design > Elementos da página > Adicionar um Gadget> HTML/JavaScript. 
AGORÁ COLE O SEGUINTE CÓDIGO:

CÓDIGO:
<a href="http://www.blogger.com/follow-blog.g?blogID=SEU ID"              style="display:scroll;position:fixed;top:10px;left:12px;" target="_blank" title="Clique Para Seguir NOME DO SEU SITE">
<img src="http://th1010.photobucket.com/albums/af230/daianepiva/th_seguir.png" /></a>

Tut-Como Colocar Site 100% Seguro

Este é um tutorial exclusivo!


1º - Vá em Design, Editar HTML, de um CTRL+F e procure o seguinte código:
<div class='rodape'>


2º - Assim que achar está linha, cole o seguinte código abaixo dela:


<div style='position:fixed; bottom:-2px; right:0px;'><img src="https://lh3.googleusercontent.com/-1ILjd9EYjZU/TpCC5o4AyZI/A
AAAAAAAAXM/Lvi8t6ZllX4/s100/DH.png" border="0" /></div>


Assim salve sua HTML, e pronto, seu blog está 100% seguro!


Se gostou comenta!

Tut-Passarinhos Do Twitter

1.  Vá em Layout > Adicionar um Gadget > HTML / JavaScript > HTML

Agora escolha a cor desejada do seu passarinho .



Hospedagem 4 Shared
Hospedagem 4 Shared
Hospedagem 4 Shared

Hospedagem 4 Shared

Hospedagem 4 Shared

Hospedagem 4 Shared

Hospedagem 4 Shared

Hospedagem 4 Shared

Tut-Como Botar Xat No Final Do Blog


Vai no painel do seu perfil clique em design dps em editar html selecione a opçao Expandir modelos de widgets


procure pela tag  ]]></b:skin> e coloque o codigo acima


.xat {
background:url(http://img40.imageshack.us/img40/1188/xatonlinedf.png) no-repeat;
width:800px;
height:500px;
clear:both;
margin:0 0 30px 260px;
padding:0px 0 0 0;
}
.xat embed{
width:550px;
height:360px;
overflow:hidden;
margin-top:62px;
margin-left:170px;
}


procure pela tag <div id='footer2'> ou <div id='logo-rodape'> e coloque o codigo acima


<div class='xat'>
<embed align='middle' allowscriptaccess='sameDomain' flashvars='id= ID DO XAT ' height='405' 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='455'/>
</div>