Mil Trucos Bloggers

Tutoriales y recursos para Blogger

Select Menu
  • Home
  • Blogging
    • Tutorial Blogspot
    • CSS
    • jQuery
    • Widget
  • Tools
    • Font Awesome
    • HTML Editor
    • HTML Encrypter
    • Code Color
    • Responsive Cek
  • Sitemap
  • Static Page
  • Error Page
Home » Gadgets y Widgets » Recomendados » Elegante Widget de suscripción para Blogger

domingo, 19 de mayo de 2013

Elegante Widget de suscripción para Blogger

Add Comment
Gadgets y Widgets, Recomendados
domingo, 19 de mayo de 2013
Azul + Color + Social + + Suscripción Widget

Hola!! Navegando por la web me encontre con este widget de suscripcion que se ve muy elegante para nuestro blog.
Voy a explicar cómo agregar este cuadro de suscripción para blogger con icons.hope sociales.
Mediante el uso de esto, los usuarios pueden suscribirse a su blog. Por lo tanto, ayudará a obtener las nuevas actualizaciones por correo electrónico. Este Widget usa CSS.

Vamos a ponerlo en nuestro blog.........

1. Como ya es costumbre vamos a Diseño >> Añadir un gadget >>  HTML / JavaScript.
Después añadir este código:

