Espero que este blog ayude a aquellos que están buscando conocimientos, al igual que yo.
Sígueme en:
Blogger Google+ facebook twitter you yube Ver perfil en Linkedin Agregar a Favoritos/Marcadores
pica pica curioso Mi Ping en TotalPing.com Buscar en el blog
Cerrar X Bienvenido amig@!!! Recuerda que puedes recibir las actualizaciones del blog a través de Facebook y/o Twitter, o Suscríbase al Feed vía RSS o vía Email.

Siempre, Siempre, Siempre, antes de modificar tu plantilla guarda una copia.

Descarga la plantilla o copias el código en el bloc de notas.

¿Que es RSS?:

RSS (Really Simple Syndication)

Es un sistema que nos permite enterarnos de las actualizaciones de las paginas que visitamos frecuentemente, sin tener que visitarlas directamente.

¿Cómo funciona?

Así cómo para poder leer correos electrónicos tenemos que tener una cuenta y un lector de correo electrónico, para poder leer nuestras paginas en RSS tenemos que tener un lector de RSS.
Existen muchos lectores de RSS pero uno de los mas sencillos de usar y mas utilizados por todos es el Google Reader, este lector se encarga de agrupar todos los sitios que visitamos frecuentemente mostrándonos la actualización que cada sitio tiene sin necesidad de ir a visitarlos.
Antes yo entraba a los sitios a mirar si habían publicado algo nuevo, ahora mediante los RSS cuando el sitio publica algo nuevo me llega su actualización.

Sencillo, rápido y útil.
votar
Achicar Entrada Agrandar Entrada
Es un proyecto que hace un tiempo empecé y quiero compartir con ustedes, espero que les guste.



Es totalmente personalizable mediante CSS.

Al abrir el blog o página el menu va entrando desde abajo con efecto deslizante.

Ver Imágenes.

Se le puede poner imágenes o texto.

Imágenes junto con texto.

La altura se adapta al tamaño de la imagen.

Se puede elegir el tamaño y colores.

También se puede mostrar en el centro.

Queda siempre fijo en la parte de abajo del blog o página, con un ancho del 100%, adapatandose a la resolución del monitor del visitante.

Se puede cambiar el ancho por un valor fijo, junto con su posición.

A la derecha tiene un botón de cierre del menú.

Al cerrar el menú queda una imagen fija para poder abrirlo nuevamente.


Las imágenes de los botones se pueden cambiar por otras, a su gusto.

Dentro del menú puede ir imágenes junto con texto, solo imágenes o solo texto.

Se le puede colocar distintos tipos de botones sociales.

El tamaño y la ubicación se apaptan mediante códigos CSS individuales.

La altura se adapta a la imagen o se pueden ponerla con una altura fija.

Como vieron en las imágenes de arriba se puede cambiar el color del fondo y del texto.

¿Cómo poner el menú?

El código va dentro del cuerpo del documento entre las etiquetas <body> y </body>


Yo lo puse debajo de <body>

En Blogger también se puede poner en un gadget HTML/Javascript.

Código:
<div id="vkumenubardos" style="padding:4px;position:fixed;z-index:990;right:0;bottom:0;display:none;">
<!-- Acá va el botón para abrir el menú -->
<a href="javascript:abVkuMenuBar()"><img src="http://img44.xooimage.com/files/c/d/a/top-1eb247f.png" style="border: 0; margin-right: 5px; width:24px; height:24px;" /></a>
</div>
<!-- Personalizar menú, color del fondo y borde -->
<div id="vkumenubar" style="padding:0;position:fixed;z-index:999;left:0px;bottom:-100px;width:100%;background-color:#555;border-top: 4px double #ccc;">
<!-- Acá va el botón para cerrar el menú -->
<a href="javascript:closeVkuMenuBar()"><img src="http://img10.xooimage.com/files/0/d/2/1279873511_close_box_red-1e94d34.png" style=" float: right; border: 0;margin-right: 10px;" /></a>

<!-- Acá van las imágenes con sus link -->
<a class='linkvkumenubar' href='http://twitter.com/v_ku' target='_blank'><img style="border: 0; margin:8px 10px; width:24px; height:24px;" src="http://img41.xooimage.com/files/7/9/5/logo_twitter-1eb2409.gif" title='Twitter'/></a>

<a class='linkvkumenubar' href='http://www.facebook.com/loseasi' target='_blank'><img style="border: 0; margin:8px 10px; width:24px; height:24px;" src="http://img49.xooimage.com/files/0/f/f/logo_facebook-1eb23fb.gif" title='Facebook'/></a>

<a class='linkvkumenubar' href='http://www.youtube.com/user/thevku' target='_blank'><img style="border: 0; margin:8px 10px; width:24px; height:24px;" src="http://img41.xooimage.com/files/b/6/1/logo_youtube-1eb240c.gif" title='You Tube'/></a>

