• Ir a navegación principal
  • Ir al contenido principal
  • Ir a la barra lateral primaria

DecodeCMS

Tu WordPress a otro Nivel ...

  • Acerca de
  • Contacto
  • Inicio
  • Tutoriales
    • Themes
    • Plugins
    • Core
    • Recursos
  • Cursos
Inicio / Tutoriales / Plugins / Modificar el precio de un producto por código en WooCommerce
Anuncio banner webservi

Modificar el precio de un producto por código en WooCommerce

Modificar el precio de un producto por código en WooCommerce

[ 4 diciembre 2020 ] [ Autor: Jhon Marreros Guzmán ][ Plugins - Avanzado] [ ]

funcionalidad

¿Me ayudas a llegar a más gente?

Twittear Compartir LinkedIn WhatsApp

Hace poco estaba analizando un proyecto en el que se requería que el precio de un producto de WooCommerce cambie dinámicamente pero sin usar variaciones de productos.

 

Generalidades

La idea es agregar un control adicional de selección de precios el cual cambiará el precio del producto dinámicamente, para lograr esto usaremos directamente código y evitaremos el uso de plugins adicionales.

El código completo lo puedes encontrar en este Gits: cambiar precio producto.
Para probar este código puedes simplemente copiarlo en el archivo functions.php de tu tema hijo

 

Código para mostrar la selección de precio

El siguiente código crea un control de selección que se muestra en la página del producto y a través de código javascript permite cambiar dinámicamente el precio base del producto.

<?php //no copiar esta línea

// Creamos el control de selección y el cambio dinámico de precio
add_action('woocommerce_before_add_to_cart_button', 'dcms_build_select_field');

function dcms_build_select_field(){
    global $product;

    $options = [
        "0"  => 'Selecciona una opción',
        "10" => 'Agrega, +10 al precio',
        "20" => 'Agrega, +20 al precio',
        "30" => 'Agrega, +30 al precio'
    ];

    woocommerce_form_field('extras_product', array(
        'type'          => 'select',
        'label'         => 'Agregar al producto',
        'required'      => true,
        'options'       => $options,
    ),'');

    $base_price = (float) wc_get_price_to_display( $product );
    $currency = get_woocommerce_currency_symbol();

    ?>
    <script>
    jQuery(function($){
        const base_price = <?php echo $base_price; ?>;
        const currency = "<?php echo $currency; ?>";

        $('#extras_product').on( 'change', function(){
            new_price = currency + (Number(this.value) +  base_price).toFixed(2);
            $('p.price').html( new_price );
        });
    });
    </script>
    <?php
}

 
Al final obtendremos algo similar a lo siguiente

Agregar monto al precio del producto

 

 

Código para guardar el nuevo precio en el carrito

Luego que cambiamos el precio dinámicamente en la página de producto, será necesario guardar este nuevo precio cuando se agregue este producto al carrito.


// Almacenamos el precio extra y el nuevo precio en los datos del ítem
add_filter( 'woocommerce_add_cart_item_data', 'dcms_extra_data_to_cart_item', 20, 2 );
function dcms_extra_data_to_cart_item( $cart_item_data, $product_id ){
    if( ! isset($_POST['extras_product']) ) return $cart_item_data;

    $extra_price = (float)$_POST['extras_product'];

    if ( ! $extra_price ) return $cart_item_data;

    $product = wc_get_product($product_id);
    $base_price = (float) $product->get_price();

    $new_price =$base_price + $extra_price;

    $cart_item_data['extras_product'] = array(
        'extra_price'    => $extra_price,
        'new_price' => (float) $new_price,
    );

    return $cart_item_data;
}


// Realizamos el cálculo del nuevo precio y lo asignamos a los datos de carro
add_action('woocommerce_before_calculate_totals', 'dcms_custom_cart_item_price', 20, 1);
function dcms_custom_cart_item_price( $cart ) {

    if ( is_admin() && ! defined( 'DOING_AJAX' ) ) return;
    if ( did_action( 'woocommerce_before_calculate_totals' ) >= 2 ) return;

    foreach (  $cart->get_cart() as $cart_item ) {
        if ( isset( $cart_item['extras_product']['new_price'] ) )
            $cart_item['data']->set_price( $cart_item['extras_product']['new_price'] );
    }
}

 
Aplicando el código anterior, se mostrará el precio modificado en el carrito:

