Menu "Violeta Gradius"

Para l@s que os guste este color o posiblemente os combine con el estilo de vuestro blog o web, aqui teneis este menu tan chulo diseñado en tono violeta gradient (difuminado) con bordes redondeados. Esta integramente realizado con CSS, es decir que no utiliza ninguna imagen de fondo.

Este es el aspecto del menu, una vez acabado:

Para ponerlo en Blogger puedes añadir si quieres los dos codigos juntos en un gadget HTML/Javascript.
Y si quieres ponerlos por separado, primero añade el codigo CSS en la plantilla antes entre las etiquetas <head> y guardas.

<style type="text/css">
.violetagradius{width:100%;
height:52px;z-index:3000;
}
.izmvg{float:left;
width:40px;
height:52px;
-moz-border-radius-topleft: 20px;
-webkit-border-top-left-radius: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-bottom-left-radius: 20px;
}
.izmvg,.demvg,.violetagradius a{background: -moz-linear-gradient(bottom, #663399, #FFFFFF);
background: -webkit-gradient(linear, center bottom, center top, from(#663399), to(#FFFFFF));
border: 2px solid #444444;
}
.demvg{-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-bottom-right-radius: 20px;
float:left;
width:40px;
height:52px;
border-left:none;
}
.violetagradius a{float:left;
display:block;
height:52px;
border-left:none;
font-family:Helvetica;
line-height:52px;
font-size:18px;
font-weight:900;
text-decoration:none;
color:#FFFFFF !important;
padding:0px 30px 0px 30px;
border-right: 2px solid #444444;-webkit-text-shadow: 2px 1px 2px #000000;-moz-text-shadow: 2px 1px 2px #000000;text-shadow: 2px 1px 2px #000000;
}
.violetagradius a:hover{ background: -moz-linear-gradient(bottom, #441177, #FFFFFF);
background: -webkit-gradient(linear, center bottom, center top, from(#441177), to(#FFFFFF));
color:#FFFFCC !important;
}
.clear{clear:both;
}
</style>

Ahora añades el codigo HTML alli donde quieras mostrar el menu, escribiendo los enlaces donde pone URL y el texto donde esta indicado en color rojo. Si quieres añadir mas enlaces, solo tienes que poner la linea <a href="URL">TEXTO</a> a continuacion de las otras, tantas veces como quieras.

<div class="violetagradius"><span class="izmvg"></span><a href="URL">TEXTO</a><a href="URL">TEXTO</a><a href="URL">TEXTO</a><span class="demvg"></span></div>

Box social para Blogger

Para que l@s que visiten tu blog periodicamente puedan suscribirse por email, a los feeds, agregarte en Facebook o seguirte en Twitter, aqui tienes esta elegante caja social con sus iconos correspondientes. Para añadirlo a tu Blogger, solo tienes que copiar el codigo de abajo y pegarlo a un gadget HTML/Javascript. Antes de guardar, modifica lo que esta en rojo, es decir: tu url de tu Facebook, la de tu Twitter, la de los feeds RSS y la de suscripcion (ahi solo tienes que poner el nombre de tu Feedburner, no la direccion completa). Recuerda que hay que repetir la url de cada sitio 2 veces, una para el icono y otra para el texto.

• 
  

  Sigueme

  Puedes seguir mis actualizaciones en Twitter
• 
  

  Posts RSS

  Lee mis articulos completos en tu lector de feeds favorito
• 
  
  

  Facebook

  Hazte fan en Facebook
• 
  
  

  Subscribete via e-mail

  Recibe mis ultimas actualizaciones en tu correo

<div class="sidebar-subscription">

<ul id="subscription">

<li><a href="URL DE TWITTER" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-7XlDolhEu4A0Dxhd6g5H01p9tqPXgF86VgLHCloCcXXOYzTPvgtCQ2PyGsQVGF6JSAhs6zZEayxVV_dXDwMkP1kTy4qWSuca0s5Lj4o0mOGSMVK6amMQRz_vkuGzqfW7vQcA0orXWHSX/" /></a>

<h4>

<a href="URL DE TWITTER" target="_blank">Sigueme</a></h4>

Puedes seguir mis actualizaciones en Twitter</li>

<li><a href="URL RSS" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4K5TLsCitK4FOGHF5T73e2kAaloEHd-IV73nPxaF7IQrShF-ucQ7Ao0a2MFovcp-3ob5Cn4YGL8Tz3u5_FKk4wiydDw5Dl1TVzbH7e2n3iHS6jvN98_UeZ_B_P8M7zRtU8tLcK8TBhRl5/" /></a>

<h4>

<a href="URL RSS" target="_blank">Posts RSS</a></h4>

Lee mis articulos completos en tu lector de feeds favorito</li>

<li>

<a href="URL FACEBOOK" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGl_FByjBW-LHkMGUeK2tZlAL7UA8PPWbTg1MUrB4Epv0KVH_lVLCgGrCp5vJK7TE31KTLd8Yp-HNwMIRJobb2vYX-nJHdMAYGX6bNioqyHZk3PhNl95D5WTLdG1NSgc-SS2FV8ObfMT73/" /></a>

<h4>

<a href="URL FACEBOOK" target="_blank">Facebook</a></h4>

Hazte fan en Facebook</li>

<li>

<a href="http://feedburner.google.com/fb/a/mailverify?uri=NOMBRE FEEDBURNER&amp;loc=es_ES" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkgYljiBSlTxtUHZ2jDnBFEHkCFNOF9vUw_gEYhp2jJC68M4zvNPI2ZarccwDPvUGOEMFvMMCl2Gsht6m4AdVGCrcMXVSFOdUT6WGVAQcZAopf-v_xiBV70zYbb9cP-Cu7mvTMfcFGPg_t/" /></a>

<h4>

<a href="http://feedburner.google.com/fb/a/mailverify?uri=NOMBRE FEEDBURNER&amp;loc=es_ES" target="_blank">Subscribete via e-mail</a></h4>

Recibe mis ultimas actualizaciones en tu correo</li>

</ul>

</div>

<style>
.sidebar-subscription {
    background: url("http://lh6.ggpht.com/_7Y9pl24WpQY/S_f7UbjdNxI/AAAAAAAAD7k/MRxXLntEnfo/post_head_thumb%5B4%5D.gif") no-repeat scroll 0 0 #FFFFFF;
    border: 1px outset #FFFFFF;
    color: #000000;
    padding: 20px;
    width: 100%;
}
#subscription {
    list-style: none outside none;
    margin-left: -40px;
    margin-top: 0;
    width: 100%;
}
#subscription li {
    height: 57px;
    line-height: 1.0em;
    padding: 6px 10px;
    padding-bottom: 20px;
}
#subscription li a {
    color: #000000;
}
#subscription li a:hover {
    color: #A8000C;
    text-decoration: none;
}
#subscription li h4 {
    border: medium none;
    color: #333333;
    font-size: 18px;
    margin: 0 0 0 45px;
}
#subscription li p {
    font-size: 13px;
    margin: 0 0 0 45px;
}
#subscription li img {
    float: left;
    margin: 0 10px 0 0;
    padding: 0;
}
#subscription li:hover {
    opacity: 0.7;
}
</style>

