Move variations on top of short description

  • Hi there,
    on my Woocommerce product page, I’m trying to move the variation dropdowns on top of the short description and below the shipment info. I tried to insert remove_action and add_action commands into function.php, but without success. Can someone help me with this?

    Here is a screenshot of my current situation:
    https://1drv.ms/u/s!AozyLumA02R5y8UbsZ-2lwYZG2KTJw

    Thanks a lot! Frank

Viewing 5 replies - 1 through 5 (of 5 total)
  • laceyrod

    (@laceyrod)

    Automattic Happiness Engineer

    Hi Frank,

    This would require more complex development. I’ll go ahead and leave this thread open for a while in case anyone else wants to chime in, but in the meantime, I can also recommend the following resources for more development-oriented questions:

    – WooCommerce Slack Community: https://woocommerce.com/community-slack/
    – Advanced WooCommerce group on Facebook: https://www.facebook.com/groups/advanced.woocommerce/

    Cheers!

    Hey Frank

    Can you share the functions you have tried already?

    Is there a chance that the shipping info is already part of the short description content block?

    // relocate add to cart variable box above product excerpt
add_action( 'init', 'jk_edit_woocommerce_single_product_summary' );
function jk_edit_woocommerce_single_product_summary() {
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 19 );
}

    The Add to Cart Block is Wrapped up with the Variable selections, if you just move that whole block above the excerpt it will do what you want. You can also target specific parts of the page and reorganize their layout using the same code. If you’d like to see how all the elements are ordered and try to reorder them further yourself using the code above just go here. . .

    woocommerce/templates/content-single-product.php

    • This reply was modified 4 years, 9 months ago by SU Mike.
    Thread Starter perlfan

    (@perlfan)

    Hi there,
    I used the code below – applying the code, I get the following order of elements:
    https://1drv.ms/u/s!AozyLumA02R5y8U2j-s9SbUHCCUzsw?e=uHL60V
    -> Now the short description is below the Add to cart button… it should be below the variation drop downs though (price and variations are in correct order).
    Thanks for help. Frank

    remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_excerpt', 20);
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30);
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_excerpt', 15 );
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 10 );
    Thread Starter perlfan

    (@perlfan)

    @su-mike Sorry for not having replied yet to your approach. The problem I currently have is that the product short description appears directly under the price & shipping info. On mobile phones, the price and variations are then too far apart to be able to see how the price dynamically changes with different variations, which is a problem. Thus I would like to move the variations up, directly under price / shipping info. Here is my current layout:
    https://1drv.ms/u/s!AozyLumA02R5y8UbsZ-2lwYZG2KTJw

    I pasted your code into functions.php, but nothing changes (I guess it moves up “woocommerce_template_single_add_to_cart” to priority 19). So maybe I applied your code incorrectly? Thanks for help.
    Frank

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Move variations on top of short description’ is closed to new replies.