Olá Ann'ys u-ú
Finalmente eu criei uma ask pro blog , para vocês pedirem os posts quando eu estiver sem ideias como agora, é já tenho o primeiro pedido , pediram pra eu fazer um tutorial de como fazer um layout fofo então eu vou atender esse maravilhoso pedido >3< Peça o seu para pedir é só ir nos últimos gadgets do blog é pedir >3< Eu já tinha uma ask só que eu perdi a senha UAHSUAHSU'' Sou burraney ~ . Esse tutorial será dividido em duas partes , parte 1 e parte 2 .
Na parte 1 tem apenas algumas personalizações básicas, essa imagem e como vai ficar seu layout no tutorial parte 1 mais no tutorial parte dois vai ter mais coisas ^^ Está ansioso (a)?
Na parte 1 tem apenas algumas personalizações básicas, essa imagem e como vai ficar seu layout no tutorial parte 1 mais no tutorial parte dois vai ter mais coisas ^^ Está ansioso (a)?
1 - Para começarmos vamos escolher o modelo travel, aquele do avião para darmos inicio ao nosso tutorial ( imagem )
2 - Depois vamos tirar aquela bordinha do modelo travel, vamos em modelo -> editar Html depois clique nos ''...'' entre <b:skin> e </b:skin> (imagem)
3 - Quando você clicar neles vai abrir um código, logo em seguida clique na área do post do HTML ,depois de Ctrl + F ( lembrando que e ctrl F) e procure por .content-outer .content-cap-top { .
4 - Depois quando encontrar aquele codigo apague as partes destacadas (imagem)
5 - Depois que apagar seu modelo ficará assim (imagem)
7 - Depois crie um post teste , é o post vai ficar transparente (imagem) Mas tem como ajudar, é só ir em modelo -> Personalizar ->Plano de fundo da postagem e colocar branco (imagem)
É aplique ao blog.
8 - Ainda em modelo -> Personalizar . Vamos arrumar o corpo do layout (imagem) -> Depois a largura (imagem) use as mesmas larguras para que o layout fique igual.
Agora vamos para as partes que vão fazer o layout ficar bem personalizado >3<
1.1 - Abaixo de mobile , cole o código (imagem) :
.sidebar .widget h2{background: url(http://2.bp.blogspot.com/-aDxsDweNPyA/UUdvT9ulA1I/AAAAAAAAzc8/DLqDxWHK3wI/s1600/130.png) no-repeat left;margin-top:-14px;margin-left:-32px;margin-bottom:0px;padding:15px;width:150%;overflow:hidden;}
1.1 Cole o codigo abaixo acima de ]]></b:skin>
.feed-links{display:none !important;}
1.2 Cole o codigo abaixo acima de ]]></b:skin>
@font-face { font-family: "pixel"; src: url('http://static.tumblr.com/0xqvkot/7jqmgsn0m/pf_arma_five.ttf'); }
.post-footer-line-1 {
background: #82b1ce;
border: 1px solid #82b1ce;box-shadow: inset 2px 2px 0 #f6d3d3;font-family: 'pixel';font-size: 8px;color: #e5bdbd;margin-top:35px;padding: 3px;text-transform:none;width: 514px;text-align: right;margin-left: -4px;}
1.3 Cole o codigo abaixo acima de ]]></b:skin>
h3.post-title {margin-top: 15px;text-align: center;border-bottom: 1px dotted #ededed;}@font-face { font-family: "bebas neue"; src: url('http://static.tumblr.com/cvlbtjz/cnsln9tpp/bebasneue.otf'); }h3.post-title a {font-family: "bebas neue";color: #86b3d0;font-size: 26px;text-shadow: 0px 0px 1px #82b1ce;letter-spacing: 2px;text-transform: uppercase;-webkit-transition-duration: .90s;font-weight: lighter;}h3.post-title a:hover {color: #82b1ce;-webkit-transition-duration: .90s;}
1.4 Cole o codigo abaixo acima de ]]></b:skin>
@font-face { font-family: "pixel"; src: url('http://static.tumblr.com/0xqvkot/7jqmgsn0m/pf_arma_five.ttf'); }jump-link a {text-align: center; margin 3px;}.jump-link {font-family: pixel;font-size: 8px;color: #000000;padding: 3px;background: #82b1ce;box-shadow: inset 0 0 10px #82b1ce;text-shadow: #82b1ce 0 1px 1px;border-radius: 0px; - BORDA ARREDONDADA-webkit-transition-duration: .50s;}.jump-link:hover {background: #82b1ce;box-shadow: inset 0 0 15px #82b1ce;text-shadow:#82b1ce 0px 1px 1px;-webkit-transition-duration: .50s;
Aguarde a parte 2 do tutorial . Ah, e os códigos tem que esta na mesma sequencia que eu coloquei por que se não dá erro . Beijos!
Ahh Anny,Para De Me Surpreender Assim Menina,Tu Tá Divando Demais,Ta Sambando u.u ! Eu Não gostei do tutorial,eu Amei !!!
ResponderExcluirEu To Quase Terminando o layout do meu blog pra começar a postar,vou usar no layout free,por isso favoritei a página rss (darei os devidos créditos)
Beijinhos | c-diamond.blogspot.com ( Hoje Mesmo,Eu Vou Abrir)
Ah, muito obrigada ^^'
ExcluirTá certo >3<
Cara , vai ficar PERFEITO o layout :3 , quando eu for fazer o meu próximo , vou vir aqui , já salvei nos favoritos :3
ResponderExcluirBeijos !
resenhando--nuvens.blogspot.com.br
*-* Muito obrigada!
ExcluirÓtimo tutorial Anny, super útil para aquelas pessoas com falta de inspiração ou que ainda não sabem como editar um template :3 parabéns!
ResponderExcluirroad to infinity ∞
Ah, muito obrigada .
ExcluirÉ mesmo >3<
Nossa, utilizarei essas dicas no meu próximo lay! Obrigada!!!
ResponderExcluirBeijos,
Lê.
| Mais Rímel - livros, moda e artesnato |
Pode usar haha.
ExcluirObrigada você :3
adorei as dicas! o primeiro q personalizei foi o modelo viagem e adorei
ResponderExcluirfiz um novo com um outro modelo q achei na internet, só q não foi a msm coisa, não consigo personalizar os comentários de jeito nenhum . acho q tá bugado e nem consigo mais respondr os comentários..será q o erro tá onde?
bjoo
blogmaricordeiro.blogspot.com.br
Vou fazer um tutorial sobre isso, pra ajudar você.
Excluir<3
Já vou te seguir na ask u.u
ResponderExcluirEu admiro os blogs que fazem tutoriais de como fazer layouts, porque sei o quanto é trabalhoso OKAOKPA meus parabéns, o tuto ficou ótimo assim como sua explicação, mal posso esperar para o próximo *u*
htmlandresources.blogspot.com.br
>3< Ah você nem precisa seus layouts são maravilhosos haha
Excluir<3 Beijos!
Muito legal o tuto flor adorei
ResponderExcluirajuada muito esses posts
http://meninasperfeitas01.blogspot.com.br/
seguindo
Ajuda mesmo >3<
ExcluirTenho muita vontade de fazer um lay fofo *-*, depois usarei suas dicas pra tentar fazer um :3. Flor já lhe sigo, poderia participar do meu cantinho também se possível ? Te espero lá : Brilliant Diamond
ResponderExcluirClaro é muito obrigada!
Excluirhaha :3
ótimo tutorial, já estou fazendo um e quem saiba eu não faça um free com esse tutorial? você explica muito bem :3
ResponderExcluirKissus || Follow and Comment || Kawaii Cherry ♥
:3 Muito Obrigada!
ExcluirHaha adorei o tuto *U* é muito útil para aqueles que são iniciantes
ResponderExcluirQuando eu era iniciante na blogosfera, ninguém fazia tutos assim por isso meus layouts eram horríveis T-T
Você explica muito bem ^^ quero ver a parte dois ;3
~September Rains
:3 Muito Obrigada!
ExcluirVou fazer alguns pedidos na ask o3o . Este tuto está perfeito , adoro blogs que fazem estes tipos de tutoriais , para quem é iniciante este tuto é maravilhoso. O bom é que você deu uma forcinha colocando alguns códigos , enfim amei o tutorial .
ResponderExcluirkiss .
s-noowing.blogspot.com.br
:3 Muito Obrigada!
ExcluirPassai aqui pois vim avisar que mudei o meu blog de e tudo,inclusive os afiliados e por isso teu blog não está lá,mas já coloquei!
ResponderExcluir:3 Muito Obrigada!
ExcluirAmei esse tuto, vai ajudar muita gente <3
ResponderExcluirha-unting.blogspot.com
*-* Muito obrigada!
ExcluirAntww Amei <3
ResponderExcluirDa Uma Olhadinha ? http://goolddesigner.blogspot.com/
Obrigada *-* Ta bom <3
ExcluirEsse com certeza é um dos tutoriais mais úteis que existe. Ainda bem que você começou, vou acompanhar. o/
ResponderExcluirwww.nahboa.com
Obrigada ^ ^
ExcluirÉ muito bom ter esse tutorial disponível , muitas pessoas irão amar tenho certeza >3<
ResponderExcluirD-Resources || www.d-resources.net
Muito bom super explicadinho e o resultado vai ficar fofo.
ResponderExcluirSweet of Cherry
Vai mesmo <3
ExcluirMuito Obrigada
muito bom o tutorial, bastante útil..
ResponderExcluirhttp://zombiecutie.blogspot.com.br/
Diwosaa , ♥ Continua o tuto
ResponderExcluirObrigada.
Excluir