wishlist along with add to cart button

[Jonatas]

Hello,

I’m trying to put the wishlist together with the add to cart button, how can I do this?
Can you help me with this question?

• This topic was modified 1 year, 7 months ago by Jonatas.

Attachments:

You must be logged in to view attached files.

Hi,

HTML structure does not allow solving it by custom CSS. Such modification requires complicated Woocommerce code customization which is not covered by our support.

Best Regards.

Aizaz, you do this customization, I pay you to do this customization and what would the cost be? Because as it depends on knowing the hooks of themes and woocommerce it would be interesting for me to pay you who already have this know-how

Hello,

Sorry to say but we don’t provide additional customizations, unfortunately.

Best Regards.

Hi, got it, could you tell me what are the theme’s wishlist hooks and add to cart button

Hello,

Please add this code to the functions.php of the child theme:

	add_action( 'wp', function () {
		if ( class_exists( 'XTS\WC_Wishlist\Ui' ) ) {
			remove_action( 'woocommerce_single_product_summary', array( XTS\WC_Wishlist\Ui::get_instance(), 'add_to_wishlist_single_btn' ), 33 );
			add_action( 'woocommerce_after_add_to_cart_button', array( XTS\WC_Wishlist\Ui::get_instance(), 'add_to_wishlist_single_btn' ), 1 );
		}
	}, 100);

Then check how it works.

Best Regards

Hello Elise,
I added the code you sent me in the child theme’s functions.php and it worked, thanks for helping me with this question.

I put this css below to adjust the wishlist button, but I wanted to remove the name and leave only the wislist icon, how could I do that?
And is this css that I put correct?

.wd-btn-design-full form.cart :where(.single_add_to_cart_button,.wd-buy-now-btn) {
    flex: 0 0 84%;
}
.wd-wishlist-btn.wd-action-btn.wd-style-text.wd-wishlist-icon {
    background: black;
    padding: 15px;
    width: 15px;
    --action-btn-color: white;
    --action-btn-hover-color: #ce2323;
    justify-content: var(--content-align)
}
.woocommerce-variation-add-to-cart>* {
    flex: none;
}
.woocommerce-variation-add-to-cart {

    gap: 2px;
    justify-content: var(--content-align);
}

Attachments:

You must be logged in to view attached files.

Hello,

The HTML structure does not allow to align Wishlist button with the Add to cart in a nice way as it requires a complicated customization which is not covered by our support.

Your product page is created in Woocommerce builder, please check the Wishlist button settings, you will find the option to show icons only.

We cannot guarantee the smooth performance of the custom CSS as we do not support third parties code.

If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts