Archived topic
Efecto hover en imágenes
9 replies · Started by Pedro on October 3, 2022
Hola,
Me gustaría replicar el efecto hover de unas imágenes que he encontrado.
Al hacer hover, la imagen se oscurece y hace un pequeño zoom.
He intentado replicarlo en mi sitio pero no lo he conseguido.
El sitio donde quiero tomar este efecto es este: https://shoptimizerdemo.commercegurus.com/blog/
Y mi sitio, donde quiero replicarlo, es este: https://raybasics.co/blog/
¿Podrían ayudarme con esto?
¡Gracias!
Hi Pedro,
Try this CSS:
.blog .post-image {
background-color: #000;
line-height: 0;
border-radius: 10px;
overflow: hidden;
}
.blog .post-image:hover img {
opacity: 0.5;
transform: scale(1.05);
}
.blog .post-image img {
transition: 0.5s all ease;
}
Hola Ying,
El código funcionó perfectamente. ¡Muchas gracias!
Por otro lado, aprovechando que estamos aquí, puedes ayudarme con otra duda?
He creado un bloque con "Elementos" de GeneratePress, que se muestre en la página de Blog:
Ese bloque contiene el título de "Blog" y una pequeña descripción.
Sin embargo, por más hooks que intente, el bloque no logra visualizarse.
¿Sabes que pueda estar causando este problema?
¡Gracias!
Hi Pedro,
What hook are you using?
So we can have a closer look, can you provide temporary admin login credentials?
Please use the Private Information field for this: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
Hola Fernando,
He usado los siguientes hooks:
after_header
after_navigation
inside_site_container
inside_container
before_main_content
before_content
Y con ninguno se muestra el bloque que he configurado.
Creo que puede ser que este bloque estoy intentando colocarlo en la página donde van las entradas del blog.
En WordPress lo he configurado para que las entradas del blog se muestren en esta página.
No sé si tenga que ver, pero no encuentro otro motivo.
I see. Can you provide temporary admin login credentials?
Please use the Private Information field for this: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
Hola Fernando,
Ya te he dado acceso a mi sitio.
El elemento que menciono que no se muestra en la página del blog, es el que lleva el nombre "Encabezado y descripción de Blog".
Cualquier pregunta que tengas, no dudes en avisarme.
¡Gracias!
In the Display Rule location, can you set the location to Blog instead of Page - Blog?
Hola Fernando,
He colocado la ubicación en "Blog" y el bloque se muestra correctamente.
¡Muchas gracias!
You're welcome Pedro!