28.1.14

Autor, marcador e comentários na mesma linha no footer do post

Olá, leitores!  (o⌒.⌒o) Hoje o título gigantesco da postagem deixou vocês confusos ou já entenderam logo de cara? Pois bem hoje eu farei o tutorial de como deixar os links da postagem (No caso o autor, comentários e marcadores) na mesma linha em vez de ficarem abaixo do título da postagem eles ficaram juntos e personalizados como vocês quiserem, com fundo, sem fundo, com bordinha, em cima, e tal. Esse pedido foi feito na ask duas vezes então espero que quem pediu se contente e que dê tudo certo, já que é mega fácil. Só digo uma coisa: Tenham criatividade e não deixem igual ao meu, gente, por favor, sacode a cabeça aí, haha. Vamos lá! ~

A ideia é para que fique desse jeitinho no footer da postagem, certo? Personalizado.

01. Bom para começarmos é preciso que você não tenha editado nada, e primeiramente o que iremos fazer é passar os marcadores para  a linha de cima, certo? No seu html dê F3 e pesquise por <div class='post-footer-line post-footer-line-2'>< (E não retire o "<" no final, isso é para você identificar qual dos dois códigos do html é o que você irá usar!) Após encontrá-lo ao lado dele estará o código responsável pelos marcadores, selecione-o até </span> e recorte. (PRINT)

02. Agora ele está no seu Ctrl+v e para isso vamos colá-lo na mesma linha dos outros links, e para isso pesquise por <div class='post-footer-line post-footer-line-1'>< Esse código é a linha de cima, ou seja nele estão o comentário e o autor, então (PRINT) Bom, agora iremos colar o código dos marcadores abaixo o código dos comentários, certo? Bem abaixo do </span> (PRINT)

