Sejam bem vindos meu ao bloguinho, ele foi criado com o intuito de ensinar a quem necessita de ajuda em html e css, temos diversos tutoriais e materiais. Fiquem bem a vontade e qualquer dúvida que tiverem entrem em contato comigo ou peçam pela ask. Beijinhos caramelados e inté mais ♡
Search here
All that you want is here, css and html
Welcome to garota no mundo html.
- efeito legenda nas imagens de posts
- backgrounds grandes em aquarela
- Avatar do autor no post footer
- Leia mais na mesma linha do header
- Efeito Dragqueen e efeito Swing
- Três modelos de menus agenda
- Usando temas de tumblr no blog
- Criando seu próprio modelo de data
O tema atual do layout é: the fall of leafs
A meta dos posts do blog é de: 300 posts
A meta de comentários do blog é de: 3500
O blog foi inaugurado no dia: 27/12/2012
os Seguidores do blog atualmente são: 865
A versão atual do layout está na: 41ª vers.
folhinhas que estão no blog online agora:
folhinhas que já passaram por aqui:

Avatar do autor ao lado do post

Olá meus anjos tudo bem? o(^∀^*)o Como vão? Eu se por acaso quiser saber, eu estou um caco de tão cansada, sai de casa as 7:40 e fui chegar em casa depois das 22:00 estou bem cansada mesmo afinal fazia tempo que não andava como andei hoje haha. Essa semana parece que deu tudo errado, perdi várias vagas de emprego na área que estou estudando e isso me deixou péssima, uma porque perdi a carteira de trabalho, e outra porque fui atrás ver e fazer outra e pode demorar de 5 a 10 dias para chegar. Pois é, irei voltar de férias e terei que continuar onde estou que não é a área que tanto quero ( Ĭ ^ Ĭ )  Fazer o que, o jeito é esperar a outra carteira chegar ′︿‵。

Mas então, acho que me pediram este post uma década atrás e na época que me pediram eu lembro que não postei porque estava com aquela frescura de não postar nada do tema atual e acabei não postando depois porque esqueci. Até peço desculpas por isso, hoje em dia to pouco me lixando por efeitos ou qualquer coisa que eu use nos meus layouts, se alguém me pedir eu posto mesmo, aquele tempo de frescura não existe mais e que ridículo da minha parte isso Argh. Mas acredito que são tudo fases nas nossas vida né? Haha, me desculpem mais uma vez e se alguém tiver alguma vontade de algum efeito meu dos meus layouts podem pedir tá? Vamos ao tutorial? o/

LIVE PREVIEW σ(≧ε≦o)

Salve o seu modelo antes de fazer as modificações certo? Vá até o seu modelo e clique em editar html, dentro procure por: <a expr:name='data:post.id'/>  Não é o primeiro código é o segundo, depois que acha-lo copie o próximo código e cole abaixo dele.

<b:if cond='data:post.author == &quot;NOME DO 1º AUTOR&quot;'>
<span class='author'><img src='LINK DA IMAGEM'/>
</span></b:if><b:if cond='data:post.author == &quot;NOME DO 2º AUTOR&quot;'>
<span class='author'><img src='LINK DA IMAGEM'/></span>
</b:if><b:if cond='data:post.author == &quot;NOME DO 3º AUTOR&quot;'>
<span class='author'><img src='LINK DA IMAGEM'/></span>
</b:if>


Onde está escrito NOME DO AUTOR é onde vocês irão por os nomes dos autores que irão moderar o blog, caso seja só um coloque só o seu nome do perfil do blogger, tem que estar exatamente como no seu perfil com símbolos, números ou o que for se não o avatar não irá aparecer certo? 

Para mostrar o avatar e por efeitos nele, vá até o modelo de novo e procure por: ]]></b:skin> e acima dele cole o seguinte código:

/*-Efeito nos autores de posts por gnmh*/
.author img{
widht:50px;
height:50px;
padding: 2px;
float: right;
margin-right: -75px;
margin-top:-12px;
opacity: 0.9;
outline: 1px solid #fff;
outline-offset: -2px;
background: #FFF;
border: 2px solid #ebe7d9;
box-shadow: inset 1px 1px 0px #fbfaf6;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease;
-o-transition: all 2s ease;
transition: all 2s ease;
-webkit-transition:all 1s;
}
.author img:hover {
opacity: 1;
outline: 1px solid #E6D6EB;
outline-offset: -40px;
background:#D9CEE3;
border: 2px solid #ebe7d9;
box-shadow: inset 0 0 6px #D4E3E8, 0px 1px 1px #D4E3E8;
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease;
-o-transition: all 2s ease;
transition: all 2s ease;
}

Vocês irão pode modificar tudo, o tamanho da imagem, as cores do background, os efeitos e as margens, modifique até ficar ao seu gosto e caso queira a imagem no lado esquerdo da postagem onde está FLOAT: RIGHT; vocês irão mudar para FLOAT: LEFT; e edite as margens até se alinhar.

4 comentários:

  1. Oi minha querida vakenha <3
    Também estou morta, lembra da minha vida fitnnes? Ainda está de pé pelo incrível que pareça ueheuheuhe'
    Mas enfim, eu sempre procurei por esse tutorial, acho tão fofo o avatar do ladinho <3
    Roh salvando vidas ~
    ~nunca feche esse blog pelo amor de deuos~

    Beijos! Leadership ♡

    ResponderExcluir
  2. Oii o/.
    Eu estou bem, e você? Cara, eu procurava esse tutorial a dias! E não achava em lugar nenhum, e agora eu finalmente o encontrei \o/. Eu acho que fica uma fofura o avatar do autor no lado do post ♥, e também fica mais fácil em saber quem postou! Adorei o tutorial ♥, vou tentar mais tarde!
    Kisses candy ♥ l http://candycherry-bynate.blogspot.com.br/

    ResponderExcluir
  3. É muito fofo! Eu já tinha visto antes e queria muito ter igual no blog, acabei de ver no meu lay e tem espaço suficiente para usar, vou testar no blog de teste, pois é muito fofo ele ♥

    Pietra DeLuna | http://vanillaegeek.blogspot.com.br

    ResponderExcluir
  4. Eu sempre achei muito lindinho isso de foto do autor do lado do post <3 É difícil encontrar um tutorial assim, mas a Roh tá muito lacradora esses dias e não para de postar tutorial mega útil e lindos c': Arrasa, coração ♥

    ResponderExcluir

Olá meus amores, os comentários devem ser direcionados somente ao blog e não a vida pessoal de ninguém! Qualquer dúvida peça pela Ask que responderei o mais rápido possível. Anônimo não adianta vir xingar pelos comentários que antes de mesmo de pensar em me ofender eles serão excluídos! Não gosto de tags, se quiser fazer fique a vontade mas não irei retribuir, não curto seguindo segue de volta =/ mas posso seguir se gostar realmente do blog, não julgo por layout ou por seguidores, avalio o blog e como disse se eu curtir é claro que sigo, afiliações? Peça nos comentários pois se pedir em outro lugar no caso páginas é bem provável que eu não veja! Então meus lindos espero que curtam cada cantinho do meu bloguinho e voltem sempre! kissus (*^3^)