LoQueMeSaleDelRatón

By David Miralles

Caso práctico – Crear widget de suscripción y editarlo a nuestro gusto

En mis dos ultimos post vimos como crear un widget de suscripción para nuestro blog con FeedBurner y posteriormente como utilizar el código HTML y CSS para poder mejorar nuestro blog. En esta nueva entrada explicaré como he modificado el código del widget de suscripción que creamos dias atrás. Así conseguiremos un widget atractivo, optimizado y adecuado a nuestro blog.

A continuación, está el código del widget que nos a proporcionado FeedBurner:codigo widget wordpress

Si os fijais hay un div o contenedor donde está toda la información del widget. Introduje, el fondo de color blanco y además el redondeo de las esquinas del div. Las lineas de codigo necesarias eran:

El fondo del div, como expliqué en el anterior artículo se realiza de la siguiente forma:

background-color:#ffffff;

Para redondear las esquinas inserté esta , la primera para mozilla firefox y la siguiente para Chrome e IExplorer. Los números que aparecen son el radio que se le aplica a cada esquina.

-moz-border-radius: 10px 10px 10px 10px;                                                                                                                                         -webkit-border-radius: 10px 10px 10px 10px;

También añadí una pequeña línea de información:

<p style=”color:white; font-size:6px; margin-left:36px; padding-top:0px;”>No Spam. Solo información de artículos</p>

Y finalmente, cambié el nombre del botón “Suscribe” que está en inglés para ponerlo en español. Simplemente hay que cambiar el nombre de dentro de la etiqueta.

<input type=”submit” value=”SUSCRIBETE“/>

El resultado lo podeis ver en el blog, en la página principal (Página principal de loquemesaledelraton.com) o aquí debajo:

widget suscribete

 

Espero que os haya gustado. Comenta, comparte y suscribete!!

One thought on “Caso práctico – Crear widget de suscripción y editarlo a nuestro gusto

Leave a Reply

Your email address will not be published. Required fields are marked *


*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Current month ye@r day *