Añadir enlazado interno en categorías de Woocommerce

Nos encontramos con una tienda hecha en WordPress con el plugin de Woocommerce a la que hay que mejorar el enlazado interno hacia categorías específicas que nos interesan, bien por SEO o bien por cuestiones de negocio del cliente.

Buscando en Google no he visto nada que haga lo que buscaba, así que por qué no hacerlo directamente, que siempre será mejor y más adaptado a lo que queremos.

Antes de nada, está hecha para la plantilla Flatsome, así que es posible que si lo usáis vosotros, tengáis que realizar algún pequeño ajuste, pues Flatsome no trae Bootstrap y usa su propio grid.

Añadimos el siguiente código en el fichero functions.php del tema hijo.

/* categorias enlazado interno en categorias */
add_filter( 'woocommerce_after_shop_loop', 'enlazado_interno_categorias', 20 );
function enlazado_interno_categorias(){

	// definimos los ids de las categorias
	$id_categorias_fijas = [151, 2460, 2459, 2461, 2507, 262, 217, 42];
	
	// cogemos todas las categorias
	$args = array(
	    'taxonomy'   => "product_cat",
	    'number'     => $number,
	    'orderby'    => $orderby,
	    'order'      => $order,
	    'hide_empty' => true,
	    'include'    => $id_categorias_fijas
	);
	$product_categories = get_terms($args);

	/* definimos divs */
	$codigo_final = '<div class="kiwimain"><div class="container"><h2>Otras categorías que te pueden interesar</h2><div class="row">';

	/* iteramos sobre las categorias y generamos el código */
	foreach( $product_categories as $category ) {
		$category_link = sprintf( 
			'<a href="%1$s" alt="%2$s">%3$s</a>',
			esc_url( get_category_link( $category->term_id ) ),
			esc_attr( sprintf( __( 'View all posts in %s', 'textdomain' ), $category->name ) ),
			esc_html( $category->name )
		);

		$codigo_final .= '<div class="col small-6"><p class="kiwicategoria">' . sprintf( esc_html__( '%s', 'textdomain' ), $category_link ) . '</p></div>';
	}

	/* cerramos divs */
	$codigo_final .= '</div></div></div>';

	echo $codigo_final;
}

Básicamente lo que hacemos es:

  • Definimos los ID de las categorías de productos que queremos sacar, en este caso, serán 8.
  • Realizamos la query en WP para sacar los datos de esas categorías.
  • Iteramos sobre esas categorías para montar la estructura final.

Como podéis ver, usamos el hook de woocommerce_after_shop_loop, aunque lógicamente vosotros podéis usar el que queráis o incluso cambiarle la prioridad al mismo, por si preferís que salga más arriba o abajo.

Como último, falta añadir lo estilos css para darle un poco más de presentación a este apartado de enlazado interno, para ello, lo subimos al fichero style.css del tema hijo o en caso de tener algún custom.css, pues ahí.

/* kiwi listado categorias */
.kiwimain{
    margin-top: 2rem;
    background: #fff;
    padding: 1.25rem 1.875rem;
    box-shadow: none;
    border: 1px solid #eaeaea;
}

.kiwimain .container .col{
    padding: 5px !important;
}

.kiwicategoria {
    padding: 10px;
    width: 100%;
    border: 1px solid #cccccc;
    border-radius: 10px;
    margin-bottom: 0px!important;
    color: #232323;
}

Y el resultado final es el siguiente:

enlazado interno categorias woocommerce
Así quedaría nuestro apartado para mejorar el enlazado interno, la navegación y la conversión de la web.

Consultor SEO | Web | + posts

Programador reconvertido a consultor SEO. Me gusta automatizar cosas, de hecho, este articulo ha sido generado a partir de otras webs de forma automática.