Aug/23
0
Reblog

Box ask me anything 

Bom, eu já expliquei aqui no blog como habilitar a função Ask me Anything no seu tumblr, agora eu vou ensinar como colocar um box na barra lateral do seu tumblr semelhante a esse da imagem
image
1º Passo) Entre no site do seu tumblr da seguinte maneira. NOME_DO_SEU_BLOG.tumblr.com/ask se a página for encontrada quer dizer que você já tem a função ask me ativada para a sua conta. Caso a página não for encontrada leia o post que eu fiz explicando como habilitar essa função aqui.

2º Passo) Copie o código abaixo e cole no bloco de notas

 
<h2><a href="">Ask me anything</a></h2> <p><iframe frameborder="0" scrolling="no" width="100%" height="149" src="http://www.tumblr.com/ask_form/Nome_do_seu_blog.TUMBLR.COM"  ></iframe> <!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]--></p> 3º Passo) Substituir a parte destacada em azul pelo que você quer que apareça no lugar do “Ask me anything”

4º Passo) Substituir a parte destacada em vermelho pelo endereço do seu tumblr.

5º Passo) Entrar no Tumblr » Customize » Info » Cole o código que você alterou na sua descrição, aperte Theme e espere carregar se aparecer um box semelhante ao da imagem do inicio do post e você gostar dele salve e saia, se não aparecer esse box, ou você fez alguma coisa errada com o código ou você ainda não tem a função “Ask me” habilitada.



Aug/23
0
Reblog

Relógio no tumblr 

º Passo) Entrar no site http://www.clocklink.com/gallery.php , existem alguns outros sites, mas esse é um dos mais simples de mexer

2º Passo) Escolher o relógio da sua preferência

image
A parte indicada na figura por:

A) É para os relógios analógicos e digitais, dentro do box vermelho estão todas as categorias de relógios. Clique em uma das categorias para ver os relógios disponíveis. 
B) É para o relógio do mapa Mundi, clique em World Clock

3º Passo) Depois de escolher o relógio que você quer aperte View HTML Tag, que fica embaixo dos relógios.
image
4º Passo) Vai abrir uma nova página semelhante a da imagem abaixo

image
A) É o modelo do relógio que você escolheu, para quem esta fazendo o do mapa mundi aparece a mesma coisa.
B) Escolher a cor do relógio
C) Aqui é para escolher o fuso do relógio. Aperte Select by City, depois escolha o país e a cidade. No caso do Mapa Mundi é só clicar na região do planeta em que você se encontra, ou então colocar no Timezone a opção : BRST: Brazilian Time (GMT - 02:00)
D) Escolher o tamanho do relógio, o tamanho vária de acordo com o relógio escolhido. Mas da para você mudar manualmente o tamanho. 
E) Copie esse código.
5º Passo) Vá no Tumblr » Customize » Info e cole o código na sua descrição.
Caso você queira mudar o tamanho do seu relógio, você vai ter que mudar uma coisinha simples no código.
Primeiro você deve procurar por width ( largura) e mudar o número que está do lado. Depois procure por height ( altura) e também mude o número que está ao seu lado. Vou usar o código abaixo como exemplo, o relógio em questão é um mapa mundi azul
<script src=”http://www.clocklink.com/embed.js”></script><script type=”text/javascript” language=”JavaScript”>obj=new Object;obj.clockfile=”world001-blue.swf”;obj.TimeZone=”BRST”;obj.width=480;obj.height=250;obj.wmode=”transparent”;showClock(obj);</script>
As partes em azul são as palavras que citei anteriormente, as partes em vermelho são os números que devem ser mudados, esses números são as medidas. Eu aconselho 200x150 ou então 150x100, mas é você quem decide o tamanho. Ah e isso depende também do tamanho da sua sidebar. Aconselho ir mudando as medidas até chegar no tamanho ideal
Mas muito cuidado ao mudar o código, não altere mais nada além dos números, se não o código pode não funcionar.



Aug/23
0
Reblog

Letras seguindo o mouse 

Bom, hoje eu vou ensinar como colocar letras, palavras ou frases seguindo o cursor do mouse. É bem simples basta seguir os passos abaixo.



1º Passo) Copiar o código abaixo e colar no bloco de notas


<script language=”javascript”>

