Return to previous page

No selection in the number of products & wishlist

This topic has 14 replies, 3 voices, and was last updated 6 years, 3 months ago ago by Olga Barlow

Tagbag

Participant

August 16, 2018 at 10:51

Hey,
First, I want to say sorry. Sorry for asking you for help so often. I can imagine how stressful it is over time. And thank you for always helping! Nevertheless, I would like to ask you once again for help:

Is it possible to make the following changes to the single product page:

1) How did you get the wish list next to the shopping cart button? Or is this just because of the sidebar?

I know, I’ve asked that before, but I just noticed that in your documentation ^^
Here the link:
https://www.8theme.com/documentation/docs/single-product-page/

2)Is it possible to adjust that the customer can only buy one product at a time?

Best Regards
Joey

#198147 Copied

13 Answers
Rose Tyler

Support staff

August 16, 2018 at 11:07
Hello,

Thank you for using our theme.
1. Sorry for the incorrect screenshot in our documentation. That position for the wishlist is missing, by default, but you can achieve the similar result http://prntscr.com/kj9sz3 by adding this code in Theme Options > Styling > Custom css > Custom css for desktop:
```
.single-product .yith-wcwl-add-to-wishlist {
    display:  inline-block;
}
.single-product .add_to_wishlist {
    font-size: 0px !important;
}
.single-product .product-information .cart {
    width: 55%;
}
```
2. Try to add this code in Global custom css area:
```
.single-product .qty-span, .single-product .quantity {
    display: none !important;
}
```
Regards
#198148 Copied
Tagbag

Participant

August 16, 2018 at 11:59

Hey Rose,

That is pretty awesome.

But now that the quantity is invisible, the wish list is far away from the shopping cart:

Is it possible to apply the width only to the line with the shopping cart?
Because the line with the product variations gets thereby an unsightly line break

And could you tell me how to give the wishlist a background so that it would look like this:

I’m sorry for all the inconvenience^^

Regards
Joey

#198149 Copied
Rose Tyler

Support staff

August 16, 2018 at 12:38
Hello,

In this case, you can add this code in Global custom css:
```
.single-product .yith-wcwl-add-to-wishlist {
    position:  absolute;
    bottom: 12%;
    right: 5%;
    background-color: #262626;
    padding: 14px 12px 1px 15px;
}
.single-product .add_to_wishlist {
    font-size: 0px !important;
    display:  inline-block;
}
.single-product .add_to_wishlist:before {
    margin-right: 0px !important;
    color:  white;
}
.single-product .yith-wcwl-add-button.show {
    width: 20px;
}
```
http://prntscr.com/kjb00g
The wishlist button will be placed on right of Add to cart button to prevent problems with the position on different devices.

Regards
#198152 Copied
Tagbag

Participant

August 16, 2018 at 13:32

Hey,

That is good, but there are two problems now:

1) video – example

For products with 4 variations everything is at the right height. For products with more than 4 variations, however, the variation name and the variations are no longer at the same height.

2) illustrated here once again

Can I remove the text after adding to wishlist? This makes problems on the phone. I would like to dye the wish list icon black just after the click. This is also the case on the product page.

Best Regards
Joey 🙂

#198159 Copied
Rose Tyler

Support staff

August 16, 2018 at 14:08
Hello,

1. Thanks for the video.
Please try this code:
```
.single-product .woo-variation-items-wrapper {
    padding-top: 16px !important;
}
```
2. You can add this code:
```
.single-product .product-information .yith-wcwl-wishlistexistsbrowse a:not(.alt):before, .single-product .product-information .yith-wcwl-wishlistaddedbrowse a:not(.alt):before {
    content: "\f004" !important;
    color: #000 !important;
    font-size: 1rem;
}
.single-product .yith-wcwl-add-to-wishlist a {
    font-size: 0px !important;
}
.single-product .yith-wcwl-add-to-wishlist {
    width: 25px;
}
```
+ change “bottom” value to 11% here – http://prntscr.com/kjce49

Regards
#198164 Copied
Tagbag

Participant

August 16, 2018 at 14:33

Hey,

Many thanks!

But there are again a few problems 😀
video

The wishlist is after the click above. And now the products with 4 variations and less are no longer on the same level.

Regards
Joey

#198165 Copied
Rose Tyler

Support staff

August 16, 2018 at 14:47
Hello,

1. Please delete this http://prntscr.com/kjcxij and this code http://prntscr.com/kjcxu6
2. Change this http://prntscr.com/kjcyzq to:
```
.single-product .product-information .yith-wcwl-wishlistexistsbrowse a:not(.alt):before, .single-product .product-information .yith-wcwl-wishlistaddedbrowse a:not(.alt):before {
    content: "\f004" !important;
    color: #000 !important;
    font-size: 1rem;
}
.single-product .yith-wcwl-add-to-wishlist a {
    font-size: 0px !important;
}
.single-product .yith-wcwl-add-to-wishlist {
    width: 20px;
}
```
and this http://prntscr.com/kjczmv to http://prntscr.com/kjczr8

Regards
#198167 Copied
Tagbag

Participant

August 16, 2018 at 15:04

Awesome!!

But one more problem, or i did something wrong again:

video

Regards
Joey

#198169 Copied
Rose Tyler

Support staff

August 16, 2018 at 15:18
Please change this http://prntscr.com/kjdei7 to 1.25rem and this http://prntscr.com/kjdesb to:
```
.single-product .yith-wcwl-add-to-wishlist {
    width: 20px;
    font-size: 0px;
    line-height: 3;
}
```
Let me know the result.

Regards
#198170 Copied
Tagbag

Participant

August 16, 2018 at 15:32

Damn rose, you know your work.

Thanks you a lot.
For today you have then first rest in front of me ^^

Best Regards
Joey

#198173 Copied

Rose Tyler

Support staff

August 16, 2018 at 15:37

You’re welcome 🙂
Have a nice day

Regards

#198174 Copied

Tagbag

Participant

August 16, 2018 at 15:52

Have a nice day too.

But nvm, there is a new problem, im so sorry, i didnt see it before^^:
video

The delivery time is now hidden after selecting the variations.
On the phone, however, it is still visible.

Or is it perhaps even possible to position the delivery time and shipping costs directly above the shopping cart:

to

Regards

#198176 Copied

Olga Barlow

Support staff

August 17, 2018 at 07:37

Hello,

That information is related to WooCommerce Germanized plugin. For that product, we don’t see mentioned information even on mobile. Do you have this problem with our theme only? Does it work fine with the default WooCommerce theme Storefront? Because we are able to help you only in case problem appears with our theme only and everything works fine with the default theme. In other cases, you need to contact plugin author about all the questions related to that plugin functionality.

Regards

#198197 Copied
Viewing 14 results - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.Log in/Sign up

Unleash your online potential

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder

Minimal Electronics – WordPress WooCommerce Theme

lazy-placeholder

Rental Car – WordPress WooCommerce Theme

lazy-placeholder

Water Delivery – WordPress WooCommerce Theme

lazy-placeholder

Medical 02 – WordPress WooCommerce Theme

lazy-placeholder

Minimal Fashion 03 Store – WordPress WooCommerce Theme

lazy-placeholder

Industrial Power Tools Store – WordPress WooCommerce Theme

lazy-placeholder

Coffee Store – WordPress WooCommerce Theme

lazy-placeholder

Jewelry Store – WordPress WooCommerce Theme

lazy-placeholder

Organic Store – WordPress WooCommerce Theme

lazy-placeholder

Tea Store – WordPress WooCommerce Theme

See All Templates

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.