X

Consultar dudas de produtos por Whatsapp en WooCommerce

¿Te gustaría que tus usuarios contacten directamente por Whatsapp si tienen alguna duda sobre un producto específico?, en este artículo aprenderás cómo integrar la opción de consultas de dudas de productos por Whatsapp en WooCommerce.

 

Resultado Final

Al final queremos obtener algo similar a como se muestra en la siguiente imagen:

 

Agregando código para crear el enlace

Usaremos uno de los Hooks que tiene WooCommerce llamado woocommerce_share. El siguiente código lo puedes agregar en el archivo functions.php de tu theme o child-theme.


add_action( 'woocommerce_share', 'dcms_question_whatsapp' );

function dcms_question_whatsapp(){
	$phone = '34123456789';
	$message = 'Quiero información del producto: '.get_the_title().' ';
	$text = 'Preguntar por Whatsapp';
	$ico = '<img src="'.get_stylesheet_directory_uri().'/img/whatsapp.png" width=20 height=20 />';

	$url = 'https://api.whatsapp.com/send?phone='.$phone.'&amp;text='.str_replace(' ', '%20', $message);
	$link = '<a class="dc-link" href="'.$url.'" target="_blank">'.$ico. ' <span>'.$text.'</span></a>';

	echo '<div class="dc-whatsapp-container">'. $link. '</div>';
};

En el código anterior:

  • Utilizamos el hook de WooCommerce woocommerce_share el cual hace referencia a la función: dcms_question_whatsapp
  • Dentro de esta función puedes configurar los valores de teléfono (al cual te llegarán los mensajes), mensaje por defecto, y el texto del enlace
  • Puedes configurar igualmente una imagen como icono, en el ejemplo hay una imagen llamada whatsapp.png en la carpeta img del theme
  • Finalmente se imprime el HTML generado

En un artículo anterior vimos una forma diferente de agregar Whatsapp en WordPress simplemente a través de un link

 

Conclusión

Como hemos visto, puedes agregar un enlace de Whatsapp en el detalle de producto de manera simple y sin usar plugins, este enlace te permitirá mantener un chat directo con tu número telefónico, en caso tus clientes tengan alguna duda sobre algún producto.

 

Categorías: Plugins

Ver comentarios (63)

  • Hola, yo tengo el tema "motors" para WordPress, que es un clasificados de vehiculos y me gustaria hacer lo mismo con los autos, que los visitantes tengan la opcion de enviarles a los vendedores un mensaje atravez de un boton de whatsapp consultando por un vehiculo en particular, podrias ayudarme con eso? Saludos.

    • Hola, lo que comentas es justo lo que se trata en este artículo, tienes algún problema implementando el código?, si tienes problemas o quieres modificarlo el comportamiento mejor envía un mensaje a través del formulario de contacto: https://decodecms.com/contacto/

  • Excelente aporte. Funciona perfecto. Muchas Gracias.
    Solo me causa algún problema alinear la imagen (me envía un salto de linea?? es muy grande la imagen ??) y me queda el enlace consultar en el siguiente renglón. Uso Storefront.

  • Hola, muy bueno el código, funciona perfecto. Solo un detalle. El icono de WS no se ve, aparece la imagen de imagen no encontrada. igual gracias porque es muy util.

    • Hola, revisa la ruta en donde tienes tu imagen y revisa también que tenga el nombre exacto.

  • Hola Jhon muy bueno el tutorial! te hago una consulta, estoy utilizando elementor builder, para mostrar la info del producto y no me aparece el boton de preguntar por whatsapp. que puede ser ?

    • Hola, no he probado con Elementor Builder, posiblemente tengas que agregar el botón con Elementor, consulta con los desarrolladores, ya que entiendo que tienes la versión de pago.

  • Excelente tutorial, muchas gracias.
    ¿Cómo puedo agregar en el mensaje ademas del nombre del producto, la URL de este?
    Eso seria FANTASTICO.

    muchas gracias.

    • Hola Felipe, dentro de la función puedes agregar un código para que haga referencia primero al objeto product y luego obtener en la variable $url_product el enlace, por ejemplo:

      	global $product;
      	$url_product= get_permalink( $product->get_id() );
      	echo 'La url es: '. $url_product;
      
      • ¿Podrias ser más claro porfavor?
        $url = 'https://api.whatsapp.com/send?phone='.$phone.'&text='.str_replace(' ', '%20', $message);
        Donde se mete esa $ para que aparezca en el mensaje?

        • Hola, según parece sólo se enviaría el texto de la url, podrías probar enviarlo como parte del mensaje:

          $url = ‘https://api.whatsapp.com/send?phone=’.$phone.’&text=’.str_replace(‘ ‘, ‘%20’, $message.'-'.$url_product); 
          

          El servicio de Whatsapp business tiene mucha más funcionalidad. Tomaré nota para un futuro tutorial sobre esto. Saludos.

  • Hola amigo gracias por las enseñanzas que nos das te pregunto yo quiero es con el botón de WhatsApp, compartir la imagen y el link que debería hacer o si tienes algún tutorial sobre esto,
    De nuevo gracias

  • Hola. Saludos.. gracias por todo el tiempo empleado para enseñarnos con tus post, Pregunto!!: como seria el código para agregar el precio del producto debajo del titulo, por ejemplo:
    "Quiero información del producto:
    Camiseta cuello en V
    $18,00"
    sera que se puede hacer y de forma ordenada?? gracias

    • Hola Jesús, podrías probar declarando la variable global de producto y lueg accediendo a su métodos que te darán el precio, algo similar a:

      global $product;
      $product->get_regular_price();
      $product->get_sale_price();
      $product->get_price();

      Saludos.