Dicas para Orkut e Blogger
Autor: Alih Santos | Publicado: 2011-06-30T22:49:00-07:00

 Título do seu Blog em Movimento {Blogger}    Hoje eu vou ensinar vocês a colocarem  um script bem legal que deixa o título do blog em movimento na aba e na  barra superior do navegador, eu já usei esse efeito aqui no blog há  algum tempo, mas depois retirei. Como muita gente vem me perguntando  como colocar, preparei um tutorial, espero que gostem!
O1. Primeiramente, faça o login em sua conta do Blogger.
O2. Quando   estiver no painel no Blogger, você verá o nome do seu blog e logo   abaixo do nome dele alguns link para acessar diversas ferramentas do   Blogger. Você irá clicar em "Design", veja o print:
O3.   Ao clicar em "Design", você será redirecionado para a área onde você   pode editar a aparência do seu blog. Mude da tela "Elementos da Página",   para a tela "Editar HTML".
O4.  Agora   você está frente-a-frente com o HTML do seu blog :) e abaixo segue o   script para você poder colocar esse efeito em seu blog, selecione-o e o  copie:

&lt;script language='JavaScript'&gt;
var txt=" TÍTULO DO SEU BLOG ";
var espera=80;
var refresco=null;
function rotulo_title() {
document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0); refresco=setTimeout("rotulo_title()",espera);}
rotulo_title();
&lt;/script&gt;

O5.  Após copiar o  código, vá para página do HTML do seu blog e procure  pela palavra &lt;/head&gt;. Para achá-la com mais fácilidade, é só usar o  campo de  pesquisa, para acessá-lo é só teclar "Ctrl+F" e fazer sua  pesquisa.
O6. Quando  encontrar a palavra &lt;/head&gt;, cole o script que você copiou depois  dela. Antes de testar ou de salvar, você precisa fazer uma pequena  alteração no  código, substuindo o texto TITULO DO SEU BLOG pelo nome  {título} do seu  blog. Clique em "Visualizar". Se estiver tudo certo com seu blog e o efeito estiver funcionando, feche a página de visualização e clique em "Salvar Modelo".
O7. Pronto! Para alterar a velocidade com que o texto se move, é só alterar o valor do número na linha var espera=80; Quanto menor o valor do número mais rápido, quanto maior mais lento.

Créditos a PhotoScape       Edições.  Postado por: Nathalia Matos   às 11:53 AM   13 comentários      Categoria: × Dicas para Orkut e Blogger              
              Colocando Imagem no Cabeçalho {Blogger}    Hoje vou ensinar a vocês como colocar uma imagem no cabeçalho do seu  blog. Pra quem ainda não sabe, cabeçalho é aquele espaço superior onde  fica o título do blog. É bem fácil, espero que todos consigam...

O1. Primeiramente, faça o login em sua conta do Blogger.
O2. Quando   estiver no painel no Blogger, você verá o nome do seu blog e logo   abaixo do nome dele alguns link para acessar diversas ferramentas do   Blogger. Você irá clicar em "Design", veja o print:
O3.  Ao clicar em  "Design", você será redirecionado para a área onde você  pode editar a  aparência do seu blog. Permaneça na tela "Elementos da  Página".
O4.  Você está vendo todos os elementos da sua página e a forma como eles  estão organizados. O cabeçalho geralmente fica abaixo da navbar, é bem  fácil encontrá-lo, nele estará escrito o nome do seu blog e ao lado do  nome em parênteses estará a palavra "Cabeçalho". Quando encontrar,  clique na palavra "Editar" que está no espaço dele, veja o print:

CLIQUE NA IMAGEM PARA AMPLIÁ-LA.O5.  Ao clicar em "Editar" uma pequena janela será aberta, e é através dela  que você irá colocar a imagem que deseja no cabeçalho do seu blog. Veja o  print abaixo:

CLIQUE NA IMAGEM PARA AMPLIÁ-LA.O6. Com tudo já ajustado, é só clicar no botão "Salvar". Agora é só olhar o seu blog e ver está como você quer e pronto!

Créditos a PhotoScape       Edições.  Postado por: Nathalia Matos   às 8:26 AM   7 comentários      Categoria: × Dicas para Orkut e Blogger              
              Colocando Cursor com Estrelas Caindo {Blogger}    Eu já perdi a conta de quantas pessoas  me pediram pra ensinar a colocar em seus blogs essas estrelinhas que  saem do mouse... Finalmente eu vou ensinar a vocês e espero que todos  consigam fazer, vamos mecher bastante com HTML e isso pode complicar  muita gente, então prestem bastante atenção e qualquer dúvida é só  dizer. Ao tutorial:
O1. Primeiramente, faça o login em sua conta do Blogger.
O2. Quando  estiver no painel no Blogger, você verá o nome do seu blog e logo  abaixo do nome dele alguns link para acessar diversas ferramentas do  Blogger. Você irá clicar em "Design", veja o print:
O3.  Ao clicar em "Design", você será redirecionado para a área onde você  pode editar a aparência do seu blog. Mude da tela "Elementos da Página",  para a tela "Editar HTML".
O4.  Agora  você está frente-a-frente com o HTML do seu blog :) e abaixo segue o  script para você poder colocar esse efeito em seu blog, selecione-o e o  copie.

