Crear widget artículos destacados

[Pedro]

Hola! Estoy usando WP Show Post para crear un widget de artículos destacados.

Sin embargo, no sé por que razón el título de cada artículo aparece en negrita, cuando he especificado que es “p”

Además, hay mucho espacio entre cada título.

Me gustaría que se viera como Woorkup: https://mega.nz/file/X0lnVa6T#vu0IEZq0CLzuUG53JsaEoEimgvwyHlMlLtmRuR1E5oQ

¿Pueden ayudarme con esto?

¡Gracias!

[Leo]

Hi there,

I believe you have this CSS added:

.wp-show-posts-entry-title {
    font-weight: 600;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hola Leo! Ese CSS lo agregué hace poco para la sección de artículos relacionados.

Sin embargo el problema del espaciado y grosor de la sección de artículos destacados ya lo tenía hace tiempo (antes de añadir el CSS)

¿Puedes ayudarme por favor?

[Leo]

Can you remove that CSS and let me have a look?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hola Leo! Ya he eliminado ese CSS.

[Leo]

And the issue is fixed?
https://www.screencast.com/t/qCCyPKj1lZ

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hola Leo! Efectivamente el texto del widget ahora ya no aparece con negrita, pero sigue teniendo mucho espacio entre cada título.

Además, se pierde la personalización que había hecho en la zona de artículos relacionados.

[Leo]

Try this CSS for the margin:

.sidebar .wp-show-posts:not(.wp-show-posts-columns) .wp-show-posts-single:not(:last-child) {
    margin-bottom: 0.5em;
}

You will need to target the WPSP list in the related article you’ve added separately.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hola Leo! El código arregló el problema del espaciado.

Sin embargo perdí la personalización que había hecho para los títulos de los artículos relacionados al final de la entrada.

Quisiera que estos títulos tuvieran un grosor de 700.

¿Podrías ayudarme con esto?

[Leo]

There is no unique class in the related post WPSP list for me to target.

Can you add class to the related post section?

Then you can just target that class with the previous CSS.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hola Leo! El hook que estoy usando fue el que tomé del sitio:

<h2>Te puede interesar...</h2>
<?php
if ( is_single() ) {
    $cats =  get_the_category();
    $cat = $cats[0];
} else {
    $cat = get_category( get_query_var( 'cat' ) );
}

$cat_slug = $cat->slug;
$list = get_page_by_title( 'articulos-relacionados', 'OBJECT', 'wp_show_posts' );
wpsp_display( $list->ID, 'tax_term="' . $cat_slug . '"' );
?>

¿Podrías ayudarme a añadirle ese estilo CSS?

[Leo]

Can you change the code to this instead?

<div class="wpsp-related">
<h2>Te puede interesar...</h2>
<?php
if ( is_single() ) {
    $cats =  get_the_category();
    $cat = $cats[0];
} else {
    $cat = get_category( get_query_var( 'cat' ) );
}

$cat_slug = $cat->slug;
$list = get_page_by_title( 'articulos-relacionados', 'OBJECT', 'wp_show_posts' );
wpsp_display( $list->ID, 'tax_term="' . $cat_slug . '"' );
?>
</div>

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hola Leo! Ya he modificado el hook.

Ahora podrías contarme que CSS debería usar para la personalización?

Quiero que tenga font-weight: 600 y text-decoration: underline (a:hover).

¡Muchas gracias!

[Leo]

Now you just have to make your previous CSS more specific like this:

.wpsp-related .wp-show-posts-entry-title {
    font-weight: 600;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hola Leo! Funcionó perfecto, muchas gracias!

Una última cosa, que CSS podría usar para añadirle un margen superior a esa sección?

Es que está demasiado cerca a la sección de compartir.

[Author]

Posts