La usabilidad de los productos externos/afiliados en WooCommerce es mejorable. Conoce como mejorarla con un simple snippet de código en tu plugin de funciones.

Cuando creas un producto externo/afiliado en tu instalación de WooCommerce realmente estás creando un enlace ‘vitaminado’ dentro de tu tienda online. Es decir, puedes crear una ficha de producto con todos sus campos para que el usuario, al final, cuando haga click en el botón de Comprar sea dirigido a la página del vendedor que te proporciona dicho producto. Hasta aquí, todo normal.

El problema viene cuando tienes muchos productos de afiliados en tu ecommerce (o todos). Cuando el usuario entra en la página principal de tu tienda online y hace click en el botón comprar de alguno de tus productos externos/afiliados, WooCommerce carga la ficha de producto, por lo que el usuario deberá hacer un segundo click en el botón Comprar de la ficha de producto para ser finalmente dirigido a la web del vendedor. Gracias a la pregunta que me habéis hecho uno de vosotros esta semana, hoy vemos como resolverlo.

¿Cómo redireccionar los productos externos/afiliados en WooCommerce?

Para cambiar el comportamiento del botón Comprar de la página de tienda de WooCommerce cuando el producto es externo/afiliado sólo tienes que añadir el siguiente código en tu plugin de funciones:

//Redirecciona los productos externos/afiliados en la página de tienda

add_filter( 'woocommerce_loop_add_to_cart_link', 'mk_add_target_blank', 10, 2 );

function mk_add_target_blank( $link, $product ){

$link = sprintf( '<a href="%s" target="_blank" rel="nofollow" data-product_id="%s" data-product_sku="%s" data-quantity="%s" class="button product_type_%s">%s</a>',
        esc_url( $product->add_to_cart_url() ),
        esc_attr( $product->id ),
        esc_attr( $product->get_sku() ),
        esc_attr( isset( $quantity ) ? $quantity : 1 ),
        esc_attr( $product->product_type ),
        esc_html( $product->add_to_cart_text() )
);

return $link;

}

Al añadir el código a tu plugin de funciones y guardar los cambios, cuando tus usuarios hagan click en el botón Comprar de los productos externos/afiliados de tu página de tienda ya no accederán a la ficha de producto de WooCommerce, sino que serán redirigidos a la URL del vendedor que hayas establecido cuando creaste el producto. Además, el código añade dos etiquetas al enlace:

  • La primera, la etiqueta target=»_blank», que hará que la URL del vendedor se abra en una pestaña nueva del navegador. Por lo que si tu usuario decide no comprar el producto enlazado y cierra la pestaña, tu web seguirá estando visible.
  • La segunda, la etiqueta rel=»nofollow», imprescindible para cumplir con las directrices de Google en relación a los enlaces de programas de afiliación

¡Así de simple y así de fácil!

Como ves, es una solución súper sencilla. Bastan unas pocas líneas de código en tu plugin de funciones para resolverlo de forma fácil y rápida. Además, haciéndolo así, cada vez aprenderás más sobre WooCommerce y la instalación de tu tienda online. Si tienes muchos productos de afiliados y detectas que las conversiones caen porque los usuarios tienen que pasar sí o sí por la ficha de producto… ¡Aquí tienes la solución que estabas buscando!

Si te ha gustado este tutorial, recuerda que si te suscribes, tendrás acceso a todo el contenido premium.

Y como siempre, si tienes cualquier problema, no dudes en contactar conmigo. Nos vemos en la próxima entrega, con un nuevo tutorial. 😉

 

¿Quieres mejorar tu tienda online?

Accede a mi directorio de herramientas (actualmente tienes disponibles 1213 herramientas) y haz que tu ecommerce incorpore todas las funcionalidades que siempre has querido.

Acceder

¿Olvidaste tu contraseña?