Asesor
Asesor Disponible
¡Hola! 👋 ¿Qué servicios estás buscando hoy?
Escribiendo...
Saltar al contenido

Ariapsa - Diseño & Soporte Web

Código para agregar el campo de cantidad en pagina de tienda WooCommerce

Codigos para woocommerce

Añade el siguiente codigo en tu code snippets

Código
<div class="bsm-slider-outer">
<div class="bsm-slider"
     id="bsm_86febdcc"
     style="border-radius:10px"
     data-total="3"
     data-autoplay="true"
     data-interval="10000"
     data-pause="true">

    <div class="bsm-track">
            <div class="bsm-slide" style="border-radius:10px">
            <div class="bsm-slide__img-wrap">
                <a href="https://ariapsa.com/diseno-de-paginas-web/" target="_blank" rel="noopener" class="bsm-slide__img-link">
                    <img src="https://ariapsa.com/wp-content/uploads/2026/08/ads-diseno-de-disitios-web-rotativo-01.jpg"
                         alt="Diseño de sitios y páginas web"
                         class="bsm-slide__img"
                         loading="lazy" width="350" height="190">
                </a>
            </div>
            <div class="bsm-slide__body">
                <h2 class="bsm-slide__title">Diseño de sitios y páginas web</h2>                <p  class="bsm-slide__desc">Desde landing page hasta tiendas online, incluye dominio y hosting                                <a href="https://ariapsa.com/diseno-de-paginas-web/" target="_blank" rel="noopener"
                   class="bsm-slide__btn"
                   style="background-color:#ca0771 !important;color:#ffffff !important;display:inline-block !important;padding:9px 20px !important;border-radius:5px !important;text-decoration:none !important;font-weight:700 !important;">
                    Ver planes y precios                </a>
                            </div>
        </div>
            <div class="bsm-slide" style="border-radius:10px">
            <div class="bsm-slide__img-wrap">
                <a href="https://ariapsa.com/mkt" target="_blank" rel="noopener" class="bsm-slide__img-link">
                    <img src="https://ariapsa.com/wp-content/uploads/2026/08/ads-banner-rotativo-marketing-digital-ariapsa.jpg"
                         alt="¿Necesitas marketing digital para tu negocio?"
                         class="bsm-slide__img"
                         loading="lazy" width="350" height="190">
                </a>
            </div>
            <div class="bsm-slide__body">
                <h2 class="bsm-slide__title">¿Necesitas marketing digital para tu negocio?</h2>                <p  class="bsm-slide__desc">Planes desde posicionamiento SEO, redes sociales, Google y ChatGPT ADS.                                <a href="https://ariapsa.com/mkt" target="_blank" rel="noopener"
                   class="bsm-slide__btn"
                   style="background-color:#c70a78 !important;color:#ffffff !important;display:inline-block !important;padding:9px 20px !important;border-radius:5px !important;text-decoration:none !important;font-weight:700 !important;">
                    Ver planes                </a>
                            </div>
        </div>
            <div class="bsm-slide" style="border-radius:10px">
            <div class="bsm-slide__img-wrap">
                <a href="https://ariapsa.com/dossier" target="_blank" rel="noopener" class="bsm-slide__img-link">
                    <img src="https://ariapsa.com/wp-content/uploads/2026/08/ads-diseno-de-dossier.jpg"
                         alt="Dossier de ventas"
                         class="bsm-slide__img"
                         loading="lazy" width="350" height="190">
                </a>
            </div>
            <div class="bsm-slide__body">
                <h2 class="bsm-slide__title">Dossier de ventas</h2>                <p  class="bsm-slide__desc">Convertimos tu presentación PPT en una herramienta de prospección optimizada para móviles.                                <a href="https://ariapsa.com/dossier" target="_blank" rel="noopener"
                   class="bsm-slide__btn"
                   style="background-color:#af1854 !important;color:#ffffff !important;display:inline-block !important;padding:9px 20px !important;border-radius:5px !important;text-decoration:none !important;font-weight:700 !important;">
                    Cotizar ahora                </a>
                            </div>
        </div>
        </div><!-- /.bsm-track -->

        <div class="bsm-arrows--center">
        <button class="bsm-arrow bsm-arrow--prev" aria-label="Anterior">‹</button>
        <button class="bsm-arrow bsm-arrow--next" aria-label="Siguiente">›</button>
    </div>
    
        <div class="bsm-dots" role="tablist">
                <button class="bsm-dot bsm-dot--active"
                data-index="0"
                role="tab"
                aria-label="Slide 1"></button>
                <button class="bsm-dot"
                data-index="1"
                role="tab"
                aria-label="Slide 2"></button>
                <button class="bsm-dot"
                data-index="2"
                role="tab"
                aria-label="Slide 3"></button>
            </div>
    