Agregar nuevo precio en el carrito

 
 

Código para mostrar datos extra en el carrito

En el carrito tenemos guardado datos adicionales del precio extra, sin embargo sería bueno reflejar que cantidad adicional se agregó, para lograr esto mostraremos ese monto adicional como parte de los datos del ítem de carrito.


// Mostramos los datos extra en los ítems del carrito
add_filter( 'woocommerce_get_item_data', 'display_custom_cart_item_data', 10, 2 );
function display_custom_cart_item_data( $cart_data, $cart_item ) {

    if ( isset( $cart_item['extras_product']['new_price'] ) ){
        $cart_data[] = [
                'name' => 'Extras',
                'value' => '+' . $cart_item['extras_product']['extra_price']
            ];
    }

    return $cart_data;
}

 
Ahora se mostrará el adicional como parte de los datos del producto agregado.

Mostrar información extra en el carrito

 
 

Código para mostrar datos extra en la orden

Cuando se realice el pedido necesitaremos saber igualmente qué cantidad extra se agregó al precio, por lo tanto guardaremos ese dato en la metadata del ítem de la orden.


// Para guardar los datos en el ítem de producto y que se muestren en las órdenes del backend
function dcms_save_new_order_item( $item_id, $item, $order_id ) {
    wc_add_order_item_meta($item_id, 'Extra',  $item->legacy_values['extras_product']['extra_price']);
};
add_action( 'woocommerce_new_order_item', 'dcms_save_new_order_item', 10, 3 );

 
Ahora se mostrará el dato adicional como parte del ítem de una orden.

Mostrar información extra en la orden

 
 

Conclusión

Tal como hemos visto, puedes hacer cambios a los precios de tus productos directamente a través de código usando los Hooks de WooCommerce. Esto es especialmente útil cuando buscas algo personalizado y quieres evitar el uso de plugins adicionales.

 
¿Aún con dudas?, en el siguiente video se detallan los puntos anteriores.

Suscríbete a DecodeCMS:  

 

¿Me ayudas a llegar a más gente?

Twittear Compartir LinkedIn WhatsApp

Artículos Relacionados

  • Mostrar el stock en la lista de productos de WooCommerceMostrar el stock en la lista de productos de WooCommerce
  • Personalizar el Loop de WooCommercePersonalizar el Loop de WooCommerce
  • Agregar el campo de cantidad en la lista de productos de WooCommerceAgregar el campo de cantidad en la lista de productos de WooCommerce
  • Ocultar categorías que no están activas en widget de categorías WooCommerceOcultar categorías que no están activas en widget de categorías WooCommerce
Valora este artículo : 1 barra2 barras3 barras4 barras5 barras (3 votos, promedio: 5,00 de 5)
Cargando...

Interacciones con los lectores

Comentarios

  1. Carmen

    23 enero, 2021

    Te debo una¡

    • Jhon Marreros Guzmán

      25 enero, 2021

      Que bueno que te sirvió. Saludos.

Para escribir código envolver con: <pre class="language-xxx"><code> </code></pre> ,reemplaza las xxx (php, css, html)

*

* Gravatar habilitado

Barra lateral primaria

Presentación

Únete a DecodeCMS

Recibirás como regalo:

Guia práctica con video:
Los 5 posibles errores que estas cometiendo cuando trabajas con código en WordPress

Niveles

Básico Intermedio Avanzado

Etiquetas

accesibilidad css dashboard editor error funcionalidad herramientas imagen js librería mejoras optimización seguridad social

Populares

Agregar endpoints a la API REST de WordPress

Configurar AMP en WordPress

Cómo optimizar las revisiones en WordPress

Agregar campos adicionales al perfil de usuario

Recientes

  • Leer datos desde otra base de datos en WordPress
  • Crear un sitio One Page en WordPress
  • Mostrar lista de autores en WordPress
  • Añadir código de Google Tag Manager sin plugins en WordPress
alojamiento wordpress

© logo decode pie Copyright 2021 | Todos los derechos reservados | Política de Privacidad