Move add to cart button same line price

  • Hello,

    I try to move the “add to cart” button in the same line then price (between product title and short description)

    The problem is that i use only variable product with about 60 variations (colors).

    So customers need to scroll a lot before seeing add to cart.

    I know how to do with single product (with hooks) but it doesn’t work with variable product.

    When i change the display order (with remove action… / add action..) in function.php there is a white area close on the right of featured pic.

    What i want to do:

    On the right of featured image:
    1)Product title on the top
    2)Price and add to cart (with quantity increment)
    3)Short description

    Under featured image in full width:

    1)all my variation (i have a swatch variation plugin)
    2)product description

    Is it possible ? and how ?(step by step because i’m not a develloper…)

    Thanks by advance.

    Sylvain Paolini

Viewing 3 replies - 1 through 3 (of 3 total)

  • Its unlikely you’ll get some custom development work via a forum answer. You could put your non-working code for variable products on pastebin.com and put the link here, but the chances of being able to debug it are not good without access for development and testing. Are you working on the core WooCommerce plugin or on theme override templates.

    If you managed to change the display order with single products but not with variable, maybe you are just using the wrong hooks.

    Try loading up this helpful plugin:
    https://hookr.io/plugin/
    When activated, your pages will be littered with little boxes that show which hook is firing at which point during page formation.

    The “little white area” can probably be corrected with some custom css. Please post the url to a relevant page.

    Thread Starter pulmol

    (@pulmol)

    Thanks for your reply. I’am going to test the different way you give to me.
    I think i am not the only shop selling variable product with many variation on the web, so i hope finding how the other do to display correctly.

    What i want is just that:

    Test variable product page

    Maybe is more simple and quick to buy another theme (like flatsome) which have many product page layout…

    Thanks for all

    Maybe, but I think the solution lies in a remove_action() call to remove the add-to-cart:

     
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );

    (the priority parameter 30 must be the same as used in the original add_action)
    then add it back in higher up with:

    
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 15 );

    See content-single-product.php for the relevant priorities of the different sections.

    If your theme has its own content-single-product.php then you should be looking at that one.

    Code should be in functions.php for your child theme.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Move add to cart button same line price’ is closed to new replies.