Artículo actualizado el 27 de octubre de 2024
Tiempo de Lectura: 13 minuto(s)Un snippet es un fragmento de código que se inserta en tu tienda online o sitio web con WordPress para realizar pequeñas personalizaciones o agregar funcionalidades específicas.
Para una tienda online en WooCommerce, los snippets son esenciales porque brindan flexibilidad sin sobrecargar el sitio con plugins adicionales, lo cual puede afectar el rendimiento y la seguridad de la tienda. Además, permiten a los administradores de la tienda ajustar pequeños detalles del funcionamiento de WooCommerce para mejorar la experiencia del cliente o personalizar el sitio según sus objetivos comerciales, sin depender completamente de soluciones externas.
Para realizar este tutorial correctamente necesitas:
- Tienda Online con Woocommerce actualizado a su última versión
- Plugin Gratis Code Snippets (lo puedes descargar más abajo)
- Muchas ganas de mejorar tu tienda online
Plugin necesario para seguir el tutorial (es gratis):
Modificar el mensaje de «Añadir al carrito»
add_filter( 'woocommerce_product_single_add_to_cart_text', 'custom_add_to_cart_text' );
function custom_add_to_cart_text() {
return __( 'Realizar Pedido', 'woocommerce' );
}
Mostrar ahorro de dinero para productos en oferta (Para productos simples y variables)
add_action( 'woocommerce_single_product_summary', 'show_discount_amount_for_variable_and_simple_products', 15 );
function show_discount_amount_for_variable_and_simple_products() {
global $product;
if ( $product->is_on_sale() ) {
if ( $product->is_type( 'variable' ) ) {
// Para productos variables
$available_variations = $product->get_available_variations();
$min_regular_price = $product->get_variation_regular_price( 'min', true );
$min_sale_price = $product->get_variation_sale_price( 'min', true );
if ( $min_regular_price && $min_sale_price ) {
$savings = $min_regular_price - $min_sale_price;
echo '<p style="color: green;">¡Ahorra desde ' . wc_price( $savings ) . ' en este producto!</p>';
}
} else {
// Para productos simples
$regular_price = $product->get_regular_price();
$sale_price = $product->get_sale_price();
$savings = $regular_price - $sale_price;
echo '<p style="color: green;">¡Comprando hoy ahorras: ' . wc_price( $savings ) . '!</p>';
}
}
}
Permitir insertar máximo X cantidad de digitos en campo «teléfono» en Woocommerce
add_filter( 'woocommerce_checkout_fields', 'bbloomer_checkout_fields_custom_attributes', 9999 );
function bbloomer_checkout_fields_custom_attributes( $fields ) {
$fields['billing']['billing_phone']['maxlength'] = 10;
return $fields;
}
Ocultar campos del Checkout si el producto es «virtual» o «descargable»
add_filter( 'woocommerce_checkout_fields', 'bbloomer_simplify_checkout_virtual' );
function bbloomer_simplify_checkout_virtual( $fields ) {
$only_virtual = true;
foreach( WC()->cart->get_cart() as $cart_item_key => $cart_item ) {
// Check if there are non-virtual products
if ( ! $cart_item['data']->is_virtual() ) $only_virtual = false;
}
if ( $only_virtual ) {
unset($fields['billing']['billing_company']);
unset($fields['billing']['billing_address_1']);
unset($fields['billing']['billing_address_2']);
unset($fields['billing']['billing_city']);
unset($fields['billing']['billing_postcode']);
unset($fields['billing']['billing_country']);
unset($fields['billing']['billing_state']);
unset($fields['billing']['billing_barrio']);
add_filter( 'woocommerce_enable_order_notes_field', '__return_false' );
}
return $fields;
}
Desactivar otros métodos de envío si el cliente cumple con «Envío Gratis»
/**
* Hide shipping rates when free shipping is available.
* Updated to support WooCommerce 2.6 Shipping Zones.
*
* @param array $rates Array of rates found for the package.
* @return array
*/
function my_hide_shipping_when_free_is_available( $rates ) {
$free = array();
foreach ( $rates as $rate_id => $rate ) {
if ( 'free_shipping' === $rate->method_id ) {
$free[ $rate_id ] = $rate;
break;
}
}
return ! empty( $free ) ? $free : $rates;
}
add_filter( 'woocommerce_package_rates', 'my_hide_shipping_when_free_is_available', 100 );Permite que solo se puedan insertar números en el campo «teléfono» en Woocommerce
add_action('wp_footer', 'ecommercehints_billing_phone_validation');
function ecommercehints_billing_phone_validation() {
if ( is_checkout() && ! is_wc_endpoint_url() ) :
?>
<script type="text/javascript">
jQuery( function($){
$('#billing_phone').on( 'input focusout', function() {
var p = $(this).val();
$(this).val($(this).val().replace(/[^0-9]/g, ''));
});
});
</script>
<?php
endif;
}Mostrar Banner de bienvenida a nuevos visitantes (se muestra una vez)
add_action( 'wp_footer', 'popup_promotion_banner' );
function popup_promotion_banner() {
?>
<div id="promo-banner" style="display: none; position: fixed; bottom: 10px; left: 10px; background: #ffcc00; padding: 20px; z-index: 9999;">
<p>¡Oferta especial! 10% de descuento en tu primera compra. Usa el código: BIENVENIDO</p>
<button id="close-banner" style="cursor: pointer;">Cerrar</button>
</div>
<script>
document.addEventListener("DOMContentLoaded", function() {
if (!localStorage.getItem('promoBannerClosed')) {
document.getElementById('promo-banner').style.display = 'block';
}
document.getElementById('close-banner').onclick = function() {
document.getElementById('promo-banner').style.display = 'none';
localStorage.setItem('promoBannerClosed', 'true'); // Guarda en localStorage que el banner se cerró
};
});
</script>
<?php
}
Limitar venta de producto a X cantidad
add_action( 'woocommerce_check_cart_items', 'limit_specific_product_in_cart' );
function limit_specific_product_in_cart() {
$product_id = 123; // ID del producto específico
$max_quantity = 4; // Máxima cantidad permitida para este producto
$product_quantity = 0;
foreach ( WC()->cart->get_cart() as $cart_item ) {
if ( $cart_item['product_id'] == $product_id ) {
$product_quantity += $cart_item['quantity'];
}
}
if ( $product_quantity > $max_quantity ) {
wc_add_notice( 'Solo puedes añadir hasta ' . $max_quantity . ' unidades de este producto al carrito.', 'error' );
}
}
Establece un monto mínimo de compra
add_action( 'woocommerce_checkout_process', 'check_minimum_order_amount' );
add_action( 'woocommerce_before_cart' , 'check_minimum_order_amount' );
function check_minimum_order_amount() {
$minimum = 100000; // Ajusta el mínimo según tus necesidades y adáptalo a tu moneda
if ( WC()->cart->total < $minimum ) {
if( is_cart() ) {
wc_print_notice(
sprintf( 'Debe gastar al menos %s para finalizar la compra.' , wc_price( $minimum ) ), 'error'
);
} else {
wc_add_notice(
sprintf( 'Debe gastar al menos %s para finalizar la compra.' , wc_price( $minimum ) ), 'error'
);
}
}
}
Establece una fecha de entrega estimada en Woocommerce
add_action( 'woocommerce_single_product_summary', 'estimated_delivery_date', 30 );
function estimated_delivery_date() {
$days_to_delivery = 4; // Cambia "5" por los días de entrega estimados
$delivery_date = date_i18n( 'j \d\e F \d\e Y', strtotime( "+" . $days_to_delivery . " days" ) );
echo '<p>🚚 Entrega estimada: <strong>' . $delivery_date . '</strong></p>';
}
Descuento en Primera Compra (funciona solo en usuarios registrados)
add_action( 'woocommerce_cart_calculate_fees', 'apply_first_purchase_discount' );
function apply_first_purchase_discount( $cart ) {
if ( is_admin() && ! defined( 'DOING_AJAX' ) ) return;
$user_id = get_current_user_id();
if ( $user_id && ! wc_get_customer_order_count( $user_id ) ) {
$discount = 10000; // Define en dinero y moneda local el valor del descuento fijo - uso peso colombiano
$cart->add_fee( 'Descuento Primera Compra', -$discount );
}
}
Añadir Texto personalizado en el carrito, ejemplo: Obtén envío gratis a partir de X cantidad
add_action( 'woocommerce_before_cart', 'custom_cart_message' );
function custom_cart_message() {
echo '<p style="text-align: center; color: #ff0000;">¡Obtén envío gratis en pedidos superiores a $60.000!</p>';
}
Agrega texto en los métodos de pago, ejemplo: ¿Cómo deseas pagar?
add_action( 'woocommerce_review_order_before_payment', 'bbloomer_checkout_payment_options_title' );
function bbloomer_checkout_payment_options_title() {
echo '<h3>¿Cómo deseas pagar?</h3>';
}Agregar ícono de carrito en botón «añadir al carrito» (CSS)
Importante: Tu Theme o plantilla debe tener integrada la librería de Font Awesome
button.single_add_to_cart_button:before {
display: inline-block;
font-family: FontAwesome;
float: left;
content: "\f217";
font-weight: 300;
margin-right: 1em;
}
Agregar mensaje personalizado en la página de «gracias» en Woocommerce
add_filter( 'woocommerce_thankyou_order_received_text', 'ecommercehints_thank_you_intro_text', 20, 2 );
function ecommercehints_thank_you_intro_text( $thank_you_title, $order ){
return '<br>Gracias por tu compra ' . $order->get_billing_first_name() . '. Por favor confirma tu pedido respondiendo al Whatsapp que te hemos enviado.';
}Deshabilitar Autocompletado en el Checkout de Woocommerce
add_filter( 'woocommerce_checkout_fields', 'bbloomer_disable_autocomplete_checkout_fields' );
function bbloomer_disable_autocomplete_checkout_fields( $fields ) {
$fields['billing']['billing_address_1']['billing_address_2']['billing_phone']['autocomplete'] = false;
return $fields;
}De cero ($ 0) a «Gratis, ideal para productos virtuales o físicos que sean gratuitos
add_filter( 'woocommerce_get_price_html', 'ecommercehints_change_zero_price_display', 10, 2 );
function ecommercehints_change_zero_price_display( $price, $product ) {
if (empty($product->get_price()) || $product->get_price() == 0) { // If price is not entered or set to 0
$price = __( 'Gratis', 'woocommerce' );
}
return $price;
}Reducir Fortaleza de Contraseña en Woocommerce
add_action ('wp_print_scripts', function () {
wp_dequeue_script ('wc-password-strength-meter');
}, 10);
