Moving Woocommerce Add to Cart to Widget area


Hello,

If the WooCommerce add-to-cart form should go above the breadcrumbs (full-width) while breadcrumbs themselves retain the uk-container styling, the following should do the trick.

function mycustomfunction() {

    // Remove items from summary
    remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );

    // Switch around uk-container classes so breadcumbs stay in container and WooCommerce form stay full-width
    beans_remove_attribute( 'beans_fixed_wrap[_main]', 'class', 'uk-container uk-container-center' );
    beans_add_attribute( 'beans_breadcrumb', 'class', 'uk-container uk-container-center' );

    // Add items to sidebar
    if ( is_singular( 'product' ) ) {
        add_action( 'beans_breadcrumb_before_markup', 'woocommerce_template_single_add_to_cart', 1 );
    }

}

add_action( 'wp', 'mycustomfunction' );

If you're still interested in putting this into a widget, here's a guide on adding widget areas and a previous discussion. About creating the widget itself, I honestly haven't done that too often - but I'm sure someone on StackExchange has.


Hi Kevin,

Thank you so much, problem solved! I was scratching my noodle on this one for a good number of hours, it completely surpassed me about removing / adding styling to the different containers. Because the beans_main_grid has a uk-grid on it with margin: 0; I added a new class just to centralize it all with margin: 0 auto;

I also managed to add the add to cart directly to a widgets text container, fully updated code below:

function mycustomfunction() {

    // Remove items from summary
    remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );

     // Switch around uk-container classes so breadcumbs stay in container and WooCommerce form stay full-width
    beans_remove_attribute( 'beans_fixed_wrap[_main]', 'class', 'uk-container uk-container-center' );
    beans_add_attribute( 'beans_breadcrumb', 'class', 'uk-container uk-container-center' );
    beans_add_attribute('beans_main_grid', 'class', 'uk-center uk-container uk-container-center' );

    // Add items to sidebar
   if ( is_singular( 'product' ) ) {
        add_action( 'beans_widget_content[_ctabar][_text][_text-20]_prepend_markup', 'woocommerce_template_single_add_to_cart', 1 );
    }

}

Hey Hayden

Can you give some more details on how you got it to work in the sidebar? Thank you. Have a continued great holiday!

Write a reply

Login or register to write a reply, it's free!