//Alterar o Texto que stá dentro das Aspas em baixo:
var text=’ESCREVA AQUI O SEU TEXTO’;
var delay=40; // altere aqui velocidade
var Xoff=20; // distancia a contar para a direita do cursor (- Valores em negativo vão para a esquerda)
var Yoff=0; //distancia a contar para baixo desde o cursor (- Valores em negativo vão para cima)
var txtw=14; // Espaço que cada caracter ocupa
var beghtml=’<font color=”#ba476b"><b>’; 
var endhtml=’</b></font>’; 
//********** Não alterar o código seguinte **********\
ns4 = (navigator.appName.indexOf(“Netscape”)>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf(“Netscape”)>=0 )? true: false;
var txtA=new Array();
text=text.split(”);
var x1=0;
var y1=-1000;
var t=”;
for(i=1;i<=text.length;i++){
t+=(ns4)? ‘<layer left=”0” top=”-100” width=”’+txtw+’” name=”txt’+i+’” height=”1”>’ : ‘<div id=”txt’+i+’” style=”position:absolute; top:-100px; left:0px; height:1px; width:’+txtw+’; visibility:visible;”>’;
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? ‘</layer>’ : ‘</div>’;
}
document.write(t);
function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+’px’;
id.style.top=y+’px’;
}}
function animate(evt){
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}
function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}
function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}
function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}
function movetxts(){
for(i=text.length;i>1;i=i-1){
if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){
moveid(txtA[i-1],0,-1000);
moveid(txtA[i],0,-1000);
}else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1]));
}
moveid(txtA[1],x1,y1);
}
window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers[‘txt’+i]:(ie4)?document.all[‘txt’+i]:document.getElementById(‘txt’+i);
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=animate;
setInterval(‘movetxts()’,delay);
}
</script>

2º Passo) Substitua a parte destacada em azul pelas palavras que você quer que sigam o seu cursor.

3º Passo) Entre nesse site http://www.mxstudio.com.br/Conteudos/Dreamweaver/Cores.htm e escolha de que cor vão ser as palavras. Copie o código HTML dessa cor.

4º Passo) Substitua a parte destacada em vermelho pelo código da cor que você escolheu no passo anterior.

5º Passo) Entre no tumblr » Customize » Theme » Custom HTML » aperte Ctrl F e procure por <body> cole o código que você editou imediatamente abaixo do <body>, aperte Update Preview e veja se apareceu o que você queria ao lado do mouse, se sim salve e sai se não cancela e tenta fazer de novo.



Aug/23
0
Reblog

Bolhas saindo do mouse 

No tutorial de hoje vou ensinar a colocar bolhas saindo do seu mouse, parecidas com essas que estão saindo do seu cursor, aqui no blog. Se você não está vendo clique em Continue Lendo aqui em baixo, para você ir para a página do post e ver como é o efeito.


1º Passo) Copiar o código abaixo e colar em algum editor de texto que você tenho no seu computador.(Bloco de notas ou Word)


<script type=”text/javascript”>
// <![CDATA[
var colours=new Array(“#a6f”, “#60f”, “#60f”, “#a6f”, “#ccc”); // colours for top, right, bottom and left borders and background of bubbles
var bubbles=66; // maximum number of bubbles on screen

var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var bubb=new Array();
var bubbx=new Array();
var bubby=new Array();
var bubbs=new Array();

window.onload=function() { if (document.getElementById) {
  var rats, div;
  for (var i=0; i<bubbles; i++) {
    rats=createDiv(“3px”, “3px”);
rats.style.visibility=”hidden”;

div=createDiv(“auto”, “auto”);
    rats.appendChild(div);
div=div.style;
    div.top=”1px”;
    div.left=”0px”;
div.bottom=”1px”;
div.right=”0px”;
div.borderLeft=”1px solid “+colours[3];
div.borderRight=”1px solid “+colours[1];

    div=createDiv(“auto”, “auto”);
rats.appendChild(div);
div=div.style;
    div.top=”0px”;
    div.left=”1px”;
div.right=”1px”;
div.bottom=”0px”
div.borderTop=”1px solid “+colours[0];
div.borderBottom=”1px solid “+colours[2];

div=createDiv(“auto”, “auto”);
rats.appendChild(div);
div=div.style;
div.left=”1px”;
div.right=”1px”;
    div.bottom=”1px”;
div.top=”1px”;
div.backgroundColor=colours[4];
div.opacity=0.5;
if (document.all) div.filter=”alpha(opacity=50)”;

    document.body.appendChild(rats);
bubb[i]=rats.style;
  }
  set_scroll();
  set_width();
  bubble();
}}

function bubble() {
  var c;
  if (x!=ox || y!=oy) {
    ox=x;
    oy=y;
    for (c=0; c<bubbles; c++) if (!bubby[c]) {
      bubb[c].left=(bubbx[c]=x)+”px”;
      bubb[c].top=(bubby[c]=y)+”px”;
      bubb[c].width=”3px”;
  bubb[c].height=”3px”
  bubb[c].visibility=”visible”;
  bubbs[c]=3;
      break;
}
  }
  for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);
  setTimeout(“bubble()”, 40);
}

