Tutorial: Subir a sidebar

Bom dia, amorinhas

Que bom que hoje é sexta-feira!!, não sei se vocês sabem, mas, minhas aulas começaram na segunda, eu estudo de manhã. Hoje teve umas três aulas vagas na escola, por isso estou aqui. O problema é que ainda estou sem inspiração, então, talvez iremos ter uma maratona de tutoriais. Quando o blog completar 100 seguidores, vou fazer um joguinho valendo vaga no meu blogroll, aliás, obrigada Cris, por me lembrar disso. Vou fazer uma cabeçalho editável também, me deem ideias, como vocês querem, que tema?, que cores?.

Chega de bla bla bla. Trouxe um tutorial que peguei no KW, de como subir a sidebar, devem saber como é né?, não sei se ainda ta, mas já esteve na moda a sidebar para cima. Eu acho bonito, mas se quiser ter um cabeçalho ultra super mega chique e cheio de coisas não recomendo usar. Vamos lá?!

1. Vá em Design > Editar HTML e pressione Ctrl + F 

2. Se sua coluna estiver posicionada no lado direito procure por:

.main-inner .column-right-outer {

E se for do lado esquerdo por:

 

.main-inner .column-left-outer {

 3.  Se pesquisou pelo direito, vai aparecer mais ou menos isso:

      .main-inner .column-right-outer {
        width: $(main.column.right.width);
        margin-right: -$(main.column.right.width);

E se pesquisou pela esquerda, isso:

.main-inner .column-left-outer {
        width: $(main.column.left.width);
        right: 100%;
        margin-left: -$(main.column.left.width)

Abaixo do código respectivo a sua coluna cole:

margin-top: -140px;

- ps: quanto maior o número mais pra cima a sidebar vai, mantenha o - ( menos ) -

Após terminar a primeira parte, apenas as letras vão mudar de lugar . Agora vamos ao fundo .

1. Se na primeira parte você usou o lado direito procure por:

.main-inner .fauxcolumn-right-outer {

E se usou o lado esquerdo por:

.main-inner .fauxcolumn-left-outer {

2. Abaixo de:

width: $(main.column.right.width); [ se sua coluna for do lado direito ]

width: $(main.column.left.width); [ se sua coluna for do lado esquerdo ]

Cole mais uma vez: margin-top: -140px;
- se você modificou o número anteriormente, faça o mesmo agora -

Visualize e salve (: