Options to set different position on mobile and desktop (floating badge)

On our website I want to use the floating badge, on desktop I can put it in the bottom left and it’d work perfect, on mobile it would cover a sticky bottom menu to call + book online so i wouldn’t want the button to show on mobile, but there’s no option to do so.

2 Likes

Hi there, @user26007 and welcome to the Community :waving_hand:

Thank you so much for the feedback!

I agree that it would be great to have these options as settings in the widget. We’ll try to consider this opportunity in the future, especially if more users upvote it :slightly_smiling_face:

As for now, you can place the badge on mobile higher using this code in the Custom CSS field on the Style tab of your widget’s settings:

@media (max-width: 500px) {
.es-badge-container { 
  margin-bottom: 150px;
}
}

If this code doesn’t work for you, please send me a link to the page, where your widget is installed.


And just in case, here is the code to hide the badge on mobile:

@media (max-width: 500px) {
.es-badge-container { 
display: none;
}
}
1 Like