No selection in the number of products & wishlist

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

  • Avatar: Tagbag
    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

    13 Answers
    Avatar: Rose Tyler
    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

    Avatar: Tagbag
    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

    Avatar: Rose Tyler
    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

    Avatar: Tagbag
    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 🙂

    Avatar: Rose Tyler
    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

    Avatar: Tagbag
    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

    Avatar: Rose Tyler
    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

    Avatar: Tagbag
    Tagbag
    Participant
    August 16, 2018 at 15:04

    Awesome!!

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

    video

    Regards
    Joey

    Avatar: Rose Tyler
    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

    Avatar: Tagbag
    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

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    August 16, 2018 at 15:37

    You’re welcome 🙂
    Have a nice day

    Regards

    Avatar: Tagbag
    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

    Avatar: Olga Barlow
    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

  • Viewing 14 results - 1 through 14 (of 14 total)

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

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