</div>
</div>

<script>
(function(){
    var el=document.getElementById('bsm_86febdcc');
    if(!el) return;
    var track=el.querySelector('.bsm-track');
    var dots=el.querySelectorAll('.bsm-dot');
    var total=parseInt(el.dataset.total,10)||1;
    var doAuto=el.dataset.autoplay==='true';
    var ms=parseInt(el.dataset.interval,10)||10000;
    var pauseH=el.dataset.pause==='true';
    var cur=0,timer=null,busy=false;
    function go(n,instant){
        if(busy&&!instant) return;
        n=((n%total)+total)%total;
        if(n===cur&&!instant) return;
        cur=n;
        if(!instant){
            busy=true;
            track.classList.add('bsm-animating');
            var done=function(){ track.removeEventListener('transitionend',done); track.classList.remove('bsm-animating'); busy=false; };
            track.addEventListener('transitionend',done);
            setTimeout(function(){ if(busy){ track.classList.remove('bsm-animating'); busy=false; } },500);
        }
        track.style.transform='translateX(-'+(cur*100)+'%)';
        dots.forEach(function(d,i){ d.classList.toggle('bsm-dot--active',i===cur); d.setAttribute('aria-selected',i===cur?'true':'false'); });
    }
    function startAuto(){ if(doAuto&&total>1) timer=setInterval(function(){ go(cur+1); },ms); }
    function stopAuto(){ clearInterval(timer); }
    function resetAuto(){ stopAuto(); startAuto(); }
    el.querySelectorAll('.bsm-arrow--prev').forEach(function(btn){ btn.addEventListener('click',function(e){ e.preventDefault(); go(cur-1); resetAuto(); }); });
    el.querySelectorAll('.bsm-arrow--next').forEach(function(btn){ btn.addEventListener('click',function(e){ e.preventDefault(); go(cur+1); resetAuto(); }); });
    dots.forEach(function(d){ d.addEventListener('click',function(e){ e.preventDefault(); go(parseInt(d.dataset.index,10)); resetAuto(); }); });
    if(pauseH){ el.addEventListener('mouseenter',stopAuto); el.addEventListener('mouseleave',startAuto); }
    var tx=null;
    el.addEventListener('touchstart',function(e){ tx=e.touches[0].clientX; },{passive:true});
    el.addEventListener('touchend',function(e){ if(tx===null) return; var dx=e.changedTouches[0].clientX-tx; if(Math.abs(dx)>40){ go(dx<0?cur+1:cur-1); resetAuto(); } tx=null; });
    go(0,true);
    startAuto();
})();
</script>

//Agregamos código HTML
add_filter( 'woocommerce_loop_add_to_cart_link', 'dcms_add_quantity_field', 10, 2 );
function dcms_add_quantity_field($html, $product) {
if($product&&
$product->is_type('simple')&&
$product->is_purchasable()&&
$product->is_in_stock()&&
!$product->is_sold_individually()){
$html='<form action="'. esc_url($product->add_to_cart_url()).'" class="cart" method="post" enctype="multipart/form-data">';
$html.= woocommerce_quantity_input(array(),$product,false);
$html.='<button type="submit" data-quantity="1" data-product_id="'.$product->get_id().'" class="button alt ajax_add_to_cart add_to_cart_button product_type_simple">'. esc_html($product->add_to_cart_text()).'</button>';
$html.='</form>';
}
return$html;
}
//Agreamos código javascript
add_action( 'init', 'dcms_quantity_change' );
function dcms_quantity_change() {
wc_enqueue_js('
(function( $ ) {
$("form.cart").on("change", "input.qty", function() {
$(this.form).find("[data-quantity]").attr("data-quantity", this.value);
});
})( jQuery );
');
}
×

Iniciar Sesión

[custom_login_form]
[custom_registration_form]