Códigos dos gadgets

15/12/2016 || Postado por || Marcadores: ||
Editado inteiramente por Hari: Eu adorei essa imagem e vou protegê-la. Aqui é onde estão os códigos de todos os gadgets, tentei explicar o máximo que consegui, mas se ainda tiverem alguma dúvida de como faz alguma coisa que está aqui, é só deixar um comentário nesse post mesmo ou no meu blog oficial -Diário de uma Otome- que vou ficar feliz em responder, ok? Agora vou só completar o espacinho da postagem pra ficar alinhado perfeitamente -porque eu sou bem perfeccionista-. Olha esse Yurio, minha gente, ele arrasa demais, sério... Aqueles seis saltos na última parte da coreografia foi de pirar com qualquer um, aposto que todo mundo pirou quando viu ele acertando e tals, foi lindo demais... Enfim, acho que já completei as linhas que tenho que completar, fiquem com o post!

PRIMEIRO GADGET - de cima
CABEÇALHO
<div style="margin-top: 10px; margin-left: -354px;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQqu9TSANo-Pn8cLnEnDacMx7eToy_oLhp4ua32JcLu3mP5NMLpsRcaWF3VzlsZGcLar36fRLW-fOYgsAtQHdf6mVIl0Zi3P-UzV43Hx0E2w4M4MrBuxa4ENFkbIci9y0auUakpG4Xc3k/s1600/base+back1111.png" /></div>

MENU EM BAIXO DO CABEÇALHO
<div style='margin-top: -4px; margin-bottom: 3px; margin-left: -354px;' class='menu-border-bottom-isa'><a href='LINK' title='TOOLTIP'>NOME</a><symbol>❄</symbol>
<a href='LINK' title='TOOLTIP'>NOME</a><symbol>❄</symbol>
<a href='LINK' title='TOOLTIP'>NOME</a><symbol>❄</symbol>
<a href='LINK' title='TOOLTIP'>NOME</a><symbol>❄</symbol>
<a href='LINK' title='TOOLTIP'>NOME</a><symbol>❄</symbol>
<a href='LINK' title='TOOLTIP'>NOME</a><symbol>❄</symbol>
<a href='LINK' title='TOOLTIP'>NOME</a><symbol>❄</symbol>
<a href='LINK' title='TOOLTIP'>NOME</a><symbol>❄</symbol>
<a href='LINK' title='TOLLTIP'>NOME</a></div>

PRIMEIRO GADGET - esquerda
Gadget de seguidores normal.

MARCADORES - direita
CAIXA DE PESQUISA
<form action="/search" class="search" method="get"><input class="searchbar" id="s" name="q" type="text" placeholder='Se perdeu? Digite o que procura!' value="" /></form>

MENU DE MARCADORES
<div id="menuca"><div class="menuca"><a href="LINK" >NOME</a></div>
<div class="menuca2"><a href="LINK" >NOME</a></div>
<div class="menuca"><a href="LINK" >NOME</a></div>

<div class="menuca2"><a href="LINK" >NOME</a></div>
<div class="menuca2"><a href="LINK" >NOME</a></div>
<div class="menuca"><a href="LINK" >NOME</a></div>

<div class="menuca2"><a href="LINK" >NOME</a></div>
<div class="menuca"><a href="LINK">NOME</a></div>
<div class="menuca"><a href="LINK">NOME</a></div>

<div class="menuca2"><a href="LINK" >NOME</a></div>
<div class="menuca"><a href="LINK">NOME</a></div>
<div class="menuca2"><a href="LINK" >NOME</a></div>

<div class="menuca"><a href="LINK">NOME</a></div>
<div class="menuca2"><a href="LINK" >NOME</a></div>
<div class="menuca"><a href="LINK">NOME</a></div>
</div>
Aqui você adiciona ou remove os códigos de três em três, já deixei eles em grupos para facilitar.

AFILIADOS - direita
MENU DE AFILIADOS
<center><div id="popup" class="popup"><p><center><div style="position: absolute; margin-top: -20px; left:17px;z-index:;">
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
<a href='LINK'><afiliados>NOME</afiliados></a>
</div></center></p><script type="text/javascript">   function fechar(){
     document.getElementById('popup').style.display = 'none';
   }
   function abrir(){
     document.getElementById('popup').style.display = 'block';
     setTimeout ("fechar()", 10000);
   }
  </script><p><small class="fechar"><a href="javascript: fechar();">
<exit>FECHE A CAIXA</exit></a></small></p></div><p><a href="javascript: abrir();"><open><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgutq0_ZSgcJrxrX2nSXid5L1jtZpl3xoN0MVmUCRKTP2garis_PRm6Buy1z50L1D__8-Nw2Bbkr_fffzdqP0e-_qakch-yJxU2Xq5L7xBBbmh3IrGjR-g9SOq2vXXvkOnVmWjNrqShxhc/s1600/clique.png" /></open></a><a href="javascript: fechar();"></a></p></center><div id="popup" class="popup"><p><center><div style="margin-left: 21px; margin-top: -33px;"><div class="barra">Titulo</div></div></center></p></div>
No começo do código está um código sublinhado, ele indica a posição que a caixa vai aparecer, se não souber o que está fazendo, não mexa nele. No final do código, tem um item em negrito, é o texto para o botão que vai fechar a caixa que aparece. O código em itálico é apenas a URL da imagem, se quiser outra, é só substituir por outra URL.

BOTÃO DE UP/SUBIR
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaS2hGVO6cKjm9p9eWlr0g4eY47rzi5sJ3gsQrexnOtip0oFDSQFsk6Pqq-Zg9z_DUKDhmP7RAFyFis2O4VWyAkheb6ce1GRePCHjgGdC_V-xLRT1AlkAEFWRczHFS3-2juIozM1a4qAs/s1600/up+do+amor.png"/>', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
controlattrs: {offsetx:5, offsety:5}, //offset of control relative to left/ 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, left:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
.attr({title:'Up do amor <3'})
.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>
No começo do código, há um texto em negrito, ele é apenas a URL da imagem de up, se quiser trocar, é só substituir pela URL da imagem que você quer. Quase no finalzinho tem um código sublinhado que indica o texto quando você passa o mouse na imagem.

NEVE NO BLOG
<script src="http://static.tumblr.com/8l2gpxb/lcllulgcn/snowstorm.js"></script>

Fim! Eu sei que o penúltimo código é imenso, mas ele não possui quase nada a ser modificado, é bem simples de editar. Se você não quiser, nem precisa editá-lo. 

Nenhum comentário:

Postar um comentário