Tuneando el reproductor de YouTube

Antes, YouTube nos daba la opcion de cambiar de color tanto el marco como la barra del reproductor flash de video. Eso ya desaparecio y ahora todos son de color negro. Pero con un poco de CSS y Flash podemos customizarlo a nuestro gusto, dandole un toque mas personal y diferente.

Aqui tienes 2 ejemplos de videos "tuneados":

Cada vez que quieras poner un video del Youtube customizado en tu blog o web, añade este codigo, cambiando los numeros en rojo por los numeros y letras por las del video que quieras (los veras en la barra de direccion de YouTube).

CODIGO:

<center><div style="-moz-border-radius: 20px; -webkit-border-radius: 20px; background: #000000; border-radius: 20px; border: 4px solid #6699FF; box-shadow: 0 0 10px #ffffff inset;width:500px;padding:7px;"><embed allowfullscreen="true" allowscriptaccess="always" border="2" bordercolor="0x000000" height="350" src="http://www.youtube.com/v/lisnMkxUz3Y&amp;hl=en&amp;fs=1&amp;rel=0&amp;color1=0xF4F50D&amp;color2=0x6699FF&amp;autoplay=0&amp;rel=0&amp;" type="application/x-shockwave-flash" width="500"></embed></div></center>

Parametros modificables en el codigo:

·color1=0xF4F50D(color de los bordes de la barra)   ·color2=0x6699FF(color del fondo de la barra )   ·background: #000000;(color de fondo)   · border: 4px solid #6699FF(tamaño y color del borde)   ·width:500px(tamaño ancho del fondo)   ·height="350"(tamaño alto del reproductor)   ·width="500"(tamaño ancho del reproductor)