LA PAGINA DE LOS WIDGETS

ICONOS HOVER A BLANCO Y NEGRO & VICEVERSA

Utilizando los filtros del CSS3 podemos obtener este efecto, en el que al pasar el cursor por cualquier imagen, esta cambia de color a blanco y negro o también a la inversa.

Para que veáis un ejemplo, os he puesto estos 4 maravillosos iconos sociales de diseño propio con su código correspondiente por si os gustan y queréis añadirlos a vuestro blog.

BOTONES PARA BLOGGER HECHOS CON HTML

Esta clase de botones grises hechos con HTML son muy útiles, porque los puedes poner donde quieras en tu web sin complicaciones.

Basta con unas poquitas líneas de código y ya esta. Aquí tienes unas variantes de estos botoncillos con sus códigos correspondientes para que utilices los que más se adapten a tus necesidades.

PRESENTACIÓN DE IMÁGENES APILADAS EN BLOGGER

Cuando queremos mostrar una galería de imágenes en nuestro blog, pienso que la manera estética de hacerla es fundamental.

Si es original y encima tiene animaciones como esta, no te digo 'nada'. Utilizando el CSS3 y el Javascript se consigue esta presentación con las imágenes apiladas-desordenadas que al hacer click sobre ellas

MENÚ DESPLEGABLE CON IMÁGENES PARA BLOGGER

Este truco para blogger es muy fácil de realizarlo solo tienen que seguir mis instrucciones y podrán tener este espectacular menú desplegable para blogger con imágenes.

AÑADIR REFLEJO A LAS IMÁGENES CON UN SCRIPT

Ahora podemos hacer que las imágenes se vean como reflejadas en un espejo sin necesidad de utilizar ningún editor ni photoshop.

Solamente añadiendo un código javascript llamado 'reflect' en nuestra web conseguiremos este efecto.

PERSONALIZAR LA BARRA DE DESPLAZAMIENTO DE MÍ BLOG

Si bien podemos usar CSS para modificarlo, el problema es que no está estandarizado,

por lo que con CSS solo podemos hacerlo funcionar en Chrome y Safari; y en el caso de Internet Explorer

también tiene su propio código pero obviamente solo funciona en ese navegador (no sé en cuáles versiones). Así que lo que haremos a continuación es darle un nuevo aspecto al scrollbar pero usando jQuery, de esta manera el cambio será visible en todos los navegadores.

IMÁGENES QUE SE DESCOMPONEN CON BUSTIFY

Bustify es un Javascript creado por Matthew Lein que 'rompe' cualquier imagen en una serie de cuadros.

Es decir, que al pasar el cursor del ratón sobre una imagen con esta clase, se desmenuza en cuadritos como si fuera un puzzle y luego se vuelve a recomponer automáticamente.

MENÚ LATERAL DESLIZANTE PARA REDES SOCIALES

Este es un menú para nuestro blog que tiene la particularidad de no solo ser lateral sino también tener un pequeño efecto deslizante. Se oculta y al hacer hover sobre él aparece la opción completa lista para ser clickeada. Pueden ver un ejemplo a la izquierda de esta entrada y si les gusta llevarlo a sus blogs.

MENÚ HORIZONTAL CON EFECTO ZOOM

Ya vimos un gran repertorio de menúes para Blogger, ahora vamos a ver uno horizontal con un pequeño efecto zoom.

La verdad es que es muy sencillo de hacer, no requiere nada raro y lo vamos a agregar en un gadget html directamente.

UN MENÚ HORIZONTAL PARA BLOGGER

Ya vimos un gran repertorio de menúes para Blogger, ahora vamos a ver uno horizontal Es un simple código CSS que vamos a insertar en un solo widget,

lo que hará nuestro menú desplegable para blogger es mostrar texto e imágenes con relación a nuestras mejores categorías de temas que queramos mostrar en nuestro menú.

MENÚ DESPLEGBLE RESPONSIVE EN MI BLOG DE BLOGGER

¿Crear un menú desplegable Responsive en mí blog? ¿Menú desplegable gratis totalmente Responsive se muestre correctamente en un teléfono inteligente?

Con la plataforma de Blogger se puede crear miles de trucos o a su vez adaptar trucos HTML de otras plataformas web a Blogger.

MENÚ DESPLEGABLE PARA BLOGGER V3

Insertar de forma fácil y sencilla un menú desplegable para mi blog de Blogger? Con tres simples pasos instalaras un Menú desplegable en su blog de Blogger, ¡Como hacerlo! Debes seguir las instrucciones de este grandioso tutorial.

