O layout contém


Tumblr_mfc6jvyxxb1s0si72o1_500_large
Espero que gostem desse layout, fiz com base em um layout free do blog We Heart HTML, mais não retire meus créditos :)
Créditos que usei no layout: PG - KW - WHH - CB - PH - DMK
-----------------
 O layout contém:
Negrito, sublinhado, tachado e itálico personalizados em hover (sem hover transição)
Seleção colorida
Barra de rolagem personalizada
Menu Express
Data personalizada
Navbar retirada
Assinar postagens 'atom' retirado
Blockquote personalizado em hover
Barra de créditos
Paginação em hover
Leia mais em hover
Título de gadget personalizado
Título de postagem Personalizado
Efeito WOW em afiliados e blogroll
Menu de Abas
Slide no cabeçalho
Dois backgrounds
Área de comentários personalizada
Efeito turvo nas imagens de post (automático)
Clique em leia mais e saiba como usar o slide e o blogroll

  • Como usar o slide:

Cole isso em um gadget HTML / Javascript:
Vocês podem perceber que logo no início do código, tem uns números em itálico e negrito, irei explicar, o que está em negrito determina a altura do slide, e o itálico, a largura do slide entre a barra lateral.


<div style="position: absolute; margin-top: -305px; left: -580px;"><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
var fadeimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]=["http://3.bp.blogspot.com/-akEoN7NwKBg/USFQB2rFa2I/AAAAAAAADYU/H4R9Q5894Ng/s1600/Kim2.png"] //plain image syntax
fadeimages[1]=["http://4.bp.blogspot.com/-CWVCg47wAeo/USFQDIi4tVI/AAAAAAAADYc/dXkx7IjUDzg/s1600/Kim1.png"] //image with link syntax
fadeimages[2]=["http://4.bp.blogspot.com/-my5VGIV-o1E/USFQDy_Gx9I/AAAAAAAADYk/N-3iv-ztdYQ/s1600/Kim3.png"] //plain image syntax
fadeimages[3]=["http://3.bp.blogspot.com/-AAYikHPeyOc/USFQE6MWHAI/AAAAAAAADYs/m3ZNDVaBCZ0/s1600/Kim4.png"] //plain image syntax

var fadebgcolor="white"
////NO need to edit beyond here/////////////
var fadearray=new Array() //array to cache fadeshow instances
var fadeclear=new Array() //array to cache corresponding clearinterval pointers
var dom=(document.getElementById) //modern dom browsers
var iebrowser=document.all
function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder){
this.pausecheck=pause
this.mouseovercheck=0
this.delay=delay
this.degree=10 //initial opacity degree (10%)
this.curimageindex=0
this.nextimageindex=1
fadearray[fadearray.length]=this
this.slideshowid=fadearray.length-1
this.canvasbase="canvas"+this.slideshowid
this.curcanvas=this.canvasbase+"_0"
if (typeof displayorder!="undefined")
theimages.sort(function() {return 0.3 - Math.random();}) //thanks to Mike (aka Mwinter) :)
this.theimages=theimages
this.imageborder=parseInt(borderwidth)
this.postimages=new Array() //preload images
for (p=0;p<theimages.length;p++){
this.postimages[p]=new Image()
this.postimages[p].src=theimages[p][0]
}
var fadewidth=fadewidth+this.imageborder*2
var fadeheight=fadeheight+this.imageborder*2
if (iebrowser&&dom||dom) //if IE5+ or modern browsers (ie: Firefox)
document.write('<div id="master'+this.slideshowid+'" style="position:relative;width:'+fadewidth+'px;height:'+fadeheight+'px;overflow:hidden;"><div id="'+this.canvasbase+'_0" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div><div id="'+this.canvasbase+'_1" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div></div>')
else
document.write('<div><img name="defaultslide'+this.slideshowid+'" src="'+this.postimages[0].src+'"></div>')
if (iebrowser&&dom||dom) //if IE5+ or modern browsers such as Firefox
this.startit()
else{
this.curimageindex++
setInterval("fadearray["+this.slideshowid+"].rotateimage()", this.delay)
}
}
function fadepic(obj){
if (obj.degree<100){
obj.degree+=10
if (obj.tempobj.filters&&obj.tempobj.filters[0]){
if (typeof obj.tempobj.filters[0].opacity=="number") //if IE6+
obj.tempobj.filters[0].opacity=obj.degree
else //else if IE5.5-
obj.tempobj.style.filter="alpha(opacity="+obj.degree+")"
}
else if (obj.tempobj.style.MozOpacity)
obj.tempobj.style.MozOpacity=obj.degree/101
else if (obj.tempobj.style.KhtmlOpacity)
obj.tempobj.style.KhtmlOpacity=obj.degree/100
else if (obj.tempobj.style.opacity&&!obj.tempobj.filters)
obj.tempobj.style.opacity=obj.degree/101
}
else{
clearInterval(fadeclear[obj.slideshowid])
obj.nextcanvas=(obj.curcanvas==obj.canvasbase+"_0")? obj.canvasbase+"_0" : obj.canvasbase+"_1"
obj.tempobj=iebrowser? iebrowser[obj.nextcanvas] : document.getElementById(obj.nextcanvas)
obj.populateslide(obj.tempobj, obj.nextimageindex)
obj.nextimageindex=(obj.nextimageindex<obj.postimages.length-1)? obj.nextimageindex+1 : 0
setTimeout("fadearray["+obj.slideshowid+"].rotateimage()", obj.delay)
}
}
fadeshow.prototype.populateslide=function(picobj, picindex){
var slideHTML=""
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML='<a href="http://www.google.com" target="'+this.theimages[picindex][2]+'">'
slideHTML+='<img src="'+this.postimages[picindex].src+'" border="'+this.imageborder+'px">'
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML+='</a>'
picobj.innerHTML=slideHTML
}
fadeshow.prototype.rotateimage=function(){
if (this.pausecheck==1) //if pause onMouseover enabled, cache object
var cacheobj=this
if (this.mouseovercheck==1)
setTimeout(function(){cacheobj.rotateimage()}, 100)
else if (iebrowser&&dom||dom){
this.resetit()
var crossobj=this.tempobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
crossobj.style.zIndex++
fadeclear[this.slideshowid]=setInterval("fadepic(fadearray["+this.slideshowid+"])",50)
this.curcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0"
}
else{
var ns4imgobj=document.images['defaultslide'+this.slideshowid]
ns4imgobj.src=this.postimages[this.curimageindex].src
}
this.curimageindex=(this.curimageindex<this.postimages.length-1)? this.curimageindex+1 : 0
}
fadeshow.prototype.resetit=function(){
this.degree=10
var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
if (crossobj.filters&&crossobj.filters[0]){
if (typeof crossobj.filters[0].opacity=="number") //if IE6+
crossobj.filters(0).opacity=this.degree
else //else if IE5.5-
crossobj.style.filter="alpha(opacity="+this.degree+")"
}
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=this.degree/101
else if (crossobj.style.KhtmlOpacity)
crossobj.style.KhtmlOpacity=this.degree/100
else if (crossobj.style.opacity&&!crossobj.filters)
crossobj.style.opacity=this.degree/101
}
fadeshow.prototype.startit=function(){
var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
this.populateslide(crossobj, this.curimageindex)
if (this.pausecheck==1){ //IF SLIDESHOW SHOULD PAUSE ONMOUSEOVER
var cacheobj=this
var crossobjcontainer=iebrowser? iebrowser["master"+this.slideshowid] : document.getElementById("master"+this.slideshowid)
crossobjcontainer.onmouseover=function(){cacheobj.mouseovercheck=1}
crossobjcontainer.onmouseout=function(){cacheobj.mouseovercheck=0}
}
this.rotateimage()
}
</script>
<script type="text/javascript">
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
</script>
<td background="http://3.bp.blogspot.com/-AAYikHPeyOc/USFQE6MWHAI/AAAAAAAADYs/m3ZNDVaBCZ0/s1600/Kim4.png" width="200" height="274" alt="">
<script type="text/javascript">//new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder)
new fadeshow(fadeimages, 200, 274, 0, 2000, 1, "R")</script></td></div>

E para usar o blogroll cole isso em um gadgets Html / Javascript:
Vocês podem perceber que logo no início do código, tem uns números em itálico e negrito como no slide, irei explicar mais uma vez, pois não tem segredo, funciona da mesma forma, o que está em negrito determina a altura do blogroll, e o itálico, a largura do blogroll entre a barra lateral.
<div style="position: absolute; margin-top: -390px; left: +26px;"><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://3.bp.blogspot.com/-b_PV_lMoJXw/UOXJXZCmG7I/AAAAAAAAp5c/8P-8dsBDTSg/s1600/33.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://3.bp.blogspot.com/-b_PV_lMoJXw/UOXJXZCmG7I/AAAAAAAAp5c/8P-8dsBDTSg/s1600/33.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://3.bp.blogspot.com/-b_PV_lMoJXw/UOXJXZCmG7I/AAAAAAAAp5c/8P-8dsBDTSg/s1600/33.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://3.bp.blogspot.com/-b_PV_lMoJXw/UOXJXZCmG7I/AAAAAAAAp5c/8P-8dsBDTSg/s1600/33.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://3.bp.blogspot.com/-b_PV_lMoJXw/UOXJXZCmG7I/AAAAAAAAp5c/8P-8dsBDTSg/s1600/33.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://4.bp.blogspot.com/-YJaWmqRv4xA/UOXKqlrTAuI/AAAAAAAAp58/sZHZfiWnNX4/s1600/37.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://4.bp.blogspot.com/-YJaWmqRv4xA/UOXKqlrTAuI/AAAAAAAAp58/sZHZfiWnNX4/s1600/37.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://4.bp.blogspot.com/-YJaWmqRv4xA/UOXKqlrTAuI/AAAAAAAAp58/sZHZfiWnNX4/s1600/37.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://4.bp.blogspot.com/-YJaWmqRv4xA/UOXKqlrTAuI/AAAAAAAAp58/sZHZfiWnNX4/s1600/37.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://4.bp.blogspot.com/-YJaWmqRv4xA/UOXKqlrTAuI/AAAAAAAAp58/sZHZfiWnNX4/s1600/37.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://4.bp.blogspot.com/-ZRWGYgE0gJU/UOXNRe5zMpI/AAAAAAAAp7Q/upXS03tEiTo/s1600/41.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://4.bp.blogspot.com/-ZRWGYgE0gJU/UOXNRe5zMpI/AAAAAAAAp7Q/upXS03tEiTo/s1600/41.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://4.bp.blogspot.com/-ZRWGYgE0gJU/UOXNRe5zMpI/AAAAAAAAp7Q/upXS03tEiTo/s1600/41.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://4.bp.blogspot.com/-ZRWGYgE0gJU/UOXNRe5zMpI/AAAAAAAAp7Q/upXS03tEiTo/s1600/41.png" class="efeitowow" /></a><a href="LINK DO BLOG AFILIADO" title="NOME DO BLOG AFILIADO"><img src="http://4.bp.blogspot.com/-ZRWGYgE0gJU/UOXNRe5zMpI/AAAAAAAAp7Q/upXS03tEiTo/s1600/41.png" class="efeitowow" /></a></div>

36 comentários

  1. Estou com problemas com o cabeçalho =c Ao invés de estar o cabeçalho, estão os posts, você pode me ajudar? http://dudaahs-place.blogspot.com

    ResponderExcluir
  2. Perfeito ^^ obrigada por fazer esse lay divo *-*
    Usaando ^^
    Bjos!

    ResponderExcluir
  3. Respostas
    1. De nada flor, que bom que amou, por que eu achei que vocês não iriam gostar tanto... :l

      Excluir
  4. Oiee, amei o layout, mas eu estou tendo alguns problemas pra instalar ele :(
    O cabeçalho não aparece, e nem o "welcome"
    Acho que foi por que uma mulher se ofereceu para colocar um layout feito por ela no meu blog, e ela começou a arrumar mas nunca terminou, ai eu não sei no que ela mexeu, mas eu acho que foi no html da estrutura do blog, e ai nenhum layout que eu tento colocar da certo e fica
    com algumas partes do tal layout dela!
    Se puder me ajudar, agradeço :**
    Me manda um e-mail se puder: juh6545@gmail.com
    ou julinha_unai@hotmail.com

    ResponderExcluir
    Respostas
    1. Ok, irei te falar, mais acho que é só você colocar para reverter pra modelo padrão, se quiser eu mexo pra vc ;)

      Excluir
  5. Por favor me ajuda!
    Vou baixar mas abre uma pagina no Internet Explorer que diz ''ERROR''
    por favor me responde?
    Entre em contato no pelo email gabrielascooby@hotmail.com. Por favor, beeijos

    http://girlswithstyles.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Aí eu não sei, deve ser erro de seu computador ou internet.

      No meu deu certo: http://www.4shared.com/document/864-MpDh/template-6263391334420977003.html? vê se dá agr :l

      Excluir
  6. Megan,adoro seu blog.
    Estou levando este Layout ,não sei se vou conseguir configurar.
    Meu blog está tão feio...kkk...
    Parabéns sucesso para vocês,bjs
    www.gracatricoecroche.com

    ResponderExcluir
  7. Irei usar em meu blog novo, adorei. :)

    ResponderExcluir
  8. Peguei e fiz algumas alterações. Tipo não consegui colocar slide e tudo mais. Ai só deixei meu cabeçalho com o restante desse blog. Creditos lá. Espero que não tenha problema. Beijos

    ResponderExcluir
  9. Peguei.Mais fiz algumas alterações té ^ ^

    Kissus :*

    ResponderExcluir
  10. O que eu mais gostei foi o efeito das imagens ficou show :3

    ResponderExcluir
  11. Vou usar! Comentei na página de layouts free (http://adolescentenerd.blogspot.com.br/p/layout-free.html) espero que não se importe. Amei seu blog, abraços :)

    ResponderExcluir