function update_bubb(i) {
  if (bubby[i]) {
    bubby[i]-=bubbs[i]/2+i%2;
    bubbx[i]+=(i%5-2)/5;
    if (bubby[i]>sdown && bubbx[i]>0) {
  if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {
bubb[i].width=bubbs[i]+”px”;
bubb[i].height=bubbs[i]+”px”;
  }
      bubb[i].top=bubby[i]+”px”;
      bubb[i].left=bubbx[i]+”px”;
    }
    else {
      bubb[i].visibility=”hidden”;
      bubby[i]=0;
      return;
    }
  }
}

document.onmousemove=mouse;
function mouse(e) {
  set_scroll();
  y=(e)?e.pageY:event.y+sleft;
  x=(e)?e.pageX:event.x+sdown; }

window.onresize=set_width;
function set_width() {
  if (document.documentElement && document.documentElement.clientWidth) {
    swide=document.documentElement.clientWidth;
    shigh=document.documentElement.clientHeight;
  }
  else if (typeof(self.innerHeight)==”number”) {
    swide=self.innerWidth;
    shigh=self.innerHeight;
  }
  else if (document.body.clientWidth) {
    swide=document.body.clientWidth;
    shigh=document.body.clientHeight;
  }
  else {
    swide=800;
shigh=600;
  }
}

window.onscroll=set_scroll;
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 && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
    sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
  }
  else {
    sdown=0;
    sleft=0;
  }
}

function createDiv(height, width) {
  var div=document.createElement(“div”);
  div.style.position=”absolute”;
  div.style.height=height;
  div.style.width=width;
  div.style.overflow=”hidden”;
  return (div);
}
// ]]>
</script>

2º Passo) Escolher as cores das bolhas. No começo do código tem uma parte que está destacada com várias cores. Vou repetir essa linha do código aqui para poder explicar como muda as cores.

var colours=new Array(“#a6f”, “#60f”, “#60f”, “#a6f”, “#ccc”);

A parte em :
                    Vermelho: Cor da parte de cima da bolha
                     Laranja   : Cor do lado direito da bolha
                     Azul        : Cor da parte de baixo da bolha
                     Roxo       : Cor do lado esquerdo da bolha
                     Preto       : Cor do fundo da bolha

OBS: Muito cuidado antes de alterar o código.

Para alterar as cores entre nesse site http://www.mxstudio.com.br/Conteudos/Dreamweaver/Cores.htm e copie o código HTML da cor e substitua no lugar de qualquer uma das cores do código.

3º Passo) Agora vamos escolher quantas bolhas no máximo vai ter na página. Vou copiar outra parte do código aqui só pra exemplificar. Essa parte esta no começo do código também, junto com a parte das cores.

var bubbles=66


Aqui é só ir mudando o valor e ver qual quantidade de bolhas você prefere.

4º Passo) Agora é só copiar o código que você editou e ir no Tumblr » Customize » Themes » Use Custom HTML » Agora procure no código por </body>, use CTLR F para procurar. Agora cole o código que você modificou imediatamente antes do </body>. Aperte Update Preview e espere a página carregar, passe o mouse pela sua página que está ao fundo veja se as bolhas estão saindo do mouse e se você gostou do resultado, se sim salve e saia se não gostou aperte Cancel.

5º Passo) Deixe nos comentários o seu tumblr, pro pessoal ver como é que fica o resultado :D



Aug/23
0
Reblog

Twitter 

Alguns leitores do blog pediram para a gente explicar como colocar aquele ‘botão’ do twitter que fica ali no canto da página, é isso que vamos explicar hoje, é bem simples.

image

1º Passo) Entre nesse site http://www.go2web20.net/twitterfollowbadge
2º Passo) Configurar o seu botão

image
A) Nome da sua conta no twitter, no caso aqui do blog dicastumblr
B)O que você quer que apareça escrito
C) A cor
D) O lado que o botão irá aparecer
E) Mudar o Tamanho
3º Passo) Aperte Update Code, com isso irá aparecer um código, copie esse código
4º Passo) Entre no Tumblr » Customize » Info » cole esse código na sua descrição



Aug/23
0
Reblog

Como personalizar a dashboard do tumblr 

Algumas pessoas andaram perguntando aqui no blog e no formspring como personalizar a dashboard do tumblr. Para quem não sabe o que seria mudar a dashboard vou colocar duas imagens aqui embaixo como exemplo. Clique nelas para aumentar

image
image
Somente os usuários do Firefox e do Google Chrome conseguem fazer essa modificação.



1º Passo) Instale o Stylist,

Firefox : https://addons.mozilla.org/en-US/firefox/addon/stylish/
Chrome: https://chrome.google.com/extensions/detail/fjnbnpbmkenffdnngjfgmeleoegfcffe

2º Passo) Feche o seu navegador e abra novamente.

3º Passo) Entre nesse site http://userstyles.org/styles/browse/tumblr.com e procure por algum tema que você goste, para achar as dashboards relacionadas a ele, ou então vai clicando em uma por uma até achar uma que lhe agrade.