MENÚ DESPLEGABLE PARA BLOGGER MEGA MENÚ V2

Compartiré un widget de menú desplegable para blogger, a este nuevo menú desplegable para blogger se lo conoce como Mega menú V2.

MENÚ SENCILLO PARA BLOGGER

Este menú gris efecto 'tab' es simple, pero a la vez efectivo y elegante.

Si quieres ponerlo en tu sitio, coloca este código en la parte CSS de tu web.

En Blogger, seria en la plantilla HTML

MENÚ VERTICAL DESPLEGABLE AZUL PARA BLOGGER

Tras un largo periplo de widgets y gadgets para Blogger vuelvo de nuevo con un menú vertical desplegable y totalmente responsive con subspestañas por lo que podremos agregar enlaces a cada sección del menú

MENÚ HORIZONTAL CON SUBMENÚES Y UN EFECTO DE BALANCEO

Este es un menú horizontal con submenúes y un efecto de balanceo para nuestro blog de Blogger.

Fácil de colocar, tan solo un código entero y podemos ponerlo en un gadget HTML/Javascript o donde mejor quede en nuestro blog.

MENÚ VERTICAL PARA BLOGGER HECHO CON CSS

En el día de hoy vamos a ver como agregar a un sitio web un genial menú

(ya que este truco no solo sirve para los blogs de Blogger sino también para otras plataformas y páginas puesto que solo es CSS y HTML básico lo que compone este menú).

MENÚ VERTICAL PARA LA SIDEBAR DE NUESTRO BLOG CON HOVER ZOOM-OUT

Las posibilidades del CSS3 nos permiten hoy en día hacer diseños sin utilizar ningún tipo de imagen y javascript.

Es el caso del menú que os presento hoy, y que lo he realizado íntegramente a base de código de estilos.

MENÚ TIPO ACORDEÓN ESTILO GALERÍA DE IMÁGENES

Uno de nuestros lectores nos preguntaba cómo se hacía un menú de estos que tienen un estilo tipo acordeón. Este específicamente fue creado por ByScripts y voy a enseñarles cómo hacerlo.

Primero les muestro el menú en su forma vertical y horizontal. Luego ustedes eligen cuál de los dos colocar en sus blogs.

MENÚ OCULTO EN EL LATERAL CON BOTONES DE REDES SOCIALES

De nuevo os traigo otro tutorial, esta vez se trata de un menú vertical oculto en el lateral del blog que se expande/abre al colocar el cursor sobre él.

Lleva incorporado enlaces e iconos (fuente Awesome.) y los botones de seguir de Facebook y Twitter, aparte de la insignia del perfil o página de Google+

MENÚ DESPLEGABLE NEGRO EN UN SOLO WIDGET CON CSS

He visto muchos menús desplegables por internet.. muy chulos, pero muy complicados para mi gusto, así que voy a explicar como hacer un menú horizontal desplegable sencillito y funcional, tan solo con HTML y css.

Está todo configurado para colocar en un gadget HTML, tan solo cambiando las direcciones URL y los títulos que le queráis colocar.

MAGNÍFICO MENÚ DESPLEGABLE EN UN SOLO WIDGET EN CSS

Pero vayamos a lo que realmente nos importa y ello es este magnífico menú desplegable que se está utilizando en muchísimos blog y es realmente útil para mostrar gran información de contenido sin saturar el diseño.

Entendiendo un poco de CSS, lo podéis configurar y adaptar a vuestras necesidades, lleva incorporado un buscador interno del blog.

MENÚ VERTICAL CON UN SOLO WIDGET

Este es un menú vertical hecho solo con CSS, no tiene nada de Javascript, así que para aquellos que prefieren las cosas simples esta es una buena opción para organizar las etiquetas del blog o cualquier enlace.

Colocarlo es bastante sencillo, entra en Diseño | Elementos de la página | Añadir un gadget | HTML/Javascript y ahí pegas el código del menú que más te agrade.

MENÚ OCULTO EN EL LATERAL DEL BLOG CON BOTONES DE SEGUIDORES

De nuevo os traigo otro tutorial, esta vez se trata de un menú vertical oculto en el lateral del blog que se expande/abre al colocar el cursor sobre él.

Lleva incorporado enlaces e iconos (fuente Awesome.) y los botones de seguir de Facebook y Twitter, aparte de la insignia del perfil o página de Google+.

MEGA MENÚ EN MI BLOG DE BLOGGER