<style>
#sidebar-subscribe-box{width:300px;border:1px solid #aaa;border-radius:3px;padding:3px 0}
 .sidebar-subscribe-box-wrapper{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFfg6bk2yZs0zHjhJwBky2Hb60uCEDOHU2KPLWay13qRIp7qeSWT__qTvF0y5DkiOyohVTys2-iO3XY8Au9D7byNXlriCF4pxuvg8R9EvEUKQjg0o6Vs7qORpQOWTN1ujk9XXpiCO8zmA/s1600/background.png) repeat scroll 0 0 #f7f7f7;color:#111;font-size:14px;line-height:20px;padding:1px 20px 10px;text-align:center;text-transform:uppercase}
 .sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0}form.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto}
 .sidebar-subscribe-box-email-field{-moz-border-radius:4px;-webkit-border-radius:4px;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnfcPuXoJxISSgXo8JXlTxlYPU60IeI6dY8nC5xN0lj7_n1dT5j6NYnxa_QBeADzuqIU4jKRchVewxX5YONeqv3TC7w4zXoL25QxycRMFxkhxy6eozoA0gZ9fXDpyYQDD8TzehPPnX7WA/s1600/icons.png) no-repeat 0 -27px;border:1px solid #ccc;border-radius:4px;color:#444;margin:0 0 15px;padding:10px 40px;width:68%}
 .sidebar-subscribe-box-email-button{background:#09f;border:1px solid #007fff;box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 1px 0 transparent;color:#fff;cursor:pointer;font-family:verdana;font-weight:700;padding:10px;text-shadow:1px 1px 0 rgba(0,0,0,.4);text-transform:uppercase;width:100%}
 .sidebar-subscribe-box-email-button:hover,.sidebar-subscribe-box-email-button:focus{background:#1ca4ff}
 .sidebar-subscribe-box-email-button:active{-moz-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;outline:0}iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table{width:100%}embed{border-radius:3px;-moz-box-shadow:0 2px 4px rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 4px rgba(0,0,0,0.2);background:#FFF;border:1px solid #ddd;box-shadow:0 2px 4px rgba(0,0,0,0.2);margin:0;padding:4px 4px 4px}
 #footer-section{border-top:1px solid #aaa;box-shadow:inset 0 4px 6px -3px #aaa;font-family:cambria;font-size:14px;height:100px;margin:10px -30px 5px;padding:0 30px;text-align:center;width:100%}
a.social-icons{margin-right: 5px;height:45px;width:45px;}
a.social-icons:hover { opacity: .7; filter:alpha(opacity=70);}
</style>
<div id="sidebar-subscribe-box">
<div class="sidebar-subscribe-box-wrapper">
    <br/>
<a class="social-icons" href="https://facebook.com/mi_pag"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZwl9KPQ1D1zWeEP9Ybwjg-YVdyOdqjg7tIs1lsIUPO5wjU_h9cs3ZAsY0gjgB2cFBd8T6CyAhGS3tZKkKrplsm9Vac_zjIZxgSEt7BqxpGN3elK8wF-yKhQQkfZkWVJj4YiIGZkvMcXMh/s1600/Bloggertrix-facebook.png" /></a><a class="social-icons" href="https://twitter.com/mi_usuario"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT3j9D1JqJCSDYSNKbwmUCe10lUGdwH2NszZMocGJQTclTGbr_Toip3z93Nk956XUcBAzzPlzq82XWw0CZDuLm8cFeAp_6geat-jgJexVPEXVJeeGhMVS3bqdA1UkH9ATfwGM4BiP3Hu3f/s1600/bloggertrix-twitter.png" /></a><a class="social-icons" href="https://plus.google.com/mi_Usuario"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirJCfGkRTqgnkzZklfPeP1cLBqK5dsc9CP0WvpvllxqhYYYH7ImKQ7h4d7PyzFfl3vD735FJq2CAW-zwBuNoGeoHD4YShj5KgsUYDLn0ETbOyRAxvrREblW2SPmajfndFjU9J3Nul4vXFN/s1600/Bloggertrix-Googleplus.png" /></a><a class="social-icons" href="http://www.feedburner.com/mi_feed_id"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUvymHVdebclSOuwwSMXqUGD3tzOWi52_E4wYqeIocRN5kO7lUeBchaqUIAQftrOSV0FacOql5sZ3bagZ0fyxcoHLBOiYFxwgVYsi-henVoEczfrP1RPzj8cjW2mmXHBWaOCjmCyQmtdWr/s1600/Bloggertrix-Rss.png" /></a><p>Subscribe To Our Email Newsletter & Receive Updates Free</p>
<div class="sidebar-subscribe-box-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=id_Feed" class="sidebar-subscribe-box-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Tu_id_Feedburner', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="bloggertrix" /><input name="loc" type="hidden" value="en_US" /><input class="sidebar-subscribe-box-email-field" name="email" autocomplete="off" placeholder="Enter your email address here"/><input class="sidebar-subscribe-box-email-button" title="" type="submit" value="Subscribe Now !" /></form>
</div></div></div>

2. Sustituye todo lo que esta en azul por tus datos y listo.

- Puedes cambiar donde dice: Enter your email address here por lo que quieras.


Share

Like

G+

Tweet

Tweet
0 Komentar untuk "Elegante Widget de suscripción para Blogger"

Add Comments

Entrada más reciente Entrada antigua Página Principal
Suscribirse a: Comentarios de la entrada (Atom)

Popular Week

  • Scroll infinito en Blogger
    Scroll infinito en Blogger
    Una de las nuevas formas de cargar una pagina web o blog, es el scroll infinito , el cual consta en que a medida que se vaya bajando el con...
  • Pop Up Me gusta de Facebook para Blogger
    Pop Up Me gusta de Facebook para Blogger
    Un usuario anonimo me pidio un truco tipo PopUp en el se mostrase el boton Me Gusta de Facebook,y buscando un poco he encontrado el tutorial...
  • Últimas Entradas Personalizadas con Icono
    Últimas Entradas Personalizadas con Icono
    Hace unos dias publique una entrada titulada  Ultimos Comentarios Personalizados con Icono ,pues bien despues de probar un rato con los codi...
  • Plantilla BloggerTube
    Plantilla BloggerTube
    BloggerTube es una de las plantillas mas populares entre los Bloggeros en especial para aquellos que desean crear un blog de videos o musica...
  • Las 5 etapas en la vida de un blogger,¿En qué fase te Encuentras ya?
    Las 5 etapas en la vida de un blogger,¿En qué fase te Encuentras ya?
    Hola estimados lectores. Creo que este artículo lo verán un tanto familiar algunos colegas, porque probablemente se apegará a varios sucesos...
  • Cambiate a facturas electronicas
    Cambiate a facturas electronicas
    Las facturas de papel fueron en su momento una gran idea pero en este siglo que ha sido denominado "el siglo de la tecnologia" han...
  • No olvides hacerle SEO a tu web
    No olvides hacerle SEO a tu web
    Ya en Mil Trucos Blogger hemos hablado sobre el SEO, pero hoy hablaremos para que sirve verdaderamente el SEO ya que he recibido muchas duda...
  • ¿Blogger es el producto favorito de Google?
    ¿Blogger es el producto favorito de Google?
    ¿Blogger es el producto favorito de Google?, esa es la pregunta que muchos se harán, luego de leer mi post de ayer el cual se titulaba  ¿Blo...
  • Añade un foro a tu blog con Nabble
    Añade un foro a tu blog con Nabble
    Ya he publicado varias entradas con foros para Blogger pero esta vez les recomiendo Nabble,el cual es el sistema que uso actualmente en el f...
  • Juegos Android- Otro acierto de Google
    Juegos Android- Otro acierto de Google
    Desde que los celulares con el sistema operativo de Google: Android se volvieron muy populares ha crecido en torno a ellos una gran comunida...

Labels

  • Anuncios Oficiales
  • Comentarios
  • Concursos
  • Consejos
  • Dominios
  • Efectos
  • Feed
  • Festividades
  • Gadgets y Widgets
  • Humor
  • Imágenes
  • Monetiza tu blog
  • Off Topic
  • Plantillas
  • Recomendados
  • Recursos Web
  • Recursos Wordpress
  • Redes Sociales
  • SEO
  • Trucos Blogger
  • Tutoriales Blogger

Blog Archive

  • ►  2014 (20)
    • ►  enero (20)
  • ▼  2013 (322)
    • ►  diciembre (34)
    • ►  noviembre (31)
    • ►  octubre (35)
    • ►  septiembre (33)
    • ►  agosto (42)
    • ►  julio (13)
    • ►  junio (17)
    • ▼  mayo (26)
      • Seguidores Blogger, Twitter y Facebook - Flotantes...
      • Programar la Publicación de tus entradas en blogger
      • Dividir el texto de una entrada en dos Columnas
      • No olvides hacerle SEO a tu web
      • Instalar Google Analytics en Blogger fácilmente
      • Joderinga- Mi nuevo blog
      • Scroll infinito en Blogger
      • Elegante Widget de suscripción para Blogger
      • Sexy Drop Down, Menú Desplegable para Blogger
      • Cajon "Popup" de Bienvenida Usando jQuery para Blo...
      • Gadget de Formulario de Contacto en Blogger
      • Google Play- La tienda de aplicaciones de Android
      • Samsung Galaxy S4- La sensación del momento
      • Sube posiciones rápidamente en Google con un buen ...
      • Mensaje del formulario de comentarios, siempre vis...
      • Cambiar los enlaces de navegación por el titulo de...
      • El desarrollo web y el diseño web (Un modo de vida)
      • Google Glass (Gafas de realidad aumentada)-La nuev...
      • Nueva Zona de Negocios en Mil Trucos Blogger
      • Como elegir el fondo adecuado para tu sitio web
      • Fanbox de Facebook, Twitter, y Google +, flotantes...
      • DCM Dark- Plantilla Premium para Blogger
      • Los mejores juegos de vestir para ti
      • Facebook en tu celular-Una gran app para Bloggeros
      • Banahosting-El mejor hosting para alojar tu web
      • Añadir los comentarios de Google Plus en WordPress
    • ►  abril (30)
    • ►  marzo (22)
    • ►  febrero (15)
    • ►  enero (24)
  • ►  2012 (171)
    • ►  diciembre (19)
    • ►  noviembre (20)
    • ►  octubre (13)
    • ►  septiembre (15)
    • ►  agosto (10)
    • ►  julio (10)
    • ►  junio (8)
    • ►  mayo (15)
    • ►  abril (12)
    • ►  marzo (15)
    • ►  febrero (19)
    • ►  enero (15)
  • ►  2011 (186)
    • ►  diciembre (20)
    • ►  noviembre (16)
    • ►  octubre (16)
    • ►  septiembre (16)
    • ►  agosto (18)
    • ►  julio (19)
    • ►  junio (22)
    • ►  mayo (25)
    • ►  abril (28)
    • ►  marzo (6)

Labels

  • Anuncios Oficiales
  • Comentarios
  • Concursos
  • Consejos
  • Dominios
  • Efectos
  • Feed
  • Festividades
  • Gadgets y Widgets
  • Humor
  • Imágenes
  • Monetiza tu blog
  • Off Topic
  • Plantillas
  • Recomendados
  • Recursos Web
  • Recursos Wordpress
  • Redes Sociales
  • SEO
  • Trucos Blogger
  • Tutoriales Blogger

Labels

  • Anuncios Oficiales
  • Comentarios
  • Concursos
  • Consejos
  • Dominios
  • Efectos
  • Feed
  • Festividades
  • Gadgets y Widgets
  • Humor
  • Imágenes
  • Monetiza tu blog
  • Off Topic
  • Plantillas
  • Recomendados
  • Recursos Web
  • Recursos Wordpress
  • Redes Sociales
  • SEO
  • Trucos Blogger
  • Tutoriales Blogger

© Mil Trucos Bloggers Published By Kaizen Templates powered by Blogger.com.
All Right Reserved By .