Home › Forums › WoodMart support forum › COMPARE button not showing in product archives on mobile and tabs

COMPARE button not showing in product archives on mobile and tabs

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • August 20, 2024 at 12:52 am #591100

    Apon Ahamed
    Participant

    Compare button in product archives (like example-shop page , home page , category pages and all others pages) are not showing on mobile devices and tabs . I desperately need this option for mobile devices and tabs.
    (Note : computer version show wishlist botton and compare button together nicely )

    Please provide me needed custom css/jss to resolve this issue.

    I add a picture that’s how it should be displayed on every product archives for every mobile and tab’s devices.
    Should be styled.

    Hope I will get professional custom css/jss according to my needs.

    Attachments:
    You must be logged in to view attached files.
    August 20, 2024 at 11:59 am #591240

    Luke Nielsen
    Keymaster

    Hello,

    Add the code below into the “Mobile CSS” are “Tablet CSS” areas to enable the Compare button:

    body .wd-product .wd-compare-btn {
    display: block;
}

    https://take.ms/k1XRs

    Kind Regards

    August 20, 2024 at 8:13 pm #591364

    Apon Ahamed
    Participant

    Thanks for the custom css. Compare button now showing on right top side but it share background with wish-list button .

    I NEED TO FIX THE BACKGROUND COLOUR WITH BLUR EFFECTS. Please give me additional css for compare and wishlist background for all products archive and grid in all page .

    My main requirement-
    1. WISHLIST AND COMPARE BUTTON BACKGROUND SHOULD BE BLUR EFFECT

    2. WISHLIST BUTTON SHOULD POSITION ON TOP AND THAN COMPARE BOTTON SHOULD be placed Under the wishlist icon.

    3. It should be applied on all o product archives and product grids in full of the site .

    Attachments:
    You must be logged in to view attached files.
    August 21, 2024 at 10:31 am #591460

    Luke Nielsen
    Keymaster

    Hello,

    It shares the background on the desktop too – https://take.ms/HiYso

    1. Blur for bg of buttons – https://take.ms/bzad9

    body .wd-product .wd-buttons {
        background-color: rgba(255, 255, 255, 0.62);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
}

    2. The below custom reorders the buttons:

    body .wd-product .wd-compare-btn {
    order: 2;
}

body .wd-product .wd-wishlist-btn {
    order: 1;
}

    Kind Regards

    August 21, 2024 at 7:55 pm #591618

    Apon Ahamed
    Participant

    Thanks now it’s perfect ✅

    August 22, 2024 at 10:27 am #591685

    Luke Nielsen
    Keymaster

    Hello,

    You are welcome. Always remember that you can reach out to us with any questions you may have.

    We wish you a splendid day!

    Kind Regards

  • Author
    Posts

Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘COMPARE button not showing in product archives on mobile and tabs’ is closed to new replies.