Antes de empezar este tutorial, se recomienda realizar una copia de seguridad de su blog de Blogger, o primero practicar en un blog de ejemplos. Si no sabe cómo realizar una copia de seguridad de su blog, puede seguir las instrucciones del siguiente enlace:

MENÚ HORIZONTAL PARA BLOGGER AZULÓN

Para todos/as los que como a mí les encante el color azul, os traigo este menú diseñado por un servidor.

Para añadirlo a vuestro blog o web, basta con copiar el código de abajo e insertarlo allí donde queráis que aparezca.

IMÁGENES DE ARTÍCULOS DESTACADOS CON THUMBANIL

Como era de lapaginadeloswidgets.blogspot.com/2018/12/imagenes-de-articulos-destacados-con.htmlesperarse, compartiré con todos vosotros un nuevo truco para blogger. El widget que os voy a presentar tiene como nombre imágenes de artículos destacados con thumbnail.

NUEVO ESTILO DE GALERÍA DE IMÁGENES PARA TUS ENTRADAS DE BLOGGER

Lo que vamos a ser es mostrar las imágenes más destacadas de nuestras publicaciones en una galería centrada en el sidebar de nuestro blog de Blogger.lapaginadeloswidgets.blogspot.com/2018/12/nuevo-estilo-de-galeria-de-imagenes.html

Podemos ubicar las imágenes que nosotros queramos al igual si queremos mostrar solo una imagen, 5 imágenes o más.

WIDGET DE ENTRADAS RECIENTES ESTILO MATERIAL DESIGN

En este nuevo tutorial de LA PáGINA DE LOS WIDGETS aprenderán a insertar un widget el cual mostrara las entradas recientes de su blog de Blogger con un estilo único como lo es Material design de Google, la inserción del código es muy simple de realizarlo.lapaginadeloswidgets.blogspot.com/2018/12/widget-de-entradas-recientes-estilo.html

WIDGET DE ARTICULOS RECIENTES SISTEMA MARQUESINA

Con un solo código podemos mostrar nuestros artículos recientes en movimiento ascendente, lo que mostrara nuestro widget de artículos recientes son, tres títulos de nuestros artículos,lapaginadeloswidgets.blogspot.com/2018/12/widget-de-articulos-recientes-sistema.html

con una imagen de cada una de ellas, va a ir cambiando de posición, subiendo de forma automática hasta llegar a sus 10 ultimas publicaciones de su blog de blogger,

COMO CAMBIAR DE ESTILOS MIS ENTRADAS POPULARES DE BLOGGER

Como era de esperarse, ya que muchos amigos me han preguntado como cambiar el estilo de las entradas populares de Blogger, pues con respuesta a lo antes mencionado es muy fácil si sigues mis instrucciones tal y como las señalo. Para no hacerte muy largo la introducción nos vamos a ir directamente a trabajar.

WIDGET DE IMÁGENES PARA ARTICULOS DESTACADOS

Blogger la mejor plataforma web para crear diferentes y atractivos widgets, slideshow, plantillas, diseño web,lapaginadeloswidgets.blogspot.com/2018/12/widget-de-imagenes-para-articulos.html

etc, como también creaciones de contenidos ricos para buscadores web, una plataforma web única y gratis para todos los usuarios del mundo.

WIDGET DE IMÁGENES DE ARTÍCULOS DESTACADOS

En esta ocasión compartiré con todos vosotros un nuevo truco para blogger. El widget que les voy a presentar tiene como nombre imágenes de artículos destacados con thumbnail.lapaginadeloswidgets.blogspot.com/2018/12/widget-de-imagenes-de-articulos.html

CLIC PARA AMPLIAR Y DOBLE CLIC PARA REDUCIR UNA IMAGEN

En esta ocasión vamos a ampliar una Imagen con un Clic y reducirla con un Doble clic usando un poco de CSS para lograr ese efecto.

Y lo haremos con algo mucho mui simple, con un simple código podremos ampliar una imagen al hacer click sobre ella, y reducirla de nuevo con un doble click, lapaginadeloswidgets.blogspot.com/2018/01/clic-para-ampliar-y-doble-clic-para.html

COLOCAR DOS IMÀGENES EN UNO

Han visto que hay imágenes que al poner el puntero del mouse sobre ellas cambian, como botones o logos, esto se realiza con un código básico para las imágenes en HTML, con el cual también podemos por ende mostrar dos imágenes diferenteslapaginadeloswidgets.blogspot.com/2018/01/colocar-dos-imagenes-en-uno.html

