Avisos
Vaciar todo

[Resuelto] Diseño de entradas  

 
Julen
 Julen
Estimable Member

¡Buenas noches!

¿Sabéis cómo podría editar el grafismo de las imágenes ( https://www.pelotonfemenino.es/actualidad/ )? Me refiero: redondear los bordes de las imágenes, poner en color diferente las categorías que aparecen debajo del título (la palabras 'Actualidad', 'Crónicas', etc.)

¡Un saludo!

Respondido : 14/08/2020 9:19 pm
Argenis
 Argenis
Soporte CMS Webempresa Moderator

Hola Julen,

Te comparto una pequeña lista donde indico para que es cada seccion de código:

/*Borde de imagenes redondeados*/
.wp-show-posts-image.wpsp-image-center img {
border-radius: 15px !important;
}
/*Titulos de los posts*/
h2.wp-show-posts-entry-title {
font-size: 16px;
font-weight: bold;
color: #000;
}
/*Información de la fecha*/
span.wp-show-posts-posted-on.wp-show-posts-meta a {
font-size: 12px !important;
font-weight: bold;
color: #fff !important;
}
/*Información de la categoría*/
span.wp-show-posts-terms.wp-show-posts-meta a {
color: #fff;
background-color: #b70036;
padding: 5px;
}

Esto puedes insertarlo en Apariencias → Personalizar → Css Adicional.

Nos comentas como te va, un saludo 🖐️ 

Respondido : 14/08/2020 9:34 pm

Cursos Gratuitos WordPress

Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

Puedes probar con el siguiente código CSS:

.wp-show-posts-columns .wp-show-posts-single:not(.wp-show-posts-masonry-block) .wp-show-posts-image img{
border-radius: 20px;
}
.wp-show-posts-terms.wp-show-posts-meta a{
color:red;
}

.wp-show-posts-terms.wp-show-posts-meta a:hover{
color:blue;
}

La primera parte del código define el redondeado de las imágenes, la otra parte define el color del enlace, y también el color cuando se pasa el mouse.

Saludos.

Respondido : 14/08/2020 9:35 pm
Julen
 Julen
Estimable Member

@jmarreros @argenis

¡Muchas gracias a ambos! ¡Toda ha ido genial!

Un par de últimas cosas: si observáis aquí ( https://www.pelotonfemenino.es/actualidad/ ), en la 6. entrada (la que pone CRÓNICA: SEGURA...), dicha entrada tiene dos categorías. Así pues, entre esas dos etiquetas se puede observar un coma, algo que me gustaria, si se puede, quitarlo. ¿Se podría?

La última: ¿se puede aumentar la distancia entre las distintas filas? La distancia entre entradas (horizontalmente) está correctamente, pero querría aumentar la distancia verticalmente.

¡Un saludo!

 

Respondido : 14/08/2020 10:35 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Argenis
 Argenis
Soporte CMS Webempresa Moderator

Hola Julen,

Con respecto al espacio vertical puedes usar el siguiente código css:

.wp-show-posts-inner {
margin-bottom: 5em !important;
}

Y con respecto a la otra duda dentro de la configuración del plugin que instalaste para posts verifica si tienes la opción de elegir el método de separación, al no tener una clase este separador no se puede eliminar por medio de código css.

Nos comentas, un saludo 🖐️ 

Respondido : 14/08/2020 11:47 pm
Julen
 Julen
Estimable Member

@argenis

¡Muchas gracias Argenis por lo del ajuste vertical! ¡Todo genial!

Sí, tengo una opción para ajustarlo -se me olvidó, perdón-, por lo que podré ir ajustando poco a poco a mi gusto.

¡Un saludo!

Respondido : 15/08/2020 12:18 am

wpdoctor-revisa-la-salud-de-tu-wordpress

Bulmaro
 Bulmaro
Soporte CMS Webempresa Moderator

@julenberasategigmail-com

Hola Julen, 

Gracias a ti por consultarnos, seguimos pendientes a tus consultas.

Saludos.

Respondido : 15/08/2020 12:45 am