Fix All-in-one-reviews button placement on mobile

This is a very poor update.

I don’t know when this was updated but the display of the reviews widget is now only in the bottom middle on mobile.

However, that doesn’t work well with a “Call now” button or “All-in-one-chat” button either as they overlay each other now.

We had made the placement of the 2 buttons be one on the bottom left and the other - on the bottom right.

Now that is not possible and we have to hide the reviews widget on mobile, because it messes with the view.

How can this be fixed?

Our websites are https://enterevent.bg and https://vratadovrata.com

They look like a mess now on mobile.

2 Likes

I made a workaround on one of the websites by moving the call button higher but it’s not ideal.

I’d like to have the old option of displaying a smaller reviews widget with the rating and to be able to properly place it accross the page, not just on desktop, but on mobile.

Also, I cannot even move the button on mobile right now. I tested the exact same css that moves the “Call” widget, but it doesn’t work on the reviews one.

I tried the CSS that you’ve specifically provided for moving the badge as well, and it also doesn’t work. This is the css:

.es-badge-container * {
align-items: flex-start;
}

That I got from this page: Align badge element to left - CSS Codes / Reviews - Elfsight Community

2 Likes

Hi there, @Yavor_Yanakiev :waving_hand:

Recently, we’ve introduced new badge layouts many users asked for, and I am genuinely sorry it didn’t work for your use case!

While there is no option to adjust the badge position on mobile devices, you can do this 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;
  margin-right: 100px;
}
}

Also, we have a Wishlist request to add this option to the settings and you can upvote it here - Options to set different position on mobile and desktop (floating badge)

You’ve also mentioned that you’d like to make a badge smaller. Would you like to remove some badge elements, or you’d prefer keeping the existing elements, but make them smaller? Would you like to apply this change on mobile only?

We’ll be happy to customize the widget to your liking :slightly_smiling_face:

1 Like