4º Passo) Depois de achar a Dashboard que você quer, clique em Install with Stylist

image
5º Passo) Abra o tumblr e veja como ficou o resultado.

OBS: No caso do Chrome vai aparecer um S no canto superior direito do navegador, do lado das ferramentas.

image
Clique nesse S quando estiver na página do tumblr, ele lhe dará a opção de desinstalar a Dashboard (Disable).
image
Caso tenha instalado mais de uma dashboard é normal elas se misturarem, para resolver esse problema é só clicar no S e desistalar todas as dashboards menos a que você quer usar.

6º Passo) Comente aqui no blog se conseguiu instalar a Dashboard e o que achou do resultado. E se quiser deixe o link do seu tumblr.

NOTA: Para desinstalar no Firefox vá em Ferramentas » Complementos » Vai abrir uma nova janela » aperte em extensões » desinstale o Stylist.



Aug/23
0
Reblog

Como fazer perguntas no tumblr ? 

Aprenda a fazer perguntas para todos os seus followers de uma só vez.

image

Bom, é muito simples fazer perguntas, basta você criar um post onde o texto termine com um ponto de interrogação. Com isso irá aparecer um quadradinho do lado direito da página escrito “Let people answer this”, marque-o.
image



Aug/23
0
Reblog

Bloquear o botão direito do mouse com AVISO! 

Aprenda como colocar um aviso para o seu visitante quando ele tentar usar o botão direito do mouse.

image

image

1º Passo) Copiar o código abaixo
<SCRIPT language=JavaScript><!—function click() {if (event.button==2) {alert(‘COPIAR CONTEÚDO DESSA PÁGINA É PROIBIDO’)alert(‘SE GOSTOU REBLOGUE !!!!’)}}document.onmousedown=click// —></SCRIPT>

2º Passo) Editar o código com a frase que você quer que apareça para os seus visitantes. A parte em vermelho é a primeira mensagem que irá aparecer, a parte em azul é a segunda.
3º Passo) Copiar o código que você editou e colar ele na sua descrição do tumblr.



Aug/23
0
Reblog

Abowman no Tumblr - Bichinho Virtual 

Abowman é um site que disponibiliza alguns gadgets de jogos simples e alguns jogos com ‘bichinhos virtuais’ que você pode colocar no seu tumblr. Aqui embaixo temos dois exemplos de bichinhos virtuais.

Para jogar o do cachorro, basta você selecionar uma das opção na parte de baixo e bricar com ele.

Já o do hamster você tem que clicar na tela do jogo para dar comida para ele. Para fazer ele correr na roda basta clicar na bolinha amarela do centro






Para colocar alguns desses jogos no seu tumblr, siga as intruções abaixo:



1º Passo) Entre nesse site http://abowman.com/google-modules/ e escolha o jogo.

2º Passo) Aperte edit settings logo abaixo da tela do jogo para mudar as cores.

3º Passo) Embaixo de embed code tem um código copie ele inteiro.( Alguns jogos não tem

4º Passo) Se você quiser que o jogo fique na sua barra lateral vá em Customize » Info e cole o código na descrição. Agora se você quer fazer um post com o jogo, vá em criar post de video e cole o código no primeiro box (Embed Video).



Aug/23
0
Reblog

Como colocar musica no tumblr pelo hypster 

Mais um modo de colocar músicas e playlist no tumblr.

image


1º Passo) Entrar no site http://www.hypster.com/ e se registrar.

2º Passo) Depois de se registrar clique em ‘Search’

3º Passo) Procure pelas músicas que você quer, quando achar clique no +ADD que esta do lado do nome da música, faça isso com todas as músicas que você quer no seu player.

image

 4º Passo) Depois de adicionar todas as músicas clique em ‘My Account’

5º Passo) Agora clique na imagem de uma fita, estilo aquelas que se colocava no rádio

image
6º Passo) Clique na imagem do Classic Player

image7º Passo) Agora é a hora de configurar o seu player. Na imagem está explicando o que cada opção faz

image
8º Passo) Copiar o código que esta em um box azul do lado direito da tela ( o código esta destacado em preto na imagem abaixo)

image
9º Passo) Editar o código,

MUITA ATENÇÃO NESSA PARTE PARA NÃO MODIFICAR COISA ERRADA

No seu código vai ter uma parte assim

 width:370px;visibility:visible; height:300px;” type=”application/x-shockwave-flash” height=”300" width="370”

Substitua os 370 destacados em azul por 55 e os 300 destacados em vermelho por 15, essa parte do seu código deve ficar assim

width:55px;visibility:visible; height:15px;” type=”application/x-shockwave-flash” height=”15" width="55”


Atenção: Só essa parte do código que muda, o resto continua igual


10º Passo) Agora copie todo o código vá no Tumblr » Customize » Info » e Cole o código na sua descrição.