Image Map

25 janeiro 2012

Como criar sue próprio template!Tipo o meu.

     Oii!Hoje vou postar outro tutu# 
     Aii como adoro postar tutus! 
     Mais esse vai ser um Mega Tutorial.
     De como criar um template básico,mais tipo o meu.Não é grande coisa,vocês podem fazer melhor.



     Primeiro você tenque faser o seu cabeçalho,tipo o meu ali,mais do jeito que você quiser,personalizeo!Vou deixar uns aqui como exemplo:



Os fundos que são brancos são transparentes!

     Clique nela pra ver o tamanho real e salve!Dai pra coloca-lo você tenque Colocar o título do blog lá e selecionas isso:

O meu é a nova interface do blog ^^,se o seu não for é só clicar em Design

     Depois clique em Editar do ícone Cabeçalho:



    Vai aparecer assim:

     Agora fassa o que demonstra na imagem:

Eu não crio o meu desse jeito,mais se for usar os meu cabeçalhos fassa assim!

      Provavelmente ficara assim com o último cabeçalho:

Ficara melhor no de vocês mais é que ainda não arrumei a letra do cabeçalho :/

    
      O cabeçalho já foi agora são as colunas ali do lado!
      Essa a maioria sabe!Mais vou colocar o tutorial assim mesmo....

     Primeiro se estiver na interface do blogger atualizada,vá em Modelo>>Personalizar.Se estiver na antiga vá em Design>>Design Modelo.Abri-rá uma página assim:


    Vá em Ajustar Larguras,e deixe assim:

Quando for colocar e não der certo,ficar meio "desageitado" é só arrumar um pouquinho.

     Agora clique Layout,e selecione um layout com o Segundo rodapé e um dos quatro Layouts do corpo destacados na imagem a seguir:


     Pronto,agora clique em Aplicar ao Blog e depois «Voltar para o Blogger.

      Clique em Editar HTML,e procure pelo seguinte código se você,escolheu as duas colunas no lado direito:

     .main-inner .fauxcolumn-right-outer .fauxcolumn-inner {
     
     E se for duas colunas a esquerda procure por esse:

    .main-inner .fauxcolumn-left-outer .fauxcolumn-inner {

   Vai aparecer assim:

    .main-inner .fauxcolumn-right-outer .fauxcolumn-inner {margin-right:          $(content.padding);background:$(widget.outer.background.color)   $(widget.outer.background.gradient) repeat scroll top left;}

   Mude a parti em Negrito por essa daqui:

   background: url("URL DA IMAGEM") repeat;

   Mude novamente oque está me negrito pelo URL da Imagem das colunas tipo essa:

A outra parte é branca mais não ta parecendo direito!:/

    Vou dar uns exemplos,para vocês usarem:





Também não estão aparecendo direito :S

     Se quiserem que faça alguma pra vocês comentem aí!Fasso de graça!

     Agora vamos aprender a fazer o Menu,tipo o meu,personalizado!

     Primeiro faça o seu Menu,pelo seu programa de edição,o meu é o Photoscape e o Photo Filtre Studio
X.Não posso fazer exemplo por que não sei a página dos blogs de cada um.
     Mas se quiser é só comentar ou mandar um formulário em Contato.

    Depois de ter feito o seu menu,clique nesse link:Image Map.Va´aparecer isso:


     Agora faça o que a imagem manda:


    Digamos que foi essa imagem que escolhi:

   
    Bem feinho o menu fiz com pressa :/

    As imagens são suas líderes faça o que ela manda buahahaha!#:


Pelo menos elas não gritam com você!Hehe'

     Selecione por partes o menu,como uma parte é o Inicio e outra é o Contato.Desse jeito:



     Faça isso no restante.
    Depois clique em Get Your Code.E depois em HTML Code,aqui:



     Copie o código que irá aparecer e cole em uma gadget HTML/Java Script,e pronto o Menu está feito!

     E aí gostaram do Mega Tutorial,ficou grande mais quem quer fazer o seu próprio template vai ler!Se você não intendeu vai na minha página de contato e manda um formulário,faço templates grátis!Do jeito que vocês quiserem!

Beijinhos!

ATENÇÃO:Se for usar algum deses elementos que fiz :cabeçalho ou coluna,por favor me avise nos comentários!

9 mil recadinhus,o seu já ta aqui?:

Cabide Moderno disse...

Bem legal, ótimo para blogs que precisam de dicas
Te espero lá, bjbj
http://cabidemoderno.blogspot.com/

Priscilalirow disse...

amei o tuto é mto bom saber como as minhas amigas tem a criatividade de criar um design tao fofo, eu mesma ja nao tenho paciencia, as meninas vao amar esse tutoo =]
beijinhos :)

http://priscilalirow.blogspot.com/

Juuh disse...

Adorei o Tutorial, me tirou varias duvidas..rsrs
Adorei o blog, super fofo, e ja seguindo para te ajudar a atingir sua meta ;)
Se puder passa la no meu tbm?
universodajuh.blogspot.com

bjs

Luísa disse...

Obrigado ai viu ju?

Luísa disse...

Obrigada Gii!!

Millena - disse...

adorei, pena que não consegui :( amei seu blog!

millena-maniadegarota.blogspot.com

Gabi disse...

oi, adorei seu blog ele é super fofo, ameiiii, estou te seguindo se você puder segue de volta?
Bjss.Gaby
www.blogcherrydreams.blogspot.com

Luísa disse...

:],sorriso de robo kkkk'

Aninha disse...

não consegui luh qual e o modelo???