Image Map

Pacotão tutoriais + Utilitários !

Oi meus cupcakes de chocolate com baunilha tudo bem ? Estava com saudade de vocês hehe. Bem, primeiramente eu vou explicar umas coisas para vocês certo?
Os utilitários neste post são todos EDITADOS por mim.
São uns que eu aprendi e amei!

 5094212978_e8467863aa_z_large

Bloqueando botão direito do blog :


Desing- Adicionar um Gadget HTML/ Java Script - e cole o seguinte código:
<script language="JavaScript"> <!--  var message="MENSAGEM AQUI";  /////////////////////////////////// function clickIE4(){ if (event.button==2){ alert(message); return false; } }  function clickNS4(e){ if (document.layers||document.getElementById&&!document.all){ if (e.which==2||e.which==3){ alert(message); return false; } } }  if (document.layers){ document.captureEvents(Event.MOUSEDOWN); document.onmousedown=clickNS4; } else if (document.all&&!document.getElementById){ document.onmousedown=clickIE4; }  document.oncontextmenu=new Function("alert(message);return false")  // -->  </script> <br /> <br /> <img onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" src=" http://data.whicdn.com/im/pages/15692903/310864_198306653571038_181048911963479_466593_1166138271_n_thumb.jpg " style="opacity: 0.5;" /><br /> <br /> <br /> 
 

Cursor que mudar ao passar em cima de um link:
Sabe aqueles blogs que no começo fica com uma cursor ai agente passa em cima de um link- e eu simplismente acho mega fofo *-* - vou ensinar vocês a fazerem isso no blog de vocês hoje - lol - vamos começar ?

Desing - Editar HTML - ctrl + F3 procure por: 
]]></b:skin>  quando achar logo acima cole o seguinte código :

{cursor: url("Link-cursor"), url("link-cursor"), auto;}
A:hover{cursor: url("link-cursor"), url("link-cursor"), auto;}
 

Personalize o título dos gadgets:

Desing-Editar HTML- procure por : /* Headings - Quando achar vizualize este tag : h2 
Apague da primeira { -chave- até a última } perto do tag h2 { certo ?? E onde estava as { que você apagou cole  : 
{
display:block; background:#CordoFundo; color:#CordaFonte; text-shadow: 1px 1px 0 #CordaSombradoTexto; font-size:12px; font-weight:bold; letter-spacing:1px; padding:3px 5px 3px 10px; margin:5 0 0px 0; text-transform: normal; border-bottom: 1px dashed #CordoPontilhado; }
}
 

Atenção minhas balinhas de café, esse tutorial é totalmente feito por mim! vamos começar ?
Turorial : Fazendo cursores : obs nos útilitários terão uns cursores certo?


Abra seu photo Scape - Uma nova foto 32X32 ponha uma setinha no mue caso foi do site Cursor 4 You - faça uma imagem fofa ou pegue um brushe fofo certo ? e cole ao lado da setinha 
Tendo este resultado :













Agora você vai fazer o que indica nesta próxima imagem :






E faça uma linha de volta para dar um charme !kkkk .
Agora vamos deixar o cursor com o fundo tranparente no photo filtre :
Aabra o photofiltre - escolha a imagem - deixe p fundo tranparente e salve .
Colocando no seu blog :
Copie este código :
<style type="text/css">body  {cursor:url("COLE-AQUI-A-URL-DO-SEU-CURSOR"),default}
 </style><br /> 
E onde está escrito : COLE-AQUI-A-URL-DO-SEU-CURSOR cole o url do cursor - claro né nataly dãã!rsrs - salve e pronto !


 

Imagens arredondadas na área dos posts :

Todas as imagens

Para arredondar todas as imagens dos posts direto é só procurar por ]]></b:skin> e colar logo acima:
.main img {
-webkit-border-radius: 10px 10px 10px 10px; */ Bordas arredondadas */
}
Imagem Específica
Você terá que ir em ]]></b:skin> e colar logo acima:


.imgarredondada{ -webkit-border-radius: 10px 10px 10px 10px;  }


Salve e cole no html da sua postagem:
<img class="imgarredondada" src="URL_DA_IMAGEM" />

E se for em imagens linkadas:
<a href="Link para a Imagem"><img src="Url da Imagem" class="imgarredondada "></a>
 

Afiliados com imagem :
<a href="http://teensgirlsmoda.blogspot.com/" none;="" target="_blank" text-decoration:="" title="Teen Gitl"><img class="borderimage" onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" src="url da imagem" style="opacity: 0.5;" /></a>
 Ai a cima é o código que você usa :
Desing - adicionar um gadget - Javascript/HTML .
E pronto !
 

Como colocar gif ao lado do link dos comentarios:

desingDepois "Editar html"Marque a opção "Expandir modelos de widgets.
Agora pressione: Ctrl+f
Procure por:  post-comment-link'>
Do lado do tag cole:

<img src='url da sua imagem' style='border:0px;'/>

E cole a url do gif ai vai uns gifs :

Mini gif 95 Mini gif 69Mini gif 58  Mini gif 161 Mini gif 194                       Mini gif 145  

 


Coisas para seu layout - Completo .
3 Cabeçalhos


 

3 Link-me : 





 

 2 coisinhas - esqueci o nome - para você colocarem em algum lugar no blog :



 

 


Nenhum comentário:

Postar um comentário