O título do
teu blog

28 março 2015

Instalar o layout códigos + Download

Comentários: ||
E então o que acharam do tema? Neste eu criei algumas opções de gadgets da sidebar, por exemplo, o menu das tags tem duas versões, um com imagens e a outra normal, quem não quiser a de imagens pode colocar só a outra ou vice-versa (^^), fiz o mesmo com a despedida caso queiram link's ou não...

Download do Layout (aqui)

1. Primeiro gadget "Apresentação"
<div style="left: 239px; margin-top: 7px; position: absolute; right: 0px; width: 102px; z-index: 100; "><a href="Link" imageanchor="1"><img border="0" class="SHAKE" src="http://3.bp.blogspot.com/-L6pGWNlRiHc/VRX2rKX3HXI/AAAAAAAAA7M/rxK-14EYJLI/s1600/b.png" /></a><br /><a href="Link" imageanchor="1"><img border="0" class="SHAKE" src="http://4.bp.blogspot.com/-WfZ2OLlyjPg/VRX1wQfvSKI/AAAAAAAAA60/taoPcy4oOHY/s1600/e.png" /></a> <br /><a href="Link" imageanchor="1"><img border="0" class="SHAKE" src="http://1.bp.blogspot.com/-hpRMYm42gVc/VRX4B-TJf8I/AAAAAAAAA7s/llt6AOYeE4E/s1600/AS.png" /></a><br /> <a href="Link" imageanchor="1"><img border="0" class="SHAKE" src="http://1.bp.blogspot.com/-1itrHSwn9YI/VRX24p9qXFI/AAAAAAAAA7U/9sdm1knSX60/s1600/lk.png" /></a></div><img border="0" src="http://i694.photobucket.com/albums/vv301/MinnieChun/fx%20NU%20ABO%20concept%20pics/b_22.jpg" style="margin-top: 5px; border-left: 1px dotted #dcdcdc;" width="85%"/> <div style="text-align: justify;">Escreve aqui a apresentação</div>

