sábado, 1 de dezembro de 2012

Use e Abuse :3

 Hello peoples *--*
  Esse é meu primeiro layout free (viva eu -q), eu fiz com todo carinho, espero que gostem e usem. O tema desse layout é o "Cute Pink-Green" e as imagens principais usadas no layout são de coreanas. Eu desejo que vocês usem, e se usarem podem ter certeza que eu farei mais layouts pra vocês, cada vez melhores :3
 Bom gente, o layout contem :

-Barra De Rolagem Personalizada
-Cabeçalho Personalizado
-Área das Postagens separadas
-Área dos Gadgets Sepada
-Fonte Personalizada no título da postagem e nos gadgets
-Menu Hover
-Efeito no Gadget "Quem Somos"
-Caixa De Busca Personalizada
-"Leia Mais" com imagem exclusiva
-Seleção de Texto Colorida
-"Recentes" "Início" e "Antigas" Com Imagens
-Comentários Personalizados

~Clique em continue lendo, pra você entender mais sobre o layout~
Ah galera, pra usarem o menu, tem que ir no "layout" depois, adicionar um HTML/JavaScript e colar o código : <a href="LINK" alt="­" ><div class="menugradiente">LINK 1</div></a>
<a href="LINK2" alt="­" ><div class="menugradiente">LINK 2</div></a>
<a href="LINK3" alt="­" ><div class="menugradiente">LINK 3</div></a>
<a href="LINK" alt="­" ><div class="menugradiente">LINK 4</div></a>
<a href="LINK2" alt="­" ><div class="menugradiente">LINK 5</div></a>

E tem que alterar (acho que vocês sabem como)

E pra colocar a caixa de busca, tem que ir no "layout", depois adicionar um HTML/JavaScript, e colar o código : <form action="/search" class="search" method="get">
<input class="searchbar" id="s" name="q" placeholder='Digite o que procura' type="text" value="" />
<input class="searchbut" type="submit" value="" />
</form>

Agora para colocar o gadget "que somos", vai em "layout" adicionar um HTML/JavaScript, e cole o código :  <link href="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz" rel="stylesheet" type="text/css" />



<script type="text/javascript" src="http://static.tumblr.com/u6pbfuu/EBwm3o3xm/jquery-1.4.min.js"></script>

<script type="text/javascript" src="http://static.tumblr.com/u6pbfuu/cndm3o3wy/jquery.easing.1.3.js"></script>

<script>



$(document).ready(function() {



//if mouse over and mouse out

$('.eff').hover(

function () {



value = $(this).find('img').outerHeight() * -1;



//for left/right if you have different width and height,

//commented out because we are using up/down in this example

//value = $(this).find('img').outerWidth() * -1);



//animate the image

// you can change the sliding direction by changing bottom to left, right or top

// if you changed this, you will have to change the position of the hover out as well

$(this).find('img').stop().animate({bottom: value} ,{duration:500, easing: 'easeOutBounce'});



},

function () {



//reset the image

// the position property (bottom), it must be same with the on in the mouseover

$(this).find('img').stop().animate({bottom:0} ,{duration:500, easing: 'easeOutBounce'});



});



//if user clicked on the thumbnail

$('.eff').click(function () {

//grab and execute the first link in the thumbnail

window.location = $(this).find('a:first').attr('href');

});



});



</script>



<div class="eff">
<img src="http://i50.tinypic.com/125nqsy.png" />
<div class="caption">
<a href="link" class="header">Seu Nome</a>
<center><p> <a href="LINK1">NOME DO LINK 1</a></p>
<p><a href="LINK 2">NOME DO LINK 2</a></p>
<p><a href="LINK 3">NOME DO LINK 3</a></p> </center> </div></div>
<div class="eff">
<img src="http://i45.tinypic.com/2ezgz2a.png" />
<div class="caption">
<a href="link" class="header">Autor 2</a>
<center><p> <a href="LINK1">NOME DO LINK 1</a></p>
<p><a href="LINK 2">NOME DO LINK 2</a></p>
<p><a href="LINK 3">NOME DO LINK 3</a></p> </center> </div></div>

 Altere oque se pede, e salve.
 É isso gente o código pra vocês colarem no HTML do seu blog, está no post anterior ok? Qualquer dúvida mande um comentário no post do lay free no MCMM, é isso fofuras, espero que gostem, pq eu amei, quase que pego ele pra mim k'
Aqui o cabeçalho pra vocês editarem (é só clicar na imagem e salvar, e depois editar, recomendo o photofiltre):
 E o plano de fundo :


4 comentários: