Cómo agregar artículos relacionados en WordPress sin plugin?

Esta guía, orientada a implementar una sección de artículos relacionados, está relacionada con mejorar la navegación en tu página web.

La navegación intuitiva es algo que no debes olvidar cuando desarrollas una web, una web orientada para una navegación intuitiva mejorará el tiempo de visita y además reducirá la frustración que los usuarios, al encontrarse con una web mal estructurada, experimentan constantemente.

Agregar artículos relacionados en WordPress sin plugin

1. Agregar el código en functions.php.

El archivo functions.php está ubicado en la carpeta raiz del tema que estás utilizando en WordPress wp-content/themes/nombre_del_tema/functions.php. Si eres de los que utiliza el dashboard, puedes ubicar el archivo ingresando a apariencia > editor y en la parte derecha aparecerá un listado de archivos php, uno de ellos es ‘funciones del tema’ functions.php.

Código:

//Funcion para agregar articulos relacionados con thumbnail
function related_posts_with_thumb($content){
    global $post;
    if( is_single() ){
        $rel_posts = '';
        $categories = get_the_category();
            foreach($categories as $category){
            $rel_cat[] = $category->cat_ID;
            }
        $rep_args = array(
            'post__not_in' => array($post->ID), #No mostrar post actual.
            'category__in' => $rel_cat, #Obtener posts dentro de la categoría actual.
            'posts_per_page' => 4, #Número de post a mostrar.
            'orderby' => 'rand' #Mostrar post aleatorios.
        );

        $rep_query = new wp_query($rep_args);

            if($rep_query->have_posts()){
                while($rep_query->have_posts()) : $rep_query->the_post();
                $rel_img =  get_the_post_thumbnail($post->ID, 'thumbnail'); #Obtener imagen destacada con tamaño por defecto 
                $rel_title =  get_the_title(); #Obtener título del post.
                $rel_link = get_permalink(); # Obtener enlace del post.    
                $rel_posts .= "<div id='content_rel_posts'> <a href='$rel_link'>$rel_img</a> <p><a href='$rel_link'> $rel_title </a></p></div>";
                endwhile;
                wp_reset_postdata();
            }

        $content .= "<h2 class='heading_rel_posts'>Artículos relacionados</h2> $rel_posts";
    }
    return $content;
}
add_filter('the_content', 'related_posts_with_thumb', 2);

Si quieres cambiar el número de post a mostrar, reemplaza el número «4» en posts_per_page.

2. Agregar los estilos en style.css

El archivo style.css, al igual que functions.php, puedes encontrarlo en wp-content/themes/nombre_del_tema/style.css o en apariencia > editor.

Código:

#content_rel_posts{
    width:22%;
    float:left;
    margin:5px 12px 5px 0;
    padding:0px;
}
#content_rel_posts p {
    font-size:0.9em;
    line-height:120%;
    padding:5px 0 0 0;
    margin:0px;
}
#content_rel_posts a{
    text-decoration:none;
    color:#21759b;
}
#content_rel_posts img{
    float:none;
    display:block;
    padding:0px;
    border-radius: 3px; 
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); 
    height: auto;
    max-width: 100%;
}
h2.heading_rel_posts{
    padding:0px;
    margin:0px;
    font-size:1.4em;
    color:#666;
}

Con eso ya debería aparecer, al final de cada post, una sección de artículos relacionados. Puedes ver como nos quedo en LOQUEVE.

Si necesitas ayuda, no dudes en dejarnos un comentario.

Nota: el código es de la web ‘orbitingweb’ y fue editado por mi, puedes ver el post original aquí .

Deja una respuesta

Mira más contenido relacionado

¿Cómo agregar una imagen de perfil a Zoom en Windows y Android?

por Tecneófito, agosto 17, 2021

Agregar una imagen de perfil a Zoom no es una tarea complicada, pero primero veamos...

Cómo utilizar el análisis de la competencia para mejorar su SEO

por Tecneófito, agosto 9, 2021

El análisis de la competencia no es una estrategia nueva. La historia nos ha mostrado...

¿Por qué la música de Spotify se pausa sola y como solucionarlo?

por Tecneófito, mayo 4, 2020

Spotify se ha visto afectado por una serie de problemas que hacen que las canciones...

¿Cómo abrir archivos RTF en PC usando Google Chrome?

por Tecneófito, mayo 3, 2020

Probablemente esté aquí porque no puede abrir el archivo con la extensión ".rtf" o...

Cómo mover mi blog de Wix a WordPress

por Tecneófito, abril 28, 2020

Wix es un impresionante creador de sitios web que parece perfectamente adaptado a...

Cómo proteger su perfil de Netflix usando un código PIN

por Tecneófito, abril 20, 2020

Netflix es una de las principales plataformas de streaming para ver películas y...