2. Segundo gadget "Menu tags com imagens"
<center style="margin-top: 5px; margin-left: -0px; margin-right: -3px; "><a href="Link" imageanchor="1"><img border="0" src="http://1.bp.blogspot.com/-lMdSK_SCiCY/VRXzpbgCvpI/AAAAAAAAA6U/_POlZBRbt60/s1600/n.png" /></a> <a href="Link" imageanchor="1"><img border="0" src="http://2.bp.blogspot.com/-es_y_2i_MvI/VRX0QypDjJI/AAAAAAAAA6k/xQBjShXmTtU/s1600/m.png" /></a> <a href="Link" imageanchor="1"><img border="0" src="http://3.bp.blogspot.com/-cm0NvHTeXV8/VRX0r3gpgZI/AAAAAAAAA6s/bKfB6tYBnQI/s1600/w.png" /></a>
<a href="Link" imageanchor="1"><img border="0" src="http://3.bp.blogspot.com/-xM1oB0_xUE4/VRXz5mOD4cI/AAAAAAAAA6c/GC2DcCCO9rY/s1600/q.png" /></a> <a href="Link" imageanchor="1"><img border="0" src="http://4.bp.blogspot.com/-WfZ2OLlyjPg/VRX1wQfvSKI/AAAAAAAAA60/taoPcy4oOHY/s1600/e.png" /></a> <a href="Link" imageanchor="1"><img border="0" src="http://3.bp.blogspot.com/-u_MHT6P8QZs/VRX2DSWNQfI/AAAAAAAAA68/Cp_S6mt-Z38/s1600/qq.png" /></a> <a href="Link" imageanchor="1"><img border="0" src="http://1.bp.blogspot.com/-Y0jpG6ON_nY/VRX2dSc9V-I/AAAAAAAAA7E/BLq7X5a857E/s1600/l.png" /></a> <a href="Link"><img border="0" src="http://4.bp.blogspot.com/-oLRc0uH19FI/VRbe4dxkSMI/AAAAAAAAA_A/H34888Qk-sk/s1600/LLK.png" /></a> <a href="Link"><img border="0" src="http://2.bp.blogspot.com/-_Bc49gFdI3c/VRbf5Zrpz4I/AAAAAAAAA_M/9cdQw4CVxCo/s1600/CO.png" /></a> <a href="Link"><img border="0" src="http://1.bp.blogspot.com/-qXbM5CmpnUM/VRbgq-JvBVI/AAAAAAAAA_U/Ji-p0RAJKUE/s1600/sm.png" /></a> <a href="Link"><img border="0" src="http://4.bp.blogspot.com/-LaUjBLwZmcQ/VRbg247RxLI/AAAAAAAAA_c/ITEKiD9UW_I/s1600/f.png" /></a> <a href="Link"><img border="0" src="http://2.bp.blogspot.com/-NkVM-AjWA04/VRbhKgkmJ4I/AAAAAAAAA_k/Y3DSr3QZ1bE/s1600/0.png" /></a> <a href="Link"><img border="0" src="http://3.bp.blogspot.com/-M0uVJSoKQsY/VRbidm5Kd2I/AAAAAAAAA_w/SxLj3V-Ky_s/s1600/fo.png" /></a> <a href="Link"><img border="0" src="http://4.bp.blogspot.com/-mki7GmGWy3o/VRbi3r80RkI/AAAAAAAAA_4/4Ieykkvv40E/s1600/NN.png" /></a> <form action="/search" method="get"><input type="text" name="q" value="Procure + Enter"/></form> <a href="Link" imageanchor="1"><img border="0" src="http://3.bp.blogspot.com/-L6pGWNlRiHc/VRX2rKX3HXI/AAAAAAAAA7M/rxK-14EYJLI/s1600/b.png" /></a> <a href="Link" imageanchor="1"><img border="0" src="http://1.bp.blogspot.com/-1itrHSwn9YI/VRX24p9qXFI/AAAAAAAAA7U/9sdm1knSX60/s1600/lk.png" /></a> <a href="Link" imageanchor="1"><img border="0" src="http://4.bp.blogspot.com/-TLFsrdoSJmw/VRX3lX6t0HI/AAAAAAAAA7c/s8PtM6vRIrI/s1600/c.png" /></a> <a href="Link" imageanchor="1"><img border="0" src="http://4.bp.blogspot.com/-PyaIjrZy_ww/VRX32Q44xvI/AAAAAAAAA7k/jN4SU4Ja9DA/s1600/fds.png" /></a> <a href="Link" imageanchor="1"><img border="0" src="http://1.bp.blogspot.com/-hpRMYm42gVc/VRX4B-TJf8I/AAAAAAAAA7s/llt6AOYeE4E/s1600/AS.png" /></a> <a href="Link" imageanchor="1"><img border="0" src="http://1.bp.blogspot.com/-OsGy4XKkZXg/VRX4MvrAmCI/AAAAAAAAA70/TRAVUfsoGh0/s1600/SD.png" /></a> <a href="#" imageanchor="1"><img border="0" src="http://3.bp.blogspot.com/-EK45YQPDg04/VRX5Mp_8y2I/AAAAAAAAA78/prBS373ZeaI/s1600/nb.png" /></a>
<a href="Link" imageanchor="1" style=""><img border="0" src="http://2.bp.blogspot.com/-z3F9W5jEQRY/VRX5mJEbZxI/AAAAAAAAA8E/eUPbgZCeB8s/s1600/wq.png" /></a> <a href="Link" imageanchor="1" style=""><img border="0" src="http://4.bp.blogspot.com/-zSLvZr2g4Cg/VRX52YH126I/AAAAAAAAA8M/wgC8Ggccirs/s1600/FDSA.png" /></a> <a href="Link" imageanchor="1" style=""><img border="0" src="http://1.bp.blogspot.com/-er1IbHaMwIE/VRX6PMyYJGI/AAAAAAAAA8U/1ld7X9mcS9M/s1600/O.png" /></a> <a href="Link" imageanchor="1" style=""><img border="0" src="http://3.bp.blogspot.com/-pFFqbUgQIjg/VRbGsimxZ0I/AAAAAAAAA98/bJU50atQed8/s1600/j.png" /></a> <a href="Link" ><img border="0" src="http://2.bp.blogspot.com/-IlTfsSpIZQk/VRbdQbfJOPI/AAAAAAAAA-c/sY0PHDSmBZg/s1600/x.png" /></a> <a href="Link" ><img border="0" src="http://2.bp.blogspot.com/-xIxtyd3usZE/VRbdWYNNdVI/AAAAAAAAA-k/1hF9kWYV2Fg/s1600/ccc.png" /></a> <a href="Link"><img border="0" src="http://1.bp.blogspot.com/-jWPJwz6AUhM/VRbdrLvvORI/AAAAAAAAA-s/d9dgcyUJ_nA/s1600/s.png" /></a>

2. Segundo gadget "Menu tags sem imagens"
<center style="margin-top: 5px; margin-left: -0.5px; margin-right: -3px; "><a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a> <a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a><form action="/search" method="get"><input type="text" name="q" value="Procure + Enter"/></form><a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a> <a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a>&nbsp;<a href="Link"><nice>Nome</nice></a></center> 

3. Terceiro gadget "Bye bye" sem link's
<img border="0" src="http://4.bp.blogspot.com/_fDnOMEO_8lg/S-EGRoMyXgI/AAAAAAAAGJo/9hbFBJx9gyA/s1600/Nu+Abo_f(x)09.jpg" style="margin-top: 5px; margin-right: 0px; margin-left: 0px; border-right: 1px dotted #dcdcdc;" width="100%"/> <div style="text-align: justify;">Escreve aqui o texto</div> <div style="left: 30px; margin-top: 15px; position: absolute; right: 0px; width: 230px; z-index: 100; ">Créditos: layout criado por<a href="http://justbubbledays.blogspot.pt/" target="_blank"> Mei Bubble</a></div>

