Tutorial: Botones flotantes: Follow & Dashboard


¡¡Hola a todos mis tomodachis-nekos!! Hoy les traigo un tutorial muy simple y fácil de unos botoncitos flotantes de {Follow} y {Dashboard} Obviamente lo pueden personalizar o cambiar a su gusto ^^

Así les quedaría en la parte superior, esquina derecha de su blog:


Para empezar vamos a:
Diseño | Añadir un gadget | HTML/Javascript

Y copiamos y pegamos el siguiente código:
<style text="css">

a.button{background:#FFDDDD;color:#ffffff; -webkit-transition: 0.4s; -moz-transition: 0.4s;text-decoration:none; font-family:calibri;  font-size:12;padding:5px;border-radius:5px;width:70px;text-align:center;display:inline-block;}
a.button:hover{background:#D6CBF4;-webkit-transition: 0.4s; -moz-transition: 0.4s;color:#ffffff; text-decoration:none; font-family:calibri;  font-size:12;padding:5px;border-radius:5px;width:70px;text-align:center;display:inline-block;}
</style>
<div style="position:fixed; top :5px; right:5px;">
<a class="button" href="http://www.blogger.com/follow-blog.g?blogID=5592144585522485075">Follow</a> <a class="button" href="http://www.blogger.com/home">Dashboard </a> </div>

Editemos:
ROJO: Color del fondo del botoncito
NARANJA: Color de las letras del botoncito
AZUL: Color del fondo del botoncito al poner el cursor sobre él
VERDE: Color de las letras del botoncito al poner el cursor sobre él
ROSA: Link 1
BORDO: Link 2
CELESTE: Lo que dice en los botoncitos

Ante cualquier duda diganme en los comentarios :3
Eso es todo, espero que les haya gustado este tutorial :3

6 comentarios:

  1. Ohayo!! ᕙ( ^ₒ^ c)

    waaa que lindoooo... arigato x el tuto :3


    por cierto tienes un premio en mi blog (っ◔◡◔)っ ♥ http://ghaabycaptor.blogspot.com/2014/08/sobre-mi-premios-3.html

    ResponderEliminar
  2. Gracias por el tutorial !! esta muy lindo y siempre es más lindo ayudar a las personas jeje.
    Un saludo :).

    ResponderEliminar
  3. Muy lindo el tutorial, creo que lo aplicare al blog a ver que tal se ve :3

    ResponderEliminar
  4. Podrías decirme como conseguir el link de follow?

    ResponderEliminar
    Respuestas
    1. Ok nada, ya me di cuenta de donde conseguirlo ^^

      Eliminar

Comenta con respeto ^-^

¡Gracias por tu comentario!

Emojis:
(∩ω∩) | (>△<) | (>▽<) | (⊙▽⊙) | (╯ω╰) | (☆▽☆) | (≧ω≦) | ≡(▔﹏▔)≡ | ( ̄(エ) ̄) | (・∀・ ) | (ノ◕ヮ◕)ノ*:・゚✧ | (^▽^) | (¬_¬) | ✖‿✖ | (¬‿¬) | (─‿‿─) | (~ ̄▽ ̄)~ | (︶ω︶) | (+_+) | (。♥‿♥。) | (✿ ♥‿♥) | ●ᴥ●

Simbolos:
☺♥♫△☆ღ