09 dezembro 2012

2 tutorial muito simples!!

Olá meninas,como vão?eu bem!!,bom hoje eu trago um tutorial que aprendi no blog da Jackei eu amo o blog dela beijos para ela !!vamos ver?lembrando é um tutorial  pequeno então não vai ser um post grande,mas vou dar o meu melhor!!
Colocando espaço no link ''comentários''
este é um exemplo do blog da jackei créditos!!
Vá no seu HTML e marque e opção ''expandir modelos de widgets'' dê um ctrl + f e procure por: post-comment-link'>


Abaixo dele cole o código abaixo:
<img src='url da sua imagem' style='border:0px;'/>

Substituindo o trecho em roxo pela url de uma imagem branca.

                   Vá no seu HTML e marque a opção expandir modelos de widgets dê um ctrl + f e pesquise por: ]]></b:skin>   e cole o código abaixo ACIMA dessa tag:


#box-toggle {
margin:0 auto;
}
#box-toggle .tgl {
margin-bottom:20px;
}
#box-toggle span {
display:block;
cursor:pointer;
font-weight:bold;
font-size:14px; /* edite fonte */
color:#3D81EE; /* edite cor do link */
margin-top:15px;
} 
Agora Procure pela tag </head> e cole o seguinte código ACIMA dela:


<!--ScriptjQuery Toggle revelar esconder Inicio -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
jQuery.fn.toggleText = function(a,b) {
return this.html(this.html().replace(new RegExp("("+a+"|"+b+")"),function(x){return(x==a)?b:a;}));
}
$(document).ready(function(){
$('.tgl').before('<span>[Ver Conteúdo]</span>');
$('.tgl').css('display', 'none')
$('span', '#box-toggle').click(function() {
$(this).next().slideToggle('slow')
.siblings('.tgl:visible').slideToggle('fast');
$(this).toggleText('Revelar','Esconder')
.siblings('span').next('.tgl:visible').prev()
.toggleText('Revelar','Esconder')
});
})
</script>
<!--ScriptjQuery Toggle revelar esconder Final--> 
         e para você que é fanatica por tutorial como eu visite o blog dela!! (www) 
  Atençãotoda vez que você for usar esse efeito você deve colocar isso no seu html de seu post:

 <div id="box-toggle">
<div class="tgl">
Coloque aqui o conteúdo que ficará Oculto
</div>
</div> 
espero que eu tenha ajudado beijos cutes!!

1 comentários:

  1. Adorei o tutu!Bem util, acho q vou acabar tentando...
    Beijokass
    Fer---> http://retardadasdanet.blogspot.com.br/

    ResponderExcluir

*comentarios que não se refere ao post será ignorado
*sem palavrão,por favor