03. Após visualizar, você já pode salvar, mas vamos supor que você queira editar os links e colocar um background uma borda como na imagem de lá de cima, certo? Para isso você irá colar o código do quote abaixo acima de ]]></b:skin> e vai editá-lo.
.post-footer-line-1{
background: #000;
color: #fff;
font-family: 'Trebuchet MS', Trebuchet, sans-serif;
font-size: 12px;
font-style: none;
padding-left: 4px;
padding-right: 3px;
padding-top: 2px;
padding-bottom: 2px;
text-align: justify;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
Prontinho! Visualize e salve.

42 comentários

  1. Mack do céu você é um anjo garota, é bem isso que eu estava precisando, estava montando o post-footer mas estava ficando muito estranho ヽ( ̄д ̄;)ノ agora vai ficar bonito (◎>U<◎)

    Chu~ || MyPinkOcean

    ResponderExcluir
  2. Minhas aulas também começaram dia 27 :3 Enfim, adorei o tutorial, é super útil.

    Visite o blog | Etc For Me ♥

    ResponderExcluir
  3. IAUHUISA', meu bem, se arrumar para o primeiro dia de aula é uma tradição q. As minhas começaram ontem também, foi até legal. Seis períodos de aula vagos, é para comemorar de pé, igreja q.

    Simplesmente adorei o tutorial! Nunca vi um tão explicadinho! Ele é tão complicado, mas o tornaste tão fácil ♥

    Um grande beijo,

    Juu-Chan || Nescau com Nutella

    ResponderExcluir
    Respostas
    1. Pode crer -q Whow, queria eu O>O
      Awn, obrigada Juu! >3<

      Excluir
  4. As minhas aulas começaram ontem também (27), e eu realmente estou enrolada com os posts, pois o período é integral, daí fica dificil. O meu post footer está assim, adorei o tutorial >3<

    Beijos, Fear Me~

    ResponderExcluir
    Respostas
    1. Pois é, isso dificulta muito D: Obrigada Julia! >3<

      Excluir
  5. adorei o tutorial! Vou favoritar, pq vou necessitar D:

    Beijocas da Saroca! || Interesses Sutis - Visite-me :3

    ResponderExcluir
  6. Eh mas agr so vou dia 10 ou mais tarde 0/ sabe mackk em vez de ensino normal resolvi fazer TI ( tecnico em informatica ) u.u
    Acho que vai ser mais dificil , mas pelo menos nao tem fisica hu3hu3.
    Ain sua divosa , acho que vou usar enquanto ainda estou editando e html do blog , pq ele ta fechado e.e


    Geekegirlie.blogspot.com|| ✖G²Official ✝

    ResponderExcluir
    Respostas
    1. Whow, sério? Nhaw que bom ^3^ Use sim! :3

      Excluir
  7. Morro de duvidas com o footer então eu adoro tutoriais relacionados :3 Muito bom!

    living-kpop.blogspot.com

    ResponderExcluir
  8. Ual ,ajudou bastante mtu obrigadaa (:
    Bjão, http://loveforhtml.blogspot.com.br/ (visita? <3)

    ResponderExcluir
  9. Adorei o tutorial, eu uso em uma linha só. Tinha dado um trabalhão para fazer sozinho...

    P.S: Já te coloquei na elite, pode ficar calma ~
    www.b-urning.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Obrigada Ruisu! >3< AFSGAFD' Whow, estou bem mais relaxada -q

      Excluir
  10. Eu vou viajar no carnal HUEHUEHUE' mas só vai ser por uma semana T^T' ~ bom, eu não tenho tanta importância para chegar arrasando, só taco quilos e quilos de maquiagem na minha cara pra encrder minha olheras (-n) ~ já que eu uso óculos nem dá pra percebe e.e ~ USE ÓCULOS *-*; aaawn Mack te amo ♥ já pedi pra várias pessoas postarem mas nunca achei um tutorial que ensinasse fazer isso e agora eu aprendi *-* thank you ♥

    write down || venha escrever juntamente conosco! ♥

    ResponderExcluir
    Respostas
    1. Mesmo assim já é alguma coisa u_u Eu também não ligo, só não gosto de ir parecendo um troço -q Prefiro lentes, acho mais prático :3 Awwn, por nada Jay! <3

      Excluir
  11. Mack! Que pena que você não vai viajar, é bem legal viajar no carnaval (ainda mais por que nao gosto e na minha cidade tem desfile, bleh). Enfim, eu já sei esse tutorial, mas é bem importante para quem não sabe, né? Ficou bem explicadinho, parabéns ^^

    Ah queria saber se você aceita afiliação, achei que eu já fosse afiliada daqui, mas não :c se não quiser, tudo bem... Vou arrumar minha elite e ai te ponho lá se estiver afim heh :3

    Beijos, amo o TMR, só pra constar uhauah *-~
    sokawaii.com.br

    ResponderExcluir
    Respostas
    1. Pois é, queria tanto passar o carnaval fora D: Nhaw, obrigada Jana! ^-^ Você era, mas o SK ficou um tempinho fechado e quando voltou eu não havia visto o TMR na elite e tal :3 Awn, obrigada novamente, e já está na elite!

      Excluir
  12. adorei o tutorial, muito útil e preciso . *=

    http://dr-eaming.blogspot.com.br/

    ResponderExcluir
  13. Amei o tutorial, boa sorte com as aulas, já estou seguindo ♥

    www.k-awaiicherry.blogspot.com

    Kissus ♥

    ResponderExcluir
  14. Eu to com um pouco de medo de chegar na escola igual uma mendiga, meu cabelo tá uma bosta, minha mãe não comprou meu veet, minha pele tá horrível, e não quero encher a cara de maquiagem logo no primeiro dia de aula ¬¬ É uma pena isso, ter que diminuir o número de postagens, mas é preciso, infelizmente! Adorei o tutorial, qualquer dia desses eu uso >3<

    Unskilled

    ResponderExcluir
    Respostas
    1. ADSFAGSF' Eu também estava com esse "medo" ç_ç Pois é :c Obrigada Nae! >3<

      Excluir
  15. Fala sério, suas aulas já começaram? que horrível
    Poxa, que horrível né, as aulas estragam tudo ://////////////// as minhas já começam nessa segunda, que horror ~ e tipo, não tem necessidade, tinham de começar depois do carnaval não é?! :s

    Amei o tutorial, acho que irei usá-lo ^^' ah, e desculpe pelo transtorno que causei no outro dia õ/

    AN ~

    ResponderExcluir
    Respostas
    1. Sim :c AFSGAHD Tinham mesmo ou nem começavam :B Obrigada Megan! Nha, que nada :D

      Excluir
  16. Ah ô Mack aceita afiliação? vou abrir o blog amanha de manha certo? *uu*


    Geekegirlie.blogspot.com

    ResponderExcluir
    Respostas
    1. Aceito sim, quando me colocar avisa? É porque não tenho certeza que vai ver o comentário e tal >3<

      Excluir
  17. Minhas aulas começaram segunda agora, to ansiosa, apenas para usar os materiais. Tentei fazer o tutorial mas não consegui, ficou com dois marcadores. Sim eu recortei u.u

    Kisses Vices of life(clique)

    ResponderExcluir
    Respostas
    1. As minhas também T_T Você deve ter recortado o código errado, porque são dois e tal >3<

      Excluir
  18. Orando por você que tem aula ainda APSOKPOKASPO' boa sorte, aposto que chegou pisando nazinimiga. -q
    Bom tuto, é realmente bem fácil. <3
    Beijos!

    www.blogblackcherry.com

    ResponderExcluir
  19. Muito bom esse tutorial, primeiro que faço e funciona certinho. Parabéns!
    maraudersmapbr.blogspot.com

    ResponderExcluir

O blog não é mais atualizado com novas postagens. Mas fique à vontade para perguntar algo do seu interesse, seja relacionado às postagens ou dúvidas que lhe inquietam, estou algumas vezes entrando no blog e certamente verei se tiver comentários pendentes. Obrigada pela visita, leitor!