[Support request] Woocommerce layout – digital wallet

Home Forums Support [Support request] Woocommerce layout – digital wallet

Home Forums Support Woocommerce layout – digital wallet

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1763366
    DAVID

    Hi all,

    I have added the digital wallet section of woocommerce via my payments plugin square.

    While I realise this is outside the bounds of generatepress it appears to add the digital wallet in a strange space which generatepress is not expecting. I have looked at the live preview in the Storefront theme and it stacks nicely with the add to basket option at the bottom. This is how I see it on my site though:

    https://ibb.co/k6m1Qyv

    On the documentation, the square plugin provides at https://docs.woocommerce.com/document/woocommerce-square/ they provide a graphic of what it should look like on the site:

    Screenshot of digital wallet from square plugin documentation

    On my site, the + – buttons get squashed up and the add to basket button doesn’t run underneath nicely as per the visual. It seems to be placed in the wrong place. I think it should go + – buttons, stacked on top of digital wallet, then add to basket underneath that. Removing the quantity button option makes it a little better but still, nothing is stacked in line.

    Product page on site: https://beerginvino.com/product/6-oclock-gin/

    Can you help please if possible?

    Thanks!

    #1763499
    David
    Staff
    Customer Support

    Hi there,

    can you share a link to a product where i can see the issue?

    #1763539
    DAVID

    Thanks for the reply David.

    A random product page is : https://beerginvino.com/product/6-oclock-gin/

    I don’t know why those images won’t show in my original post – I’ve tried editing them but nothing seems to show.

    #1763925
    David
    Staff
    Customer Support

    Try adding this CSS:

    .woocommerce div.product form.cart div.quantity,
    #wc-square-digital-wallet,
    .woocommerce div.product form.cart .button {
        flex: 1 0 100%;
        max-width: unset !important;
        justify-content: flex-start;
    }

    If you’re using an Image sharing service then we just need the links. Sometimes the browser has an issue with those links inside an IMG…. but its not an issue i just opened in another tab 🙂 But i needed the site link so i could see the CSS.

    #1763979
    DAVID

    That worked a treat David. Thanks so much for your help. Really appreciated.

    #1763997
    David
    Staff
    Customer Support
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.