Trust Badges Shortcode Width Issue

  • Resolved jyt0208

    (@jyt0208)


    2 years, 11 months ago

    I used the Small Light Badge at the Woocommerce footer area. The width of the widget is too wide that stretches the page on mobile. My website has a menu toggle at the top right, since your shortcode stretches the page, I cannot see the menu toggle at the first sight, I’ll have to manually drag the page in order to see it.

    Is there a way to adjust the width of the widget? I tried adding width=”80%” in the shortcode but didn’t work.

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Support cusrev

    (@cusrev)

    Thanks for using our plugin!

    Can you please share URL of the page where I can check this problem?

    Thread Starter jyt0208

    (@jyt0208)

    It’s regisbox.com. And the issue is only on mobile view.
    Thank you!

    Thread Starter jyt0208

    (@jyt0208)

    Problem fixed on our end by adding some CSS. Can you help me remove my website link? Thank you

    Plugin Support cusrev

    (@cusrev)

    Great, thanks for letting me know that it is fixed!

    Unfortunately, I cannot edit any messages on this forum. You will need to reach out to the forum admins from WordPress.

    Hi @cusrev and @jyt0208,

    I’m having this same issue on the mobile version of my website (https://ohsheetz.com). I’m using Astra and I have the shortcode placed in the footer.

    I’ve tried different css modifications to the badge’s div container, but even when I make the trustbadge smaller (which I can do), the container it is in keeps the original width which in turn makes the width of the footer section wider than the screen width.

    When I remove the trustbadge, the width on the webpage is fixed and the footer returns to normal alignments.

    Could you advise on a fix or on appropriate CSS to fix this issue?

    Thank you for your help.

    – Anthony // Oh Sheetz

    • This reply was modified 2 years, 10 months ago by ohsheetz.
    Thread Starter jyt0208

    (@jyt0208)

    Hi @ohsheetz

    Here’s the CSS I used. Hope it works for you too.

    .cr-badge{
    width:100% !important;
    transform: scale(0.640569);
    }

    Thanks @jyt0208, that does help to shrink the badge itself, but somehow the width of the container is still too wide (at least in my use case). I’ve used Google’s inspector tool and tried modifying various css variables affecting the badge and the containers to no avail, as the width of the screen is still significantly wider than the screen content every time. (You can scroll to the right and see blank space, like a lot of it, in mobile view regardless of the size of the badge, although the inspector always shows that the space to the right is contained within the badge’s containers. #frustrating lol)

    I wish I knew more regarding css as I think it must be an issue there or with the flex display, but I am ignorant. Maybe CusRev will be able to identify my error.

    Thanks again, have a good week!

    – Anthony

    We have the same issue on our mobile site. I agree that badge size is correct, but it loads a super wide container that I can’t identify either.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Trust Badges Shortcode Width Issue’ is closed to new replies.