Huuum confessa essa imagem mexeu com as suas lombrigas kkkkkkk (JackieBoba). Hoooy pra vocês que tem elogiado bastante o novo design do blog \o/ (valeu ). ''Esse post é especialmente feito pra vocês''
Sim. Este template nada mais é do que um dos modelos do blogger e pra ser mais precisa é o modelo viagem (2° opção www). Vou mostrar passo a passo como cheguei a este resultado e também vou indicar os tutoriais que me ajudaram e vou aproveitar pra tirar dúvidas de alguns leitores que estão me perguntando bastante.
1° Pra facilitar a vida de vocês deixo aqui o link de um template que pode servir como base (é o modelo viagem, só que já personalizado) clique aqui para fazer o download. Modificações a serem feitas --->
Resultado parecido:
Este tutorial foi testado com sucesso nos navegadores Google chrome e Mozilla firefox \o/
Mais pra você que vive na idade da pedra e ainda usa INTERNET EXPLORER (já tá na hora de trocar de navegador hein??) este tutorial não dá certo :(
Vá em design do modelo e faça as seguintes modificações:
Agora salve.Essas são as modificações principais a personalização fica por conta de vocês, ok?
O Truque do template:
O Cabeçalho, o menu e os Gadgets da barra lateral são uma imagem só, veja:
A imagem foi feita no Photoscape mesmo e hospedada no site (www). Tudo foi super calculado para que na hora de adicionar os Gadgets as medidas estejam certas!
Para adicionar o este big banner ao blog usei este tutorial do Spazio DM (www).
Para alinhar os Gadgets corretamente em cada imagem utilizei este simples código:
<div style="background:url(LINK_DA_IMAGEM) no-repeat;padding-right:20px;padding-left:20px;padding-top:30px;padding-bottom:10px;">
Tradução:
padding-right: equivale á margem direita;
padding-left: equivale á margem esquerda;
padding-top: equivale á margem de cima;
padding-bottom: equivale a margem de baixo
Alterando corretamente os números fiz com que cada Script ficasse dentro das imagens! Sim eu confesso fiz uma reciclagem de códigos, mais até que deu certo (risos).
Tutoriais adicionais:
Confira mais tutoriais para personalizar seu blog na página de goodies e confira a tag Tutoriais também!
Bom gente revelei meus truques usados, espero ter esclarecidos algumas dúvidas e futuras perguntas rsrsrsr
Bye Gente!
Nossa pra min que não sou blogueira tudo isso parece tão difícil Kkk' você teve que fazer muita coisa pra chegar nessa perfeição toda =)
ResponderExcluirBeijooooos amigaaaa !
Nossa Jackie, tô impressionada como vc conseguiu fazer aquela imagem enorme?!?! OMG *o*, incrivel acho qe consigo fazer tudo menos esse bendinto menu,kkk né ñ?Adorei as dicas,hehe'
ResponderExcluirBeeeeeeeijos;*
http://sooulteen.blogspot.com.br/
Ai Jackie isso era tudo que eu precisava... ;c;
ResponderExcluirCara eu amei, amei, amei a frase que está lá no seu cabeçalho super fato.
http://mundrose.blogspot.com.br/
Adorei as dicas, confesso que piro com esses códigos, quando vou mudar de lay, quase arranco todos meus fios de cabelos ahuahuahua :j:, muito difícil!
ResponderExcluirO novo design daqui ta muito lindo mesmo, parabéns!
Bj
NUSS amei jackie ! óia nóis aqui de novo ( 2 da manhã kk )
ResponderExcluiramei os tutoriais ! salvo nóis em? bjo
cherryseublog.blogspot.com.br
@leticia carolina HAHAHAHAH olhas as olheiras hein guria? kkkkkkkkkk Maldita insônia O.o
ResponderExcluir@Marcelle Monteiro Também me identifiquei tanto com a frase que coloquei logo no cabeçalho pra todo mundo ler kkkkkkkkkkkkk *---*
ResponderExcluirEu achei meio dificil fazer as imagens para por os gadgets,já que são muitas. Adorei o post e o laout está lindo,como sempre.
ResponderExcluirhttp://i-teenbr.net.tc
Ótimo tutorial. Bom tbm pra muita gente que acha que é simples e rápido fazer :/
ResponderExcluirwww.bugigangazdanet.blogspot.com
adorei as dicas jakie!!!!! me ajudou muito acabei de mudar o lay do meu blog rsrsrs
ResponderExcluirhttp://sweetrock16.blogspot.com.br/
Que fácil Jackie , eu nunca imaginava >< usahhsahs , bjs bjs :* www.blog-algodaodoce.com =)
ResponderExcluirAchei linda a sua sidebar, mas sou muito preguiçosa pra fazer isso kkkkkkk. O layout ficou lindo. Se algum dia a preguiça deixar eu vou tentar fazer uma sidebar assim, talvez no meu próximo lay.
ResponderExcluirPonha Glitter
Jackie, qual é o tamanho do banner?
ResponderExcluirJackie esse tutorial ficou perfeito!!!! Seu layout novo tá muito lindo e não é qualquer blogueira que sai revelando seus segredos assim rsrs Adorei!
ResponderExcluirBeijoo :* Maison de Poupées
Jackie, qual o tamanho do banner?
ResponderExcluirNossa ameii!
ResponderExcluirMenina vc arraza nessas dicas *-*
Essa semanah vou tentar mudar meu lay,
pra ver se consigo
Beijos sua linda.
http://meuinfinitto.blogspot.com.br/
Parece tão dificil O.O haja paciencia, rsrs
ResponderExcluirMas ficou lindo seu template *.* Amééy
Jackie, eu não consigo personalizar os coments :n:
ResponderExcluirmeu coments estão horriveis
Uau, não sabia que cabeçalho e sidebar eram uma imagem só. Mas aí tem que deixar a sidebar de verdade transparente? Não entendi essa parte.
ResponderExcluirAdorei o tutorial, Jackie. Tem várias dicas ótimas, vou usar no meu próximo layout.
muggle-world.blogspot.com
É a Jackie! haha# parabéns, viu? Seu blog vai causar inveja, tô te avisando! hsaushau SÉRIO MESMO, parabéns! :j:
ResponderExcluirAi Jackie simplesmente amei nada mais o designe daqui é lindo!♥
ResponderExcluirhttp://kelly-club.blogspot.com.br
Jackie, mas uma vez vc arazou no tutorial. Lindaaa vc é umas de minhas inspiraões, ótimo tutorial (:
ResponderExcluirBeeeeeeeeeeijan
http://the-lovers-world.blogspot.com.br/
Algo que eu adorei no seu template novo,a ideia separar o Gadgets e colocar em duas colunas de cores diferentes foi demais!
ResponderExcluirhttp://jeitointelect.blogspot.com.br/
aah Jackie, seu template ficou diwwo :3 mas deve ter dado muito trabalho, não? uashuash, aceita ser entrevistada? bjs Dani, teenrockers.tk
ResponderExcluirAmei jackie! Mas você mudou minha vida mesmo com aquele stiqr, depois de tanto tempo te enchendo *0* MUITO lindo aqui mesmo! Um dos meus blogs favoritos :D
ResponderExcluirBeijos ♥
Conspirantes
Oi Jackie, faz um tempão que não passo por aqui, pq fiquei sem pc por um mês, daí já viu né?
ResponderExcluirMas agora que meu pc voltou vim correndo olhar as novis do seu blog e me deparei com esse lay lindão!*_*
Nossa flor, que lay, mais fofo, eu amei!!! =)
Acho que vou tentar customizar um lay com essas dicas que vc deu.
Parabéns pelo lindo trabalho. Bjokas e boa páscoa pra ti! ♥
@Jackie Zanini
ResponderExcluirmaldita mesmo ! o.0 kkk
ficou muito lindo esse lay e olhando assim parece um bicho de sete cabeças mas é bem fácil, adorei!!
ResponderExcluircrazylifebr.blogspot.com
Qual serias as medidas para montar um template como esse seu ?
ResponderExcluirNooosssaaa que massa todos eless!! :k: AMEI! :m:
ResponderExcluirFloor, posso te pedir um favorzinhu também? :j: Pode curtir nossa página que se necontra na sidebar? desde já agradeço!
Um beijoo da sua mais nova seguidora que deseja ser retribuida >> Laara
:h: rawr >> http://laara-teen.blogspot.com.br/
Oii
ResponderExcluirQueria dizer que adorei seu blog !!! É super lindão!
Quueria te convidar para conhecer e seguir o meu:
http://rosarosalina.blogspot.com
Nossa que legal, gostei dos truques.
ResponderExcluirhttp://dezapaixao.blogspot.com.br/2012/04/inspiracaominha-nail-art.html
Ah, que legal! Parabéns, muito legal da sua parte ensinar suas técnicas! Hoje é meu aniversário, sabia? Beijos!
ResponderExcluirwww.nicole-falaserio.blogspot.com
:g: Jackie minha lindona amei como sempre Feliz Páscoa !!
ResponderExcluirBjs
aJUda a divulgar porfavor
http://wwwjovens-garotaas.blogspot.com.br/
Eii queria perguntar se tem um jeito fácil de colocar setas diferentes no blog ?
ResponderExcluirsem colocar no HTML?
Poxa Jackie parece tãão fácil... Amei o blog super lindo ja estou seguindo! Bezõõs Luuh
ResponderExcluirRawy ---> teenstyle-official.blogspot.com.br
haa ficou lindo lindo! ameei *-*
ResponderExcluirhttp://girlsinful.blogspot.com.br/
Qual é a diferença de Template pra Layout?
ResponderExcluirADOREEEEEEEEI JACKIE *OOO*
ResponderExcluirVO SALVAR NOS FAVORITOSSSS! s2 haha
Bj guria diva u_u
bnascimentooo.tk
@Diva Moreno Medida do meu template: 950x2054
ResponderExcluir@Juliana Do template que eu indiquei como base é 1003(largura) o tamanho vc escolhe!
ResponderExcluiraaah e a largura pode ser modificada *---*
@Gilciany Viana aaaaaaah brigada lindaaaaa \o/ aaah feliz pascoa pra ti tbm muuuito chocolate (: rsrsrs
ResponderExcluirMesmo vc esplicando não sei mecher, mas valeu as dicas seu blog é lindo.
ResponderExcluirE te peço um favor, to começando agora nesse mundo dos blogs, vc poderia ir lá me seguir e conhecer o meu cantinho sua visita pra mim será uma honra.
Beijo grande Fabi.
http://blogda-fabiana.blogspot.com.br/
Minha cara ao ver que você fez a imagem no PhotoSacpe =O
ResponderExcluirEle sempre foi o meu programa queridinho, rs..Vou tentar depois.
Só não consegui a do Menu dentro do banner, que eu necessitoo! Coisa de menu mapeado já era, uhahsha.
World-cutest.tk
oiiii! aceita afiliação????
ResponderExcluiramusicadesconhecida.blogspot.com
Ameiii Jackie !!!
ResponderExcluiresse titorial da certo no Safari ????
bjs Mari
www.mundodebolinhas.com
Jackie, o seu resultado tá certo, pq o resultado é para dar entre 1 e 9, tá certíssimo, OK ??
ResponderExcluirhttp:/bandanacolorida-samy.blogspot.com
http:/apenasbrincando-samy.blogspot.com <<< meu blog de jogos
Ameeei o layout Jackie! Ta lindo!
ResponderExcluircdiasblog.blogspot.com
Oii, adooro seu blog e suas dicas !! Amei esses ai ! Você já segue e já comentou meu blog *--* , masss , tem como divulgar ele ou colocar ali nas barras ? Meu blog é esse aqui : http://aabaguncadomeuquarto.blogspot.com/ beijinhos !
ResponderExcluirNão consigo colocar meu banner , me ajuda ai flor!
ResponderExcluirserá que eu to fazendo meu banner muito pequeno
@Diva moreno Ajudo sim, se vc falar mais detalhes ;D
ResponderExcluir:l:
ResponderExcluirOwnt :k: ficou lindo o design do blog, nem tinha visto ainda... Amei mesmo e obrigada pelo seu comentário!
ResponderExcluirBeijoos!
:N: boa noite Jackie Zanini aa' estou tentando fazer esse tuto desde de domingo .Mais faço tudo certinho mais quando vou colocar no blog fica grande ao pequeno demais, poderia me ajudar obrigada.
ResponderExcluir@Jackie Zanini não sei o que acontece saber faço certinho mais na hora que vou colocar ficar uma bagunça :I: o que será obrigada fofa
ResponderExcluirO problema e o template peguei as medidas certinhas que você passou mais quando vou coloca
ResponderExcluirvira uma bagunça que só kkk e muito tenso..
Será que se não for pedir demais você não poderia estar colocando para mim faria um grande e enorme favor e eu agradeceria muito mesmo.
Caramba, jackie! Vc é demais *-* Ficou lindão, achei que tinha que mexer muito com HTML e tudo mais, mas que nada! Perfeito *-*
ResponderExcluirEu fiz mas o meu ficou muito pequeno, o que eu devo ter feito errado? :(
ResponderExcluir@Stephane n sei linda :a:
ResponderExcluirótimas dicas :)
ResponderExcluir:l: coisinhasdegarotas-cherry.com.br
Tipo o meu tá ficando cortado no meio agora? mesmo eu colocando o modelo viagem...
ResponderExcluir:l:
ResponderExcluirMas, não consigo fazer o template viagem ficar transparente.
ResponderExcluir:i: Me ajuda :i:
Porque o plano de fundo da barra lateral e das guias é sempre escuro, é meio preto, tipo por exemplo, se eu colocar a cor AMARELA fica VERDE OLIVA, PINK fica BORDÔ, e por aí vai... Como fazer para Ficar transparente ou de uma cor viva?? :i: Help?? :i:
:j: Jackie, me ajuda? :j:
ResponderExcluir@Dudinha ? com o que?
ResponderExcluirViu, eu ja fiz o template ficar transparente.
ResponderExcluir:h:
Mas agora me explica, como faz para deixar a imagem ficar estendida no blog, tipo ela fica lado a lado.
Eu nao consigo estender ela.
Como faz?
Oiii jackie tudo bem? AMANDO SEU BLOG!
ResponderExcluirmais eu não consigo colocar oque eu faço ?
:k
ResponderExcluirAAhh! Pirei com essas dicas! Tudo bem se eu usar, né? Ah, claro que ta tudo bem, você é a Jackie... A deusa do blogspot :k:
ResponderExcluirAmeeii amiga :3
Kisses :*
Perfeito pena que não vou conseguir...
ResponderExcluirpirei aquiiii
http://lorranne14.blogspot.com.br/
se puder seguir meu blog e comentar?
Onde você colocou o código para alinhar os gadgets?
ResponderExcluirEm baixo do código do "big banner"?
xoxo
Jackie, uma dúvida... qual a medida que você usou, pra fazer esse mega banner? por não saber as medidas certas, nunca dá certo quando eu vou fazer o meu template :j:
ResponderExcluirNossa flor amei a postagem e amo o seu blog,foi uns dos primeiros que conheci e foi amor a primeira vista kkk,esse post me ajudou d+!
ResponderExcluir@Sarah :h: :d: :j:
ResponderExcluirjackie, pode nos ensinar a juntar o cabeçalho do Blog com as páginas e deixar o cabeçalho mais para cima que nem o seu ???
ResponderExcluirComo assim juntar o cabeçalho com as páginas?
Excluira pra deixar o cabeçalho mais pra cima >>http://editionskatycat.blogspot.com.br/2012/05/subir-o-cabecalho-do-blog.html
Como faço um template pelo photoscap ?
ResponderExcluirA parte do design tem vários jeitos.
Excluir(esse é um por exemplo)... O resto tem q ser por HTML mesmo (:
Jackie Me dá esse template ai que você feiz ?
ResponderExcluirBy: Camila
Nem tenho mais o código desse template '-'
ExcluirJackie ensina a gente fazer paginas pois já tentei e não deu certo os seus tutoriais são os únicos que dão certo ! Fico feliz se você me ensinar a fazer isso !
ResponderExcluirhttp://www.ferramentasblog.com/2011/09/como-criar-paginas-estaticas-no-novo-blogger.html
ExcluirSabe no final eu nao encontrei oque vc falou.
ResponderExcluir