Whatsapp icon not showing on mobile

  • Hello,

    Recently I tried to change the location of where the whatsapp icon is displayed on the mobile view of my site through custom css within the plugin itself.

    Now I changed some stuff and the Whatsapp icon on mobile view is not visible at all anymore, while on laptop view it is totally visible. How is this possible and how can I fix it?

    This is all I’ve added:

    .joinchat {
    position: fixed; /* Ensures the element is anchored to the screen / bottom: 130px; / Moves it 130px up / right: 16px; / Moves it 16px to the right */
    }

    /* Adjust for tablets (like iPads) / @media (max-width: 1024px) { .joinchat { bottom: 0px; / Move closer to the bottom for tablets / left: 0px; / Move towards the left for tablets / right: auto; / Override the right positioning */
    }
    }

    /* Adjust for mobile phones / @media (max-width: 768px) { .joinchat { bottom: 0px; / Move even closer to the bottom for mobile / left: 0px; / Move towards the left for mobile / right: auto; / Override the right positioning */
    }
    }

    Thank you very much,

    erider123

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Contributor davidlillo

    (@davidlillo)

    Remove the label “right: auto;”
    Check out this documentation that may be of help to you: https://join.chat/en/tricks/css-tricks-for-join-chat/

    Thread Starter erider123

    (@erider123)

    Thank you very much for your response,

    I removed it as you said and it still is not showing on mobile. I tried change the other values of mobile to see if there is overlap with another element, but it’s just the icon not popping up.

    Looking forward to your reply,

    Have a nice day

    Plugin Contributor davidlillo

    (@davidlillo)

    The button appears in mobile, the problem is that you have another plugin that overlaps.

    Thread Starter erider123

    (@erider123)

    Thank you very much, is there also a way to adjust the size of the icon. I tried the css height and width terms but that didn’t work and couldn’t find anything in the settings about size.

    Many Thanks!

    Plugin Contributor davidlillo

    (@davidlillo)

    ?? Resize the float button

    .joinchat { --s: 50px;}

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.