2/20/2015

Votei! + Layout Free - Cute Dreams

Oie pessoal! Sumi de novo né? Desculpem. É que estou fazendo um curso que tá tomando muito tempo. Mas vou pelo menos tentar postar uma vez por semana! Prometo, podem bater em mim se eu não postar heuahu'. Mas pra recompensar meu sumiço hoje eu trouxe um layout free super fofinho. Na minha opinião foi o melhor que fiz até hoje! Leia tudo e veja, abores <3



REGRINHAS:
imageNão diga que você quem fez.
imageNão faça alterações que mudem completamente o layout.
imageNão use elementos desse layout em outro. Muitos dos menus e efeitos não foram criados por mim, e sim pelos blogs que creditei. Gostou de algum? Procure lá.
imageNão retire os créditos


image

CONFIGURAÇÕES DO LAYOUT:

image

Cabeçalho

image No cabeçalho do layout, o nome do blog será automático, não precisa editar a imagem.



image

Menu de páginas do cabeçalho

imageAdicione um gadget HTML/JavaScript  ABAIXO do cabeçalho e cole:
<div style="position: absolute; margin-top: -90px; left: 505px;">
<a href="LINK" title="NOME DA PÁGINA"><img src="http://media.tumblr.com/tumblr_lmj5vjWYQ01qjz9g6.gif" class="lol" /></a>
<a href="LINK" title="NOME DA PÁGINAt"><img src="http://media.tumblr.com/tumblr_lmj5vnlvJZ1qjz9g6.gif" class="lol" /></a>
<a href="LINK" title="NOME DA PÁGINA"><img src="http://media.tumblr.com/tumblr_lmj5vjWYQ01qjz9g6.gif" class="lol" /></a><br />
<a href="LINK" title="NOME DA PÁGINA"><img src="http://media.tumblr.com/tumblr_lmj5vnlvJZ1qjz9g6.gif" class="lol" /></a>
<a href="LINK" title="NOME DA PÁGINA"><img src="http://media.tumblr.com/tumblr_lmj5vjWYQ01qjz9g6.gif" class="lol" /></a>
<a href="LINK" title="NOME DA PÁGINA"><img src="http://media.tumblr.com/tumblr_lmj5vnlvJZ1qjz9g6.gif" class="lol" /></a></div>
image

Gadget Welcome


imageAdicione um gadget HTML/JavaScript e cole:
<img class="blur"
 src="http://www.u.arizona.edu/~patricia/cute-collection/cats/nk16.gif"
 align="left" />
<div style="text-align: justify;">
ESCREVA AQUI SOBRE VOCÊ OU SEU BLOG, UMA BREVE INTRODUÇÃO.</div>
<center><a href="LINK DO SEU TUMBLR" title="Tumblr"><img src="http://fc03.deviantart.net/fs70/f/2014/007/8/5/pink_tumblr_by_undeadzombiie-d718qz8.png" class="bb" /></a>
<a href="LINK DO SEU FACEBOOK" title="Facebook"><img src="http://fc03.deviantart.net/fs70/f/2014/007/6/f/pink_facebook_by_undeadzombiie-d718r0l.png" class="bb" /></a>
<a href="LINK DO SEU INSTAGRAM" title="Instagram"><img src="http://fc09.deviantart.net/fs70/f/2014/007/f/8/pink_instagram_by_undeadzombiie-d718r07.png" class="bb" /></a>
<a href="LINK DO SEU TWITTER" title="Twitter"><img src="http://fc06.deviantart.net/fs70/f/2014/007/a/6/pink_twitter_by_undeadzombiie-d7193kg.png" class="bb" /></a></center>
<center><form action="/search" method="get"><input type="text" name="q" placeholder='Perquise aqui!'value=""/></form></center>
imageSubstitua onde está destacado em itálico.

imageO link que está tachado é o link do gif, se quiser trocá-lo, substitua o link por outro.

image

Gadget dos afiliados

imageAdicione um gadget HTML/JavaScript e cole:
<center><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a><a href="LINK" title="Nome do Blog"><img src="http://media.tumblr.com/tumblr_majr6hf6901qid2nw.gif" class="cavalga" /></a></center>
imageSubstitua onde está destacado em itálico.

image

Gadget dos marcadores

imageAdicione um gadget HTML/JavaScript e cole:
<a id="tag" href="LINK">TAG</a>
<a id="tag" href="LINK">TAG</a>
<a id="tag" href="LINK">TAG</a>
<a id="tag" href="LINK">TAG</a>
<a id="tag" href="LINK">TAG</a>
<a id="tag" href="LINK">TAG</a>
<a id="tag" href="LINK">TAG</a>
<a id="tag" href="LINK">TAG</a>
<a id="tag" href="LINK">TAG</a>
imageSubstitua onde está destacado em itálico.
LINK = Link do marcador
TAG = Nome do marcador


image

Gadget de despedida

imageAdicione um gadget HTML/JavaScript e cole:
<img class="blur"
 src="http://fc05.deviantart.net/fs70/f/2012/229/7/4/rose_petal_kettle_by_skellytuns-d5bhs3m.png"
 align="right" /><div style="text-align: justify;">