COMO ALINEAR TEXTOS

En este capitulo veremos con más detalle las más ampliamente utilizadas y ejemplificaremos algunas de ellas posteriormente.l

Formatear un texto pasa por tareas tan evidentes como definir los párrafos, justificarlos, introducir viñetas, numeraciones o bien poner en negrita, itálica...

VENTANA EMERGENTE CON UN MENSAJE AL ENTRAR AL BLOG

En algunas ocasiones, se hace necesario comunicarles a los usuarios un mensaje y la manera más apropiada es a través de una ventana emergente. Aquí os traigo la solución.

Se trata de una ventana flotante con la opción de cerrar a través de un botón en la parte superior

AÑADIR MAS ZONAS DE GADGETS EN LA CABEZERA

Te ha pasado que quieres agregar un gadget en la cabecera, o quizá arriba de los posts? Seguro que más de alguno le gustaría tener esta opción, tal vez para agregar la fecha actual, un chat, un contador de visitas, o lo que se te ocurra, esto por defecto las plantillas para blogger, no te lo permiten, pero se puede modificar fácilmente.

CARTELITOS DE TEXTO EN VARIAS FORMAS

Podemos trabajar de muchas maneras con texto para tener un Blog más vistoso y agradable. Agrandarlo, ponerle fondo, cambiarle la orientación, etc.

Aquí os dejo tres modelos, que copiando el código vais a daros cuenta enseguida como se configura a vuestro gusto.

AÑADIR TRES COLUMNAS EN LA SECCIÓN DEL FOOTER

Necesitaremos retirar cualquier elemento que tengamos colocado en el footer del blog. Podemos moverlo a la sidebar de forma temporal y, una vez añadidas las tres columnas en el footer, volver a colocarlo en esa sección.

AÑADIR INFORMACIÓN CUANDO ALGUIEN TE COPIE ALGUNA COSA EN TU BLOG

Hola les traigo un truco para cuando te hagan copy & pasta pueda salir la URL de tu blog que es donde te copiaron la información es fácil y rápido de instalar

Añadir información cuando le copien texto en tu blog

COMO INSERTAR UN BUSCADOR A MI PAGINA

Vamos a insertar un buscador flotante en nuestro blog de Blogger de una forma fácil y segura, lo que vamos a hacer es insertar un código CSS3 en un widget HTML/javascript y luego lo guardaremos,

esto dará el efecto de mostrarse un buscador flotante en la parte superior derecha de nuestro blog de Blogger y al ir avanzando por la página nos perseguirá a donde vayamos.

GUARDAR LOS POST EN PDF

Ya antes vimos cómo poner la opción de imprimir el post para aquellos lectores que necesiten tener el post impreso puedan hacerlo sin problemas, ahora les daremos a nuestros lectores una opción más, guardar el post en formato PDF.

DONDE COLOCAR EL CSS

Será posible resumir todo lo que necesitamos saber sobre CSS en un par de líneas? Realmente no pero, voy a tratar de cumplir con un pedido y por lo menos dar una vaga, vaga, muy vaga idea, aún más que eso que alguna vez publiqué con el nombre de CSS Rápido

INSERTAR CORRECTAMENTE LAS META DESCRIPCIONES

Las meta descripciones son mejores conocidas como la descripción que aparece en los resultados de un buscador,

ayuda para que tu sitio pueda ser catalogado en la temática correcta. Además que una buena descripción nos ayuda a tener buenas posiciones en lo que escribimos, en lo personal suelo agregar la palabra clave principal en un inicio del párrafo.

APROVECHANDO ESPACIOS EN LA PLANTILLA

Me llegaba ayer un email (por cierto sin firmar) donde alguien me preguntaba si podía explicarle que significaba una parte del código de su plantilla, que aparecía justo sobre esta línea:

ETIQUETAS EN MOVIMIENTO EN BLOGGER

En el Tema de hoy explicaré como podemos insertar en nuestro blog. Se tratan de conseguir en la barra lateral una nube de etiquetas en movimiento como la siguiente:

EL PROBLEMA LOS GADGETS

¿Os acordáis de la mítica frase de “Houston, Tenemos un problema“? Pues he tenido la cara dura de “hacerla mía” como portada de una nueva sección del blog que busca intentar solucionar problemas que nos pone blogger para fastidiarnos la cómoda y bucólica vida de bloguer. Es lo que tiene esta plataforma tan encantadoramente imperfecta.