&lt;script type='text/javascript'&gt;
// &lt;![CDATA[
var colour="#FFFFFF";
var sparkles=50;
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i&lt;sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="2px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="2px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c&lt;sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";
star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c&lt;sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]&lt;shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}
}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]&lt;shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {
tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement &amp;&amp; (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement &amp;&amp; document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]&gt;
&lt;/script&gt;

O5.  Após copiar o código, vá para página do HTML do seu blog e procure pela  palavra &lt;/body&gt;. Para achá-la com mais fácilidade, é só usar o  campo de pesquisa, para acessá-lo é só teclar "Ctrl+F" e fazer sua  pesquisa.
O6. Quando encontrar a palavra &lt;/body&gt;, cole o script que você copiou antes dela e clique em "Visualizar". Se estiver tudo certo com seu blog e o efeito estiver funcionando, feche a página de visualização e clique em "Salvar Modelo".
O7. Pronto! Para modificar a cor das estrelinhas, você deve fazer uma pequena alteração no script, alterando o código da cor em var colour="#FFFFFF"
A cor que está no script é o branco, abaixo segue o código de algumas cores pra você utilizar no seu script:
VERMELHO: #FF0000
ROSA: #FF69B4
ROXO: #912CEE
AZUL: #0000FF
AZUL CLARO: #1E90FF
VERDE: #00FF00
AMARELO: #FFD700
ALARANJADO: #FF8C00
PRETO: #000000

Créditos a PhotoScape       Edições.
Script retirado do site Cursores Girlspt.  Postado por: Nathalia Matos   às 8:19 AM   77 comentários      Categoria: × Dicas para Orkut e Blogger              
              Colocando Imagem no Perfil {Orkut}    Hoje eu vou ensinar a vocês como  colocar imagem no perfil do Orkut. É bem simples principalmente pra quem  já está acostumado com o Orkut, mas é sempre bom tirar todas as dúvidas  ;)Vamos ao tutorial:

O1.  Primeiramente faça o login na sua conta do orkut, utizando o navegador  Internet Explorer, é importante que você use esse navegador para não  ocorrer nenhum problema, depois que você fizer todas as modificações no  seu perfil, você volta para o navegador que costuma usar normalmente,  Opera, Mozilla Firefox e etc. Para adicionar a imagem, também é  necessário utilizar o Novo Orkut. Se você utiliza a versão antiga é só  clicar no botão "teste o novo orkut!" e seguir o tutorial, depois você pode voltar para a versão antiga, é só clicar em "versão antiga".
O2. Agora clique em "perfil" e em seguida em "editar &gt; editar texto".
O3. Vá em "Inserir imagens"  e você terá acesso a uma janela onde você pode fazer o upload da sua  imagem, ou seja carregar uma imagem que está em seu computador. Para  adicionar uma imagem clique em "Procurar...", selecione uma imagem do  seu computador e clique em "Abrir". Agora para enviar a imagem, clique  em "Fazer upload" e aguarde. O carregamento vai demorar conforme o  tamanho da sua imagem, por isso não recomendo que envie imagem com o  comprimento maior que 400 pixeis. Se a imagem que você deseja enviar for  muito grande, vá no PhotoScape e edite o tamanho dela, é só ir em  "Redimensionar &gt; Reduza o mais longo comprimento : 400 px".

CLIQUE NA IMAGEM PARA AMPLIÁ-LA.O4.  Após o carregamento, note que sua imagem ficou um pouco distorcida, em  alguns caso pode ser que não fique, mas recomendo que siga o  procedimento a seguir mesmo assim: Clique no botão "HTML" e você verá um código, apage a seguinte parte:

CLIQUE NA IMAGEM PARA AMPLIÁ-LA.Se  você desejar que a imagem fique centralizada, fique no meio do espaço, é  só escrever &lt;CENTER&gt;   antes do código e  &lt;/CENTER&gt; depois  do código. Ficará assim:

CLIQUE NA IMAGEM PARA AMPLIÁ-LA.O5. Agora é só clicar em "Salvar" e pronto!

Créditos a PhotoScape       Edições.  Postado por: Nathalia Matos   às 10:53 AM   0 comentários      Categoria: × Dicas para Orkut e Blogger    
  Colocando Link em uma Imagem {Blogger}   Depois de muito pedidos e muitas  perguntas, finalmente resolvi criar uma categoria com dicas para o Orkut  e para o Blogger {Blogspot}. Eu vou passar pra vocês algumas dicas  básicas e espero que gostem :D

Hoje, eu vou ensinar como colocar  link em uma imagem no Blogger. Ou seja, como fazer para que quando  alguém clique sobre uma certa imagem que está em seu blog, essa pessoa  seja redirecionada para uma página da web. Por exemplo, eu criei  utilizando o PhotoScape, um pequeno banner e eu quero que quando as  pessoas cliquem sobre ele, elas sejam redirecionadas para o site www.pensador.info, vejam como ficou:Vamos aprender como fazer:O1.   Primeiramente, você deve hospedar a imagem que deseja utilizar. Aqui  no blog tem um tutorial ensinando como hospedar  imagens, clique aqui para o ler.O2. Copie o endereço da imagem que é conhecido como link direto ou URL, e cole-o em um bloco de notas ou no Word, tanto faz.O3. Copie o código abaixo e cole-o no local onde você deseja que a imagem apareça:&lt;a href="LINK DO SITE"&gt;&lt;img src="LINK DA IMAGEM" border=0 /&gt;&lt;/a&gt;O4. Agora vamos fazer as devidas alterações no código. Onde está escrito LINK DO SITE, você apaga e coloca o link do site para onde quer que a imagem redirecione e onde está escrito LINK DA IMAGEM, você também apaga e coloca no lugar o endereço da imagem que você colocou no bloco do notas {ou no Word}.O5.  Pronto agora é só salvar! Você pode utilizar este código nas postagens  ou no widget HTML/JavaScript quando quiser colocar na lateral do seu  blog.