TENER UN «STICKY WIDGET» (O UN WIDGET FLOTANTE) ES IMPORTANTE SI QUIERES RESALTAR ALGUNA INFORMACIÓN DE TU BLOG
Te contamos como resaltar información y hacerla visible a los lectores de tu blog con un sencillo truco de CSS. Si tu blog está construido en GeneratePress y WordPress (cosa que te recomiendo encarecidamente!), este truco está hecho para tí!
Utilizar el tema de GeneratePress es algo inteligente que deberías hacer: no solo por el (bajo) precio del tema, sino por conveniencia, ya que es uno de los temas sobre los que es más fácil desarrollar un blog SIN conocimientos de programación.
Y obtener resultados profesionales.
GENERATEPRESS, EL MEJOR TEMA PARA WORDPRESS
Te contamos como Generatepress acelera la carga de tu blog y por qué es el complemento ideal a los plugins esenciales para tu web. Con Generatepress, construir tu blog es MUY SENCILLO!
Si utilizas GeneratePress, puedo ayudarte a tener un widget flotante (el famoso sticky sidebar) en tu sitio de WordPress.
Quizá tengas el dilema de no saber exactamente qué beneficios puede traer tener un widget flotante mientras tus lectores van leyendo contenido.
No te preocupes porque te voy a explicar los beneficios primero. Vamos allá!
¿Por Qué Utilizar Un Sidebar Flotante – Sticky Sidebar?
La barra lateral flotante es algo tan sencillo como que el sidebar de toda la vida (o un widget) se mantenga siempre visible, mientras cualquier usuario vaya leyendo el contenido de tu blog.
De hecho, se considera una estructura esencial y una idea de diseño básica de cualquier web moderna porque facilita el acceso inmediato a la información.
Estas son sus ventajas:
1. Mejora la Experiencia de Usuario
Tener la barra lateral fija a un lado mientras el usuario navega tiene la ventaja que permitir que tus lectores naveguen por tu web con facilidad.
Funciona bien en sitios o blogs donde el usuario deba realizar acciones o pasos intermedios, como en un eCommerce. Los usuarios tendrán más control sobre sus acciones y, a la postre, se aumentará su satisfacción como, quizá, futuro cliente.
2. Aumento de la Visibilidad del Contenido
El Branding es el último grito en los negocios online.
Se trata de crear una impresión memorable de tu producto o servicio para tus clientes.
Si refuerzas algo en especial tal como visualizar un formulario para suscribirse a ofertas o leer tu eBook gratuito, vas a provocar que tu blog o web genere una importancia que antes no tenía en tus lectores.
3. Mejora las Conversiones
Ahhh, las conversiones… Gracias a ellas puedes ganar DINERO con tu blog, así que son MUY IMPORTANTES.
Si tus usuarios o lectores tienen un contenido visible permanentemente en frente suyo, van a reaccionar. Tenlo por seguro.
Un widget flotante fijo (sticky widget) con un descuento, un anuncio de Google AdSense o cualquier imagen que llame la atención es irresistible y va a generar un click seguro.
También es muy conveniente utilizar este tipo de elementos para mostrar contenido relacionado: de esta forma, tus usuarios, pasarán más tiempo en tu web, incrementando las posibilidades de conversión.
¿Cómo Hacer Que La Barra Lateral Sea Flotante En GeneratePress SIN Plugins?
Ahora que estás (¿casi?) convencido de lo bueno que es tener un elemento flotante en WordPress déjame que te cuente como conseguirlo sin tener que utilizar un plugin.
Recuerda que el uso excesivo de plugins en WordPress va a ralentizar la velocidad de carga de la web. Esto es MUY IMPORTANTE!
Simplemente, deberás insertar este código en la web (tal como te cuento más abajo) en la sección del código CSS.
Para hacer que la Barra Lateral sea Flotante en Generatepress
@media (min-width: 769px) {
#right-sidebar {
position: -webkit-sticky;
position: sticky;
top: 0;
}
}Para hacer que la Barra Lateral sea Flotante en los Artículos de Generatepress
@media (min-width: 769px) {
body.single-post #right-sidebar {
position: -webkit-sticky;
position: sticky;
top: 0;
}
}Para hacer que el Último Widget sea Flotante en Generatepress
@media (min-width: 769px) {
.site-content {
display: flex;
}
.inside-right-sidebar {
height: 100%;
}
.inside-right-sidebar aside:last-child {
position: -webkit-sticky;
position: sticky;
top: 70px;
}
}Cómo Insertar Código CSS En WordPress
Para editar estos aspectos en WordPress, hay que personalizar el tema que tengas instalado. Da igual cual sea, ya que todos tienen un apartado para poder insertar tu código CSS personalizado.
- Acceder a Apariencia
- Acceder a Personalización
- Insertar el código CSS desde el apartado CSS adicional (tienes el proceso aquí abajo 👇)
Eso es todo! ★
EL MEJOR HOSTING DEL MUNDO EN ESPAÑOL
El hosting de Webempresa es rápido, confiable y seguro: sus servidores son compartidos aislados, discos duros SSD (rápidos!) y ofrecen un hosting optimizado. Ah! y además, te atienden en español. Aquí puedes contratar tu hosting
Te Ha Gustado El Post? Guarda El Pin!
