14 de janeiro de 2015

Tutorial que eu fiz - Colocando Cabeçalho Kawaii no blog

           
                   Yoo Florzinhas!
Finalmente eu consegui terminar de fazer o meu tutorial que é o cabeçalho kawaii!
Afinal não é fácil criar um tutorial. Ele dá um resultado perfeito e tenho certeza que vocês vão A - D - O - R - A - R! Mas agora você pode estar se perguntando, como assim cabeçalho kawaii? Simples! É um modelo de cabeçalho super fofo! Kawaii = fofo. E esse foi o nome que eu dei pra o tutorial Cabeçalho Kawaii, peço que se vocês usarem no blog ou postar, creditem para mim por favor porque fiquei dias tentando arrumar o tutorial e acho que eu mereço os devidos créditos.
Para aprender, clique em continue lendo! Você vai ver o resultado e o efeito do cabeçalho clicando em continue lendo.




 ------------------------------------



Nível do Tutorial: Médio.
dica: o cabeçalho kawaii pode servir para ajudar os iniciantes que não sabem fazer cabeçalhos e sim iniciantes que sabem mexer no HTML.

Bom, vamos começar!
Primeiro vocês vão ter que excluir o cabeçalho. Não vou postar o tutorial nesse post porque já temos ele postado.


Agora preste bem atenção no que vou dizer para você. Depois de ter excluído o cabeçalho, sabe o lugar a onde o cabeçalho estava? Que é a parte de cima? Veja um exemplo para entender melhor:
Clique na imagem para ver melhor.

A onde está marcado de vermelho você clica em adicionar gadget, depois
em HTML/JavaScript e cole esse código:

<br />
<div style="border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; text-align: right;">
<br />
<br />
<br />
<div id="sidebar02" style="background-image: url(Imagem 1 ); background-position: initial initial; background-repeat: initial initial; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; border: 5px solid rgb(209, 240, 255); color: Cor da Letra; height: auto; margin-left: -65px; margin-top: -25px; padding: 65px 3px 15px; position: fixed !important; text-align: center; width: 13620px; z-index: 999;">
<h5 style="font-family: craftygirls; font-size: 42px; letter-spacing: 1px; line-height: 18px; margin-left: 65px; padding: 1px; position: fixed; text-align: left;">
<div id="sidebar01" style="background-image: url(Imagem 2); border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; border: 5px solid rgb(255, 133, 214); height: auto; margin-left: 375px; margin-top: -125px; padding: 15px 3px; position: fixed !important; text-align: center; width: 500px; z-index: 999;">
Título do seu blog</div>
</h5>
</div>
</div> 

Entendendo melhor o código:
Imagem 1 - É pra você por o URL da imagem que vai ficar por fora do balão do título.
Imagem 2 - É pra você por o URL da imagem que vai ficar dentro do balão do título.
Cor da Letra - É a cor da letra do título, clique aqui para ir até a tabela de cores.
Título do seu blog - Provavelmente é para você escrever o nome do seu blog.

E por último, salve e visualize pra ver se deu tudo certinho!

 ------------------------------------



Espero que tenha gostado! Bjs

6 comentários:

  1. Nossa! Perfeito *0*
    Vou usar com certeza!
    Que bom que você está criando tutoriais porque assim o blogguer irá evoluir mais.
    bjinhos

    ResponderExcluir
  2. Amei o tuto!
    O nome combinou porque afinal o cabeçalho é fofo mesmo :3

    ResponderExcluir
  3. Lindo o efeito e super fácil de fazer.
    amei ^-^

    ResponderExcluir
  4. Ahhh muito obrigada por ter feito um tipo de tutorial assim!
    N sei cm fazer cabeçalhos e tento baixar potofiltre e photoscape mas nem consigo!!
    E agr q vc criou esse cabeçalho kawaii td pra mim está mais fácil!
    Obg!!
    Seguindo aq, gostei de seu blog.
    Bjao

    ResponderExcluir

Comente a vontade, desde que saiba respeitar ;)
Ah, e não é necessário fazer uma conta para comentar, basta colocar como anônimo.

Emoticons:

♥❤∞ ☆ ★ ✖ 。◕‿◕。® ™ ☏✿゚✤
(◕‿◕✿) 。◕‿◕。 ⊱✿◕‿◕✿⊰(◡‿◡✿)(◕〝◕)◑▂◐ ◑0◐ ◑︿◐ ◑ω◐ ◑﹏◐ ◑△◐ ◑▽◐
●▂● ●0● ●︿● ●ω● ●﹏● ●△● ●▽●
⊙▂⊙ ⊙0⊙ ⊙︿⊙ ⊙ω⊙ ⊙﹏⊙ ⊙△⊙
≡(▔﹏▔)≡ ( ͡° ͜ʖ ͡°)