30/07/2014

Tutorial - Mexendo as sidebars

Oi minna! Há algum tempinho que não trazia um tutorial neh?
Bom, desta vez trouxe um bem útil para quem gosta de ter o blog organizado... Eu já tenho este tutorial em word há algum tempo, mas sei que o aprendi num blog, blog esse que não sei como se chamava, e nunca mais vi............... #gomen
Whatever... Eu acho que este tutorial deve ser usado especialmente para layouts com duas sidebars/barras laterais.
Como está no momento, vejam o espaço pequenino que deixei entre sidebar e post:


Vamos lá aprender como se faz:

Vá ao modelo, editar HTML e dê um CTRL F, para pesquisar o seguinte código:

Se quiser mexer na sidebar do lado direito:
.main-inner .column-right-inner {

Se quiser mexer na sidebar do lado esquerdo:
main-inner .column-left-inner {
-------------------------------------

Assim que encontrarem o código desejado, substitua de { até a} por:

Se for a  sidebar do lado direito:
.main-inner .column-right-inner {
width: 200px;/* Largura que quer da sidebar*/ margin-left: -48px; /*A quantidade de vai mexer para a direita alterar o simbolo - para + se for necessario*/
}

Se for a sidebar do lado esquerdo:
.main-inner .column-left-inner {
width: 200px;/* Largura que quer da sidebar*/ margin-left: -48px; /*A quantidade de vai mexer para a esquerda altera o simbolo - para + se for necessario*/
}

Pré-visualize e veja se está bom, se for necessário mude os números até estar do seu agrado ;)

12 comentários:

  1. É bastante fácil, desu. E lógico também ._.'' E útil para quem usa as duas sidebares.
    Faz bastante tempo que eu não comento aqui 'º'

    ResponderExcluir
    Respostas
    1. Hahahah xD
      É, apesar de tambem gostar de ver numa so sidebar ~
      Hahahah pois é XD

      Excluir
  2. Yooo tudo bom!?
    Nossa essa história de tutorial comigo é tipo prova só sei no momento depois que tudo tá pronto eu me esqueço por completo e.e,principalmente dessas barras laterai,aiiii me lembro a dor de cabeça que foi organizar as do meu blog T-T.
    É um tutorial muito útil,e que por algum motivo eu dificilmente encontro ele na internet,enfim obrigada por traze-lo,vai me ajudar muito no meu futuro lay >/////<
    Kiss

    ResponderExcluir
    Respostas
    1. kkkkk é sempre meio complicado a parte das barras laterais.. isso me dá cabo da cabeça mesmo ._.'
      Sim, eu tbm so encontrei uma vez e alem de ter sido muito complicado de encontrar, nunca mais achei o local onde o vi '-'
      Ainda bem que guardei em word hein ._.'

      Awn q bom q posso ajudar >-<

      Excluir
  3. Bunny, acho que não tinha visto esse seu novo lay ainda.
    Ficou muito bom.......... E o tutorial também, vai ser muito útil a varias pessoas que estão começando na blogosfera.
    Abraço

    ResponderExcluir
  4. Como meu html é diferente, não é um tutorial que eu usaria, haha, mas conheço umas amigas para as quais ele será muito útil, já vou até recomendar ♥

    Beijinhos Bunny :3

    ResponderExcluir
    Respostas
    1. kkkk vc ainda vai me explicar como faz com seu HTML hein u-ú
      Awwn Kawaii Shana-san >-<

      Excluir
  5. Yea! :3 Olá Bunny!!
    Fui tentar separar minha sidebar do post
    mas parece que o meu modelo não aceita :/ É o Celestial, é pois é, escolhi esse mas não tinha noção que era melhor o Simples e Travel, e me desfazer do meu há, muito trabalho ~.~
    Pois bem, eu ouvi a sua dica e diminui a largura do meu blog, maaas a sidebar ficou muito desorganizada, parece que chama mais atenção do que as postagens, de tão juntinhas :/
    Se você souber ou sabe como separar sidebar do Celestial, tem como me ensinar?
    Ou alguma maneira de organizar que ajude. Pleeeeeeease me ajuda Bunny ! Help meee! ♥

    Ja ne!
    yeavnsdesu.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Oi 0/
      Bom, eu nunca tentei editar o modelo celestial, mas eu vou perguntar pro titio google se ele conhece uma forma de melhorar isso tah? Depois eu comento no seu blog 0/

      Excluir
    2. Me enganei, não é Celestial não. É ''Janela de Imagem'' o nome do modelo template. Birri :3 Malz, mas descobri uma solução e até postei um tutorial já que não existe por ai pela internet. Há, descobri *-*. Yea!
      Mesmo assim Bunny, muuito obrigada pela sua tentativa em me ajudar! <3

      Bye bye
      Vou parar de encher o saco! báh (ou não) :P kk~

      yeavnsdesu.blogdpot.com

      Excluir
    3. KKK otimo, que bom >-<
      De nada, tento ajudar :3

      Ashuahushuas pode falar sempre q precisar 0/

      Excluir

Se queres comentar:
☾ Nada de palavras indecentes!
☾ Se eu te conhecer, no comentário anónimo podes assinar no fim, por favor?^^
☾ Se quiseres falar comigo no msn podes adicionar:
bunnytsukino5@hotmail.com
☾ Diverte-te e comenta sempre que quiseres!

©