<a class='linkvkumenubar' href='http://www.myspace.com' target='_blank'><img style="border: 0; margin:8px 10px; width:24px; height:24px;" src="http://img45.xooimage.com/files/2/b/3/logo_myspace-1eb2423.gif" title='MySpace'/></a>

<a class='linkvkumenubar' href='http://feeds.feedburner.com/blogspot/qygH' target='_blank'><img style="border: 0; margin:8px 10px; width:24px; height:24px;" src="http://img43.xooimage.com/files/3/f/5/rss-1eb2412.jpeg" title='Rss'/></a>

<a style="text-decoration: none; bottom:17px; margin:0 10px;position:relative;color:fff" href='http://loseasi.blogspot.com' target='_blank'>¿Cómo se hace...?</a>
<!-- Fin imágenes con sus link -->
</div>
<script src='http://sites.google.com/site/vkuloseasi/archivos/vkumenubar.js' type='text/javascript'></script>
Lo de Rojo es el contenido que se ve en el menú, ahí muestro el ejemplo con imágenes y texto.

Personalizar cambiando las imágenes, link, etc., o poner sus propios botones.

Si quieren pueden descargar el archivo JS y subirlo a otro servidor, sin modificar los datos.

O sustituir:
<script src='http://sites.google.com/site/vkuloseasi/archivos/vkumenubar.js' type='text/javascript'></script>
Y poner en su lugar el script dentro del archivo.

Del siguiente modo:
<script type="text/javascript">

        // aquí va el contenido del script ...

</script>

Si tienen dudas pueden dejar un comentario.

Leer Importante... Comentar esta entrada ▼ Ir al principio de la entrada
khaled dijo...

Buenos días,vku:5)
Su tema y una guía única en su creatividad :9)
Añadido Sostamlha éxito, pero más tarde :15)
Y tengo una propuesta sencilla, que es un
Selección de las imágenes más bien pequeño
Añadido a la entrada y
32px
http://www.iconfinder.com/search/?q=social+buttons
Gustó mucho tu blog y el primer post espero
que me confidencialmente qué nivel de :17)
¡Buena suerte

Vku dijo...

Gracias por el dato de las imágenes, pero yo puse como ejemplo las redes sociales.

Pero en el menú podes poner lo que quieras, hasta un iframe, link de inicio, botones para cambiar el tamaño del texto, color del blog, no se muchas cosas, hasta el reproductor de una radio como dejotas.

Alex Pensado dijo...

Hola amigo
Vi lo de tu hijo, lo lamento mucho, cuando puedas por favor respondeme
tengo un likesite FBLIKEES, en el cual quiero meter esta barra, pero no me aparece, solo un alert de href no valid command
Podrías darme este código para poder usarse en otro sitio? me gust+o la barra negra de as imagenes de arriba

Vku dijo...

Pon el código con el script incluido sin imágenes y despues guarda a ver si te da error, si no te da error agrega los link con tus imágenes y guarda, fijate que este bien cerradas las etiquetas

Alex Pensado dijo...

@ Vku: Gracias VKU, ya quedó, ahora te tengo dos preguntas, podrías conectarte al chat de ayer? Gracias

andikirus dijo...

hola yo pongo el codigo y me aparece perfectamente el menu solo que cuando le doy clic en el boton de cerra este nose oculta

Vku dijo...

andikirus tu perfil no esta disponible, no pude ver el error. Dejame un enlace en donde lo has colocado.

andikirus dijo...

@ Vku:

te dejo el enlace temporal

http://friends.webcindario.com/home/index.php

Vku dijo...

Yo lo veo bien, pero veo que abajo tienes una tabla con un monton de link

Urban Brigade dijo...

Oh que genial! yo estaba buscando alguna forma de reemplazar el menu que va debajo del header o el menu lateral (el cual no me sale bien jejeje) y probando con tu código, me ha salido a la perfección :)
Te agradezco mucho la ayuda y si me lo permites, enlazaré tu blog con el mío como agradecimiento :D

Solo tengo una pregunta con respecto a esto, como le cambio el tamaño a las imágenes porque me salen muy pequeñas, no encuentro la parte del código donde se edite el tamaño del as imágenes, jejeje... :23)

Vku dijo...

A las imágenes les agregas o cambias, ej la de twitter: width:24px; height:24px;

Si tienes alguna opinión respecto a la entrada, tienes un punto de vista distinto, o simplemente quieres saludar, te invito a que dejes un comentario. NO SE ACEPTAN LINKS DE REFERIDOS para que los comentarios no se conviertan simplemente en una forma de publicitarse.



Elegir un botón o imagen, Seleccionar, copiar (Ctrl+C) y pegar en formulario de comentarios.


Nota: solo los miembros de este blog pueden publicar comentarios.

Si no puedes comentar, intenta con el antiguo formularioO leer solución

VituaRadio
Informe Importante

Por un tiempo voy a estar sin internet, así que no voy a actualizar ni poder contestar a los comentarios.
Suscribirse a las entradas Suscribirse a las entradas vía Mail Suscribirse a los comentarios
¿Que es RSS?