Product Page – edits

Hi could you please advise or point me in how I would increase the length of the add to cart button?

Also how would I move the add to wishlist button below the add to cart button. I’ve tried to illustrate what I mean below for you.

Thank you for your help.

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body .product-image-summary .single_add_to_cart_button {
    width: 100%;
}

Best Regards

Thank you. The code has only worked on desktop not mobile.

Also how would I move the add to wishlist button below the add to cart button.

Hello,

Please provide your site URL and admin access for checking.

Best Regards

Thank you, details enclosed

Hello,

The code is workable. You need to increase the width and put the code to the Theme Settings > Custom CSS > Mobile: https://gyazo.com/be9966346b567efb26304afdce980e7d

Add to wishlist is not possible to add right under Add to cart button.

Best Regards

Where would I find the file to edit the product page to change the layout?

Could I edit this and place it into the child theme?

Hello,

You can search the file in this folder wp-content/plugins/woocommerce/templates/single-product/

Add this code to the Theme Settings > Custom CSS > Mobile:

body .product-image-summary .single_add_to_cart_button {
    width: 100%;
}

Best Regards

Where you have said

Add to wishlist is not possible to add right under Add to cart button.

It is possible to get the wishlist below the add to cart button, when you don’t use the “After Add to cart button” text area“. That said, I still want to use the After Add to cart button text area but would like to move it’s location to just under the wishlist section. Currently the block appears just above wishlists and just below add to cart section. Could you advise me how to just drop this area just below.

Thank you for your time and help.

Hello,

You can use the area before “add to cart” button and the wishlist will get right below the button.

Best Regards

Thank you for replying back to me.

I don’t want to add the content into the before “add to cart” button but rather add them to the after “add to cart” button, which is after the wishlist section. Can I not move the after “add to cart” button section just below in the code? Like highlighted in the image below. This would make more sense. Although I’m struggling to locate how to do this.

Thank you for your time

Attachments:

You must be logged in to view attached files.

Try to add the following PHP code snippet to the child theme functions.php file to do this

remove_action( 'woocommerce_single_product_summary', 'woodmart_after_add_to_cart_area', 31 );
add_action( 'woocommerce_single_product_summary', 'woodmart_after_add_to_cart_area', 38 );

Hi Artem, Thank you. It has partially worked. I’ve added the code to the functions file but as you can see it has moved but still the other block appears.

Attachments:

You must be logged in to view attached files.

Please, disable all external plugins and send us your FTP access so we can check what is wrong there.

I’ve disabled plugins still problem is seen.

Try to replace with this code instead

function chage_after_add_to_cart_position() {
	remove_action( 'woocommerce_single_product_summary', 'woodmart_after_add_to_cart_area', 31 );
	add_action( 'woocommerce_single_product_summary', 'woodmart_after_add_to_cart_area', 38 );
}

add_action( 'init', 'chage_after_add_to_cart_position' );

Hi. I’ve hidden a category in the woocommerce sidebar widget using this code.

add_filter( 'woocommerce_product_categories_widget_args', 'organicweb_exclude_widget_category' );
function organicweb_exclude_widget_category( $args ) {
        $args['exclude'] = array('30' );
        return $args;
}

Yet I’m struggling to work out how to remove/hide one specific category from appearing in the category meta section on a product page.

Sorry, but we don’t have an instruction for such customization.

Hi the code in post https://xtemos.com/forums/topic/product-page-edits/#post-127648

to extend the add to cart button is not working on mobile devices. I’ve put the code into global settings and this has worked for desktop but not mobile. Any reasons why?

Hello,

I’m checking your product page and see that the code is applied on mobile devices too https://gyazo.com/3e73b36c8644c9e1ff758d915caca272

Kind Regards

Hi Artem your right it is working on google chrome developers tools like that but actually on a mobile device (Chrome and Safari) it is not, which is weird. Image provided below of how it is actually displaying.

Attachments:

You must be logged in to view attached files.

Try to increase the value from 40% to 60% for example and check the difference.

Hi Artem, Already tried that and still the button doesn’t change size on actual mobile devices, remains small.

When we test this with a real mobile device and looks correctly https://gyazo.com/688c4652fd53fc916f04617afb9eaa72

[Author]

Posts