Aprendendo mais três tutoriais..


  Então gente, meu blog falta apenas mais um membro para os desejados 300 Seguidores, eu estou preparando um novo Layout para o eJhonas mais está difícil escolher a cor {RSS}, por apenas um motivo, meu blog já teve algumas cores, então não quero fazer com elas.. ai eu faço um falo a não tá horrível essa cor, faço outro, mesmo resultado.. ai assim vai.. Aé, quase esqueço de dizer umas coisinhas, na postagem anterior adorei TODOS os comentários, eu um por um, e vi que todos leram aquele pequeno texto que eu fiz sobre como era a nossa infância, nossa eu lembrei de tanta coisa, quando acabei de postar, que falei a não, vai ficar muito longo, terá que ficar assim mesmo {rss}.. Sobre a postagem, eu irei mostrar para vocês três tutoriais super legais, simples de fazer, e super essencial!
 Eu andei por alguns blogs aprendendo alguns tutoriais, ai consegui juntar {não sei como}, o tutorial de mudar cursor com o de negrito, itálico, e sublinhado personalizado! Ou seja, quando você passar o mouse em uma determinada palavra que esteja com algum dos três itens falados anteriormente, o cursor irá mudar ficando com um ponto de interrogação na diagonal dele! {Muito legal, né?}

Negrito, itálico, sublinhado personalizado com mudança de cursor!

 Entre em Design  Editar HTML  Expandir Modelo de Widgets  Ctrl + F  Procure por:
]]></b:skin>
 Logo acima você deverá colar este código: 
b {color: #FF6EB4; text-decoration: none; cursor:  help ; -webkit-transition-duration: .70s; } /* Estilo do negrito */
i {color: #E6E6FA; text-decoration: none; cursor:  help ; -webkit-transition-duration: .70s;}
/* Estilo do italico */
u {color: #000000; text-decoration: none;
border-bottom: 1px dashed #AFEEEE; cursor: help; -webkit-transition-duration: .70s;}/* Estilo do sublinhado */
  Agora só testar em um postagem, e prontinho, super simples, né?!

Caixinha para Códigos

 Na área de postagem mesmo, coloque este código:
<div style="background-image: url(http://www.web-midia.com/coisinhas%20mil/coisinhas_de_posts/patterns/77words_patterns6_093.gif); border-bottom: #d8d2d6 1px dotted; border-left: #d8d2d6 1px dotted; border-right: #d8d2d6 1px dotted; border-top: #d8d2d6 1px dotted; color: black; font-family: verdana; font-size: 11px; height: 80px; overflow: auto; width: 255px;">
TEXTO</div>

Apenas poderá modificar apenas os itens em negrito, já no item em itálico você deverá colocar o que você quer que apareça dentro da caixa, querem uma dica, onde está "255px" modifiquem para que fiquem bem legal no seu layout, assim como eu modifico aqui {Veja uma demostração de como fica, clique aqui}, Pelo incrível que pareça este tutorial você tem que saber, para quem posta este tipo de assunto no blog {Porque eu devo saber?} Porque tem alguns tipos de códigos que pela mor de Deus são enormes {RSS}, se for colocar normalmente a página vai só Deus sabe onde.. {xD}, aprendi com diversos blog's, porém esse aqui eu peguei da Cherry Bomb!

Personalizando a Tooltip

 Aos que não sabem o que é isto, basta ver a imagem abaixo:

  São essas ondinhas.. São bem simples de se fazer, vamos lá ;)
Design  Editar HTML  Expandir Modelo de Widgets  Ctrl + F  Procure por:
</head>
Logo após achar esta tag, acima dela cole este código:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/><script language='JavaScript' src='http://static.tumblr.com/oiizew6/8B5lzwf17/script.js' type='text/JavaScript'/> 
Novamente dê Ctrl + F, e procure por:
]]></b:skin>
div#qTip {
padding: 3px;
background: #eee5de*/ Fundo */color: #8b8378; */ Cor da letra */
position: absolute;
 z-index: 1000;
 border: 1px solid #8b8378; */ Cor da Borda e forma da borda */
display: none; font: bold arial; */ Fonte */ -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } 
  Bem, onde está em negrito você deverá modificar para a cor que desejar, já em itálico você poderá modificar pela borda que desejar, caso queira ver quais tipos tem, veja logo abaixo:

 Logo acima vocês estão vendo as bordas, pontilhadas, solidas, etc.. todos os nomes em HTML dela estão dentro de cada uma.. elas são 10 sinceramente, e o mais importante, são muito importante saber para colocar em por exemplo, na barra de rolagem com borda pontilhada, parte de comentários.. e assim vai.. Devo esses código á Pink Pimenta, e por sinal o Tutorial esse tutorial da Tooltip eu aprendi com o Se eu fosse você!
Espero que tenham gostado dos tutoriais de hoje, e da das bordas que mostrei para vocês ;)

41 comentários:

  1. Ótimos tutoriais. Feliz, por ser seu seguidor número 300.

    Tem post novo, espero você lá:
    http://construtordepensamentos.blogspot.com.br

    ResponderExcluir
  2. adorei os tutos, parabéens pelo seguidores :D
    Beeijos ;*
    http://itsblond.blogspot.com.br/

    ResponderExcluir
  3. Wooow, parabens pelos 300 seguidores. E eu não sabia o que era Tooltip, usei no meu outro blog e ficou muito fofo, é um pouquinho complicadod e colocar, mexe muito no HTML! Mas obg ^^. E os outros tutos tb sao bem legais bjs


    fixalove.blogspot.com.br

    ResponderExcluir
  4. Amei os tutoriais,tava procurando 2 desses.Parabéns pelos 300 seguidores.
    lifeonalin.blogspot.com.br

    ResponderExcluir
  5. adoro tutoriais *-*
    mto bom . você já virou um ícone mino *--*

    :* Beijos e fique à vontade para visitar o AD ((:
    http://mini-fofoquinhas.blogspot.com.br/

    ResponderExcluir
  6. Adorei o tutorial, bem diferente!
    Bjos!
    amonailart.blogspot.com

    ResponderExcluir
  7. Adorei os tutoriais. ^-^
    http://bubble-explosion.blogspot.pt

    ResponderExcluir
  8. Gostei dos tutorial Jhonas!
    Hihi :3

    www.ingridsakamotodossantos.tk
    Obrigada pela sua visita, ela é muito importante pra mim viu? Volte sempre amore♥ Se puder na próxima vez que você for visitar o blog, você pode clicar no banner da Cappuccine Store? É só você clicar e sair! É Menos de 1 minuto! Fico grata se fazer isso!

    ResponderExcluir
  9. A-D-O-R-E-I concerteza vou seguir Jhon hahaha amei mesmo beijinhos e valeeeu a passada la no G.S

    ResponderExcluir
  10. Ameei os tutoriais , muito util ... amei o blog ,vou seguir , e se gosta do meu segue tbm :
    --> http://sweet----girl.blogspot.com.br

    ResponderExcluir
  11. Muito bom os tutoriais, super úteis! Jhonas, eu to seguindo seu blog, e recebo que você está postando, mas meu quadrinho de seguidor não aparece aqui :/

    E parabéns pelos 300 seguidores! :)

    Beijos, Paula
    sweetmakeups2.blogspot.com

    ResponderExcluir
  12. Ameei os tutoriais *-*

    Beijos ;*
    www.thalitamaia.com

    ResponderExcluir
  13. Muito legal! Adorei! Vou tentar fazer o último!
    :D
    Beijos...
    Batom De Framboesa

    ResponderExcluir
  14. uso os dois primeiros...
    São simples mas deixam o blog bonitoo ^^
    bjs
    noisconectados.blogspot.com.br

    ResponderExcluir
  15. Adorei os tutoriais! Parabéns pelos 300 seguidores ><
    Beijo
    # Candy Girl

    ResponderExcluir
  16. Oba! quanto tutorial! gostei de todos, muito úteis!
    bjs
    http://blogtrashrock.blogspot.com.br/

    ResponderExcluir
  17. Eu tirei a caixinha de códigos do meu, agora to usando só os códigos syntax *-*
    Demora pra carregar mas é útil.
    Blog Garotas Do Contra

    ResponderExcluir
  18. São tutos bem básicos mas muito úteis ;)

    Beijos♥

    carismaticaoficial.blogspot.com

    ResponderExcluir
  19. Ótimos tutoriais, bem úteis.
    Bem explicadinho tbm :D

    Bjoos ~~> http://fannydream.blogspot.com

    ResponderExcluir
  20. Os tutoriais estavam ótimos o que mais gostei foi do segundo ,vou usar *-*

    Ah ,meu blog: day-princess.blogspot.com

    ResponderExcluir
  21. Adorei os tutoriais >.<

    Agradeço pela visita lá no meu blog e por seguir também (: Estou seguindo seu blog e peço desculpas pela demora '-'

    Sweet Mulberry:
    http://meublog-jaque.blogspot.com.br/

    ResponderExcluir
  22. Adorei os Tutoriais ! Salvei nos favoritos .

    http://mundo-teens-mt.blogspot.com/

    ResponderExcluir
  23. Adooooorei os tutorias ! Vou usa-los :)

    Beijos! http://porckybunny.blogspot.com

    ResponderExcluir
  24. gostei dos tutoriais, super úteis *uu*
    salvei nos favoritos o link pra quando eu for trocar de lay :3
    http://commirajane.blogspot.com.br

    ResponderExcluir
  25. Hooy,obrigado por seguir meu blog.Já estou te seguindo também!

    Os tutoriais são ótimos,são os que eu mais uso
    Beijo.
    cherrycandy-viih.blogspot.com

    ResponderExcluir
  26. Nha que bom né? Tem nada melhor do que saber que leram nosso texto não?

    Ah esse tuto eu já sabia! Mas é muito legal *u*

    Uprising Teen

    ResponderExcluir
  27. Ah já votei em você no Miki Candy, boa sorte *u*

    Uprising Teen

    ResponderExcluir
  28. Gostei dos tutorias , sempre procuro alguns e nunca acho *-*

    Já estou seguindo de volta >.<

    http://modicesdemenina.blogspot.com.br

    ResponderExcluir
  29. que legal sua tia ter gostado do post :D ficou muito feliz com novas visitinhas.. adorei o post sou iniciante como blogger rs..seja sempre bem vinda! tem post novo bora dar uma olhadinha :D um ótimo domingo pra vc! kisses :*

    FabulousStylish

    ResponderExcluir
  30. oi td bem? meu blog esta dando seus primeiros passos convido voce para fazer uma visita e comentar :)

    http://blogdaprigomes.blogspot.com.br/

    ResponderExcluir
  31. ain q legal isso do cursor, mto bom o tuto.
    E descobri pq seu blog não entrava antes, eu num puis o (www) {samira burra} hahah.
    Fico muito feliz que vc tenha gostado do meu texto e mais feliz ainda por vc ter lido :)
    esta com 307, hahaha num falta mais nenhum pra chegar nos trezentos, e eu tenho certeza q vc e seu blog tbm irão mto longe 400, 500, 1000, vamos la! obrigada :)Viu, cm esta seu facebook?
    bj
    Sah
    lamourmonage.blogspot.com

    ResponderExcluir
  32. já te coloquei lá meu ídolo *-* eheheheheh

    :* Beijos e fique à vontade para visitar o AD ((:
    http://mini-fofoquinhas.blogspot.com.br/

    ResponderExcluir
  33. Muito legal os tutoriais! parabéns!!
    bjoos
    Laís

    ResponderExcluir
  34. Amei os tutoriais, parabéns !
    besos ♥

    plush-girl.blogspot.com

    ResponderExcluir
  35. Oi ! Retribuindo visita ! Lindo Blog ! Beijos
    http://esquadraoedition.blogspot.com/

    ResponderExcluir
  36. Ta muito bem explicado,adorei o blog!
    http://balaio-sonhos.blogspot.com

    ResponderExcluir
  37. Ótimos tutoriais, fica lindo o blog com o tooltip personalizado, eu nem sabia que tinha tantos estilos de borda.

    diamantesdeumagarota.blogspot.com

    ResponderExcluir
  38. Oiie, que bom que me visitou! Fiquei feliz!
    Sempre com dicas legais pra gente, né? =))

    Beijinhos! <3

    www.shoeccessful.blogspot.com.br

    ResponderExcluir
  39. Ameei os tutoriais, ótimos como sempre! :D
    Já uso alguns no meu blog, e adoro ^^

    Beeijos
    http://mikicandy.blogspot.com

    ResponderExcluir

© eJhonas - 2012. Todos os direitos reservados.
Design Jhonas Balsas.
Tecnologia do Blogger.
imagem-logo