In ProgressAdd to cart button

Viewing 15 posts - 1 through 15 (of 25 total)
  • Author
    Posts
  • #19581
    saladekom
    Participant

    Hi,
    How can I add like a “+” button next to the “order now” button so that a customer can easily add a product without having entered the products’ page?

    Thanks!

    #19612
    Althemist
    Keymaster

    Hi saladekom,

    I am afraid that would not be possible in the product listings.

    However, when the user clicks on the “Order Now” button it’d open a lightbox (modal) where they can customize quantity and other options without going to the product single page.

    Regards,
    Dimitar

    #19623
    saladekom
    Participant

    So there is no any way (not even with plugins) to add a “+” button on the product listings page?

    And what about the lightbox, can I add a “add to cart” button there?

    #19636
    Althemist
    Keymaster

    Hi saladekom,

    No, as I already said there is no way to add quantity selector for the listings.

    As for the lightbox, there IS add to cart button there by default.

    Regards,
    Dimitar

    #19649
    saladekom
    Participant

    I think you misunderstood my question.

    I don’t need a quantity selector. I want a custom button that says “add to cart” next to the “order now” button. So customers can easily add it to the cart without being redirected to the lightbox.

    Thanks

    #19650
    Althemist
    Keymaster

    Oh, I see. You can do this for variable products. We have a custom option for the variations (show in listings). You can see it in action here:

    https://lafka.althemist.com/fastfood/product-category/pizza/

    Alternatively, for simple products (not variable) you may hide the lightbox button (quickview) from theme options and show the hidden add to cart button CSS:

    div.prod_hold .links a.button.add_to_cart_button {
        display: inline-block;
    }

    Hope this helps.

    Regards,
    Dimitar

    #19661
    saladekom
    Participant

    where should I add this:

    div.prod_hold .links a.button.add_to_cart_button {
    display: inline-block;
    }

    #19670
    Althemist
    Keymaster

    You can install the lafka child theme and put the code in the style.css OR you can paste the code under Appearance > Customize > Additional CSS.

    If you’re new to child themes, you can read more here:

    Everything You Need To Know About WordPress Child Themes

    Hope this helps.

    Regards,
    Dimitar

    #19678
    saladekom
    Participant

    How can I remove the ligthbox pop-up after having added a product to the cart?

    #19684
    Althemist
    Keymaster

    I am afraid this can’t be disabled. Users must be notified in some way that their product was successfully added to the cart. The only option would be to disable the AJAX add to cart in WooCommerce > Settings, but that would make the site redirect users to the cart page every time they add a product.

    Regards,
    Dimitar

    #19687
    saladekom
    Participant

    Users are notified by the cart sign on the top of the page. But what if I download the plugin Woo Side Cart?
    Is it even then not possible to remove the ligthbox?

    #19693
    Althemist
    Keymaster

    No, I am afraid the lightbox is an integral part of the theme. The only option to remove the lightbox functionality would be to disable the AJAX add to cart functionality for listings under WooCommerce > Settings > Products and also for single product pages under Theme Options > Shop.

    Regards,
    Dimitar

    #19696
    saladekom
    Participant

    Is there a possibility to add a “shop further” button in the lightbox besides the “checkout” and “cart” buttons?

    It is sometimes quite confusing that the “X” is the button to shop further.

    #19697
    Althemist
    Keymaster

    Hi saladekom,

    It’s not impossible, but that would require some extensive PHP/HTML/CSS knowledge as the WooCommerce cart template should be modified. You’d need to use a child theme and modify the woocommerce/templates/cart/mini-cart.php

    You’d need to add a button similar to this:

    <a class="button-continue-shopping button"  href="<?php echo esc_url( apply_filters( 'woocommerce_continue_shopping_redirect', wc_get_page_permalink( 'shop' ) ) ); ?>">
            ← <?php echo __( 'Continue shopping', 'woocommerce' ) ?>
    </a>

    However, this is really not recommended as it may affect a lot of other woocommerce related plugins. Basically the “lightbox” is just the mini cart content are showing in full screen when product is added and it would auto-hide after few seconds. The X button is there for users who want to hide it immediately.

    In your case, may be the better option would be to modify the cart CSS, so it’s not full-screen. Actually, no one ever complained it’s confusing for users and the theme is running on more than 200 live fastfood websites.

    Regards,
    Dimitar

    #19698
    saladekom
    Participant

    Dimitar, the last solution you mentioned is great actually!
    How can I make the lightbox smaller?

Viewing 15 posts - 1 through 15 (of 25 total)

You must be logged in and have valid license to reply to this topic.

License required for the following item
Login and Registration Log in · Register
IMPORTANT!!!

Hello everybody! Please, accept our sincere appologies for the delaeyd support last 2 weeks. One of our team members was diagnosed with Covid-19 and we were isolated without the chance to leave home or access our office. We are now back to work and slowly catching up with delayed support tickets. We expect the queue to be cleared and everything to be back to normal schedule by Monday, 29th of June.

Thank you so much for your patience and understanding.

Best regards,
Althemist team
close-link