3. Terceiro gadget "Bye Bye V2" com link's
<div style="left: 10px; margin-top: 7px; position: absolute; right: 0px; width: 102px; z-index: 100; "><a href="#" imageanchor="1"><img border="0" class="SHAKE" src="http://3.bp.blogspot.com/-L6pGWNlRiHc/VRX2rKX3HXI/AAAAAAAAA7M/rxK-14EYJLI/s1600/b.png" /></a><br /><a href="#" imageanchor="1"><img border="0" class="SHAKE" src="http://4.bp.blogspot.com/-WfZ2OLlyjPg/VRX1wQfvSKI/AAAAAAAAA60/taoPcy4oOHY/s1600/e.png" /></a> <br /><a href="#" imageanchor="1"><img border="0" class="SHAKE" src="http://1.bp.blogspot.com/-hpRMYm42gVc/VRX4B-TJf8I/AAAAAAAAA7s/llt6AOYeE4E/s1600/AS.png" /></a> <br /> <a href="#" imageanchor="1"><img border="0" class="SHAKE" src="http://1.bp.blogspot.com/-1itrHSwn9YI/VRX24p9qXFI/AAAAAAAAA7U/9sdm1knSX60/s1600/lk.png" /></a></div><img border="0" src="http://4.bp.blogspot.com/_fDnOMEO_8lg/S-EGRoMyXgI/AAAAAAAAGJo/9hbFBJx9gyA/s1600/Nu+Abo_f(x)09.jpg" style="margin-top: 5px; margin-right: 0px; margin-left: 39px; border-right: 1px dotted #dcdcdc;" width="85%"/> <div style="text-align: justify;">Escreve aqui o texto</div><div style="left: 30px; margin-top: 15px; position: absolute; right: 0px; width: 230px; z-index: 100; ">Créditos: layout criado por<a href="http://justbubbledays.blogspot.pt/" target="_blank"> Mei Bubble</a></div>

5. "Cabeçalho"
<div style="left: 130px; margin-top: -310px; position: absolute; right: 0px; width: 102px; z-index: 100; "><img border="0" src="http://3.bp.blogspot.com/-kb_QvSo_Ww4/VRYS-kxvm2I/AAAAAAAAA9o/ADk1kjMHz9M/s1600/cab.png"  /></div> <div style="left: 230px; margin-top: -250px; position: absolute; right: 0px; width: 302px; z-index: 100; "><div class="titulo"> O título do <br />teu blog</div></div>

Código. Este é o código do botão de voltar ao topo, coloca no final de um gadget qualquer.
<script type='text/javascript' language='Javascript'>
var scrolltotop={
//startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
//scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (1=top).
setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
controlHTML: '<img src="http://3.bp.blogspot.com/-lPe8AUvY_0A/VRbeiYXG7LI/AAAAAAAAA-4/IgoBUehfkNI/s1600/UP.png" title="Voltar ao topo" style="margin-bottom: 20px;"/>', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ center of window corner
anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
state: {isvisible:false, shouldvisible:false},
scrollup:function(){
if (!this.cssfixedsupport) //if control is positioned using JavaScript
this.$control.css({opacity:0}) //hide control immediately after clicking it
var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists
dest=jQuery('#'+dest).offset().top
else
dest=0
this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
},
keepfixed:function(){
var $window=jQuery(window)
var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
this.$control.css({left:controlx+'px', top:controly+'px'})
},
togglecontrol:function(){
var scrolltop=jQuery(window).scrollTop()
if (!this.cssfixedsupport)
this.keepfixed()
this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
if (this.state.shouldvisible && !this.state.isvisible){
this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
this.state.isvisible=true
}
else if (this.state.shouldvisible==false && this.state.isvisible){
this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
this.state.isvisible=false
}
},
init:function(){
jQuery(document).ready(function($){
var mainobj=scrolltotop
var iebrws=document.all
mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
.css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
.attr({title:''})
.click(function(){mainobj.scrollup(); return false})
.appendTo('body')
if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text
mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text
mainobj.togglecontrol()
$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
mainobj.scrollup()
return false
})
$(window).bind('scroll resize', function(e){
mainobj.togglecontrol()
})
})
}
}
scrolltotop.init()
</script>

3 comentários:

  1. Vou usar, ele é muito. Só queria saber se posso trocar o tema do F(x) e por o G-Dragon? Prometo não tirar os créditos, viu?

    Sou do Aegyo Pudim.

    ResponderEliminar
    Respostas
    1. Desculpa Letícia >.< só agora vi o seu comentário, que erro enorme! É claro que podes mudar as imagens, o que interessa é que gostes do tema que estás a usar ^^
      Mais uma vez desculpa! bye e kiss kiss da Mei.

      Eliminar
  2. Este comentário foi removido pelo autor.

    ResponderEliminar