ESCREVA AQUI SEU TEXTO DE DESPEDIDA.</div><center><a href="http://www.blogger.com/follow-blog.g?blogID= NÚMERO DA ID DO SEU BLOG " target="_blank"><img src="http://static.tumblr.com/fhpe3fr/yhVnjyvlw/buttom.png" /></a></center>
<center><a href="javascript:animatedcollapse.toggle('dog')"><img src="http://static.tumblr.com/fhpe3fr/N9jnjyrjp/cr__ditos.png"/></a>
<div id="dog" style="display:none">
<div class="agenda" >www.pixel-soup.tumblr.com</div>
<div class="agenda" >www.pixel-dreams.tumblr.com</div>
<div class="agenda" >www.onedithings.blogspot.com.br</div>
<div class="agenda" >www.adolscentenerd.blogspot.com</div>
<div class="agenda" >www.g-girlie.net</div>
<div class="agenda" >www.bunnycrazy.net</div>
<div class="agenda" >www.prettyanimeblog.blogspot.com/</div>
</div></center>
<br /><br />
imageNesse gadget você vai precisar do número da ID do seu blog para configurar o botão de "Siga o blog". Vou ensinar a encontrar esse número, é bem simples.

Entre em uma área de configuração do seu blog. Como por exemplo, na página para criar uma nova postagem, como no print abaixo:

Notou esse número destacado? Pois bem, você deve copiar esse número e colar onde se pediu o Número da ID do seu blog. Pronto! Lembrando que o seu numero vai ser bem diferente desse.

imageO link que está tachado é o link da imagem, se quiser trocá-la, substitua o link por outro.

imagePeço carecidamente que por favor não retirem os créditos desse gadget. Esses blogs me ajudaram muito e é necessário que eles fiquem aí :3

image

Ilustração do post

imageA frase que está na frente da ilustração de post e a borda da imagem, (clique aqui e veja) não são edições na imagem em si. 
A borda será automática em todas as imagens.
A frase na frente de imagem é legenda. Para colocá-la basta adicionar legenda na edição do post. Como? Simples: carregue a imagem do post, dê um clique duplo nela e clique em adicionar legenda (clique aqui e veja).

imageA imagem de ilustração te o tamanho de 586x84.


image

 Imagem de subir ao topo da página

imageAdicione um gadget HTML/JavaScript e cole:
<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="http://media.tumblr.com/tumblr_lm0dveh1Pm1qhhl5a.gif"/>', //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:'Volte ao topo da página!'})
.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>
image

Você pode conseguir mais gifs fofos aqui e aqui

Espero que tenham gostado! Bye bye!


9 comentários:

  1. Que lay mais perfeito *3* simplesmente amei ^u^
    kisses | http://h-eartofmoon.blogspot.com.br/

    ResponderExcluir
  2. FINALMENTE VOLTOOOOOOU !! o/ Saudades saudades e mais saudades estava deste blog <3 *u*
    perfeito o lay sz
    Paradise ♥ Bunnies ll Se increve no meu canal? ♥

    ResponderExcluir
  3. Layout free lindo da perfeição <3

    Amei e sei como são cursos, mas gosto tanto do meu que choro só de pensar em acabá-lo nesse ano.

    Adolescente Nerd // Oficial [] 彡

    ResponderExcluir
  4. GENTE, ESSE LAY FREE, TÁ PERFEITO AND MARAVILHOSO AND LINDO AND AAAAAAAAAAAAAAAAAAAHH PIREI, Sonhos mesmo ò_ó AUHUHUHSUHAUS'

    [Naka Pyon!] - Visite!

    ResponderExcluir
  5. Olá, quanto tempo! *w* Ainda lembra de mim? Espero que sim, viu? O único curso que fiz foi de música e é muito bom fazer algo que gostamos não é? Mesmo assim, ainda é uma responsabilidade à mais, então seremos compreensívos.

    O lay está mesmo um amor, casei com ele, sério. *3* Um dos melhores que já vi esse ano. <3 Parabéns, tenho certeza que muita gente vai usar.

    Beijos, Empire Kawaii & Quinze Outonos.

    ResponderExcluir
  6. omg que lay mais lindo. Pelo o menos você voltou, e como anda o seu curso?

    Depois Das Quinze

    ResponderExcluir
  7. Olá como vai?
    Curso do que? 'u'
    O layout é muuito fofo, eu adorei os rosas dele. <3 É muito lindo mesmo, parabéns!!
    Beijos,

    http://designer-lovers.blogspot.com.br/

    ResponderExcluir

Oi meus Cats!
Regrinhas dos comentários:

-Sem ofensas a algum leitor, autor ou blog.
-Sem conteúdo ofensivo.
-Deixe o link do seu blog no comentário, que assim que puder retribuirei a visita.
-Pedidos, na Ask.
-Se comentou, volte para ver a resposta do comentário.
-"Seguindo, segue de volta?", aceito, não vejo mal nem um. Mas se não houver nada no comentário a ver com a postagem, o comentário será ignorado.

Comenta, vai?