05/12/2013

Tutorial ^-^

Olá♥
Hoje teremos um post bem simples, trago três tutoriais básicos mas que fazem uma grande diferença se usados em conjunto em seu blog. Os tutoriais a seguir, ensinarão você a: Personaliza a Data, Colocar borda na área de posts e Colocar faixinha no título do Gadgets, confiram!


Personaliza a Data
Em seu HTML pesquise por:
.main-inner h2.date-header {

Você encontrará algo parecido com isto:
.main-inner h2.date-header {font: $(date.font);color: $(date.text.color);}
Apague todo o código mencionado acima, substituindo por:

.main-inner h2.date-header {font-size: 10px;float: left; /* posicionamento*/background: #d85a86; /*cor do fundo*/color: #fff; /*cor da fonte*/font-family: Tahoma, Tahoma; /* fonte */margin:-30px 2px 5px -40px;-border-radius: 0px 5px 0px 5px;-moz-border-radius: 0px 8px 0px 8px;-webkit-border-radius: 0px 8px 0px 8px;box-shadow:0 0 3px #ccc, inset 0 0 20px #b33e68; /*sombra interna*/}
Modifique as partes destacadas pelas cores de sua preferencia usando a tabela de cores [www], depois é só visualizar, tudo certo? Então salve.


Colocar borda na área de posts
Em seu HTML procure por:
.main-inner .column-center-inner {

Quando encontra, cole abaixo dele o código a seguir:

border-top: 10px #c74c66 solid; *\cor, tamanho e tipo de bora acima do post*/border-bottom: 10px #c74c66 solid; *\cor, tamanho e tipo de bora abaixo do post/box-shadow:0 0 3px #ccc, inset 0 0 20px #d1d1d1; */ sombra interna na caixa  */padding: 10px;
 Colocar faixinha no título do Gadgets

Em seu HTML procure por: /* Mobile
Antes de body.mobile  { cole o código a seguir:

.sidebar .widget h2{background: url(LINK DA  SUA FAIXA) no-repeat left;margin-top:-2px;margin-left:-19px;margin-bottom:0px;padding:15px;width:150%;overflow:hidden;}

Explicando o código:
margin-top: É a altura da faixa, diminua para ela subir, ou aumente o número para ela descer.
margin-left: É a posição da faixa, diminuindo ela vai para frente aumentando para trás.
padding: Mexe nesse número apenas se sua faixa ficar cortada, ai você vai aumentando ou diminuindo até conseguir ajusta-la.

Para não ficarmos apenas nos tutoriais, trago algumas faixas -que eu fiz- que vocês poderão usar utilizando o ultimo tutorial acima.








Espero que tenham gostado.

Abraços♥

24 comentários:

  1. Incrível, adorei! Vou tentar fazer no meu rsrsrs...

    ResponderExcluir
    Respostas
    1. Tenta sim flor, obrigada por comentar.
      Abraços♥

      Excluir
  2. Babiiiiiii que saudades! Voltei a blogosfera, hahaha
    Amei o tutorial,viu? Achei bastante util.


    Beijos ♥
    http://mundoencantadodabarbie.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Saaaaaah, que saudades também.
      Feliz por sua volta flor #PulandoAqui -rs
      Que bom que gostou.
      Abraços♥

      Excluir
  3. Adorei o tutorial!
    Lindo layout.
    cate-land.blogspot.com

    ResponderExcluir
  4. Que tutoriais perfeitos Babii *-* Nhaan,que diwa essas faixinhas ^^

    Kiss :3

    ResponderExcluir
    Respostas
    1. Obrigada flor, fico feliz que
      tenha gostado.
      Abraços♥

      Excluir
  5. Muito bom esses tutoriais, quem sabe um dia eu consiga usar um no meu blog :-)
    Beijão!


    OBS: Babi, já enviei o convite pra ti.

    ResponderExcluir
    Respostas
    1. Sim, são tutos muito bons.
      Tenta sim flor, aposto que você consegui.
      Abraços♥


      P.S: Já aceitei, agora me coloca como ADM.

      Excluir
  6. Respostas
    1. Sim, é muito útil.
      Obrigada por comentar.
      Abraços♥

      Excluir
  7. O tutorial é bem legal, pena que já sei personalizar todos sozinhos :/

    Beijos,
    Minus

    ResponderExcluir
    Respostas
    1. São muito bons, pena nada
      melhor pra você saber personaliza -rs.
      Abraços♥

      Excluir
  8. Ótimos tutoriais realmente fazem uma grande diferença no layout do blog

    cherrycharming2.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Obrigada, sim fazem muita diferença -rs.
      Abraços♥

      Excluir
  9. Adorei o tuto! E as faixinhas são lindas ♥

    http://tentando-esquecer.blogspot.com

    ResponderExcluir
  10. Ótimo tutorial, super lindas as faixinhas >3<

    15 Days
    Aguardo sua visita ~

    ResponderExcluir
  11. Esses três tutoriais são ótimos, haha
    Fazem uma grande diferença no lay!
    Adorei as faixinhas ç.ç

    Beijão! :*
    Beijão! :*

    ResponderExcluir
    Respostas
    1. Fazem mesmo uma grande
      diferença Jhenny. Muito obrigada
      por comentar.
      Abraços♥

      Excluir

Hei, people <3 Que tal deixar sua opinião, sugestão ou critica (construtiva, por favor) em nossos comentários para que assim possamos melhorar ainda mais! Lembrando, é claro, que nossos comentários são moderados, isto é, precisa de minha aprovação para que apareça. Por tanto, seja educado e se expresse de forma a não ofender a autora do blog ou a terceiros, caso contrario seu comentário não será postado, okay? Até aceito o "seguindo, segue de volta?" desde que eu goste de seu blog, seguirei sem problemas. Sem mais delongas, fique a vontade e volte sempre.
Abraços da autora;
Babi Sah ♥