Edit Z-Index of Trustpilot widget in relation to menu on mobile

[FFP]

Hello,

I am currently running into the issue of our Trustpilot widget indexing above our menu on mobile. What might need to be changed in the which liquid file to resolve this? The website currently facing this issue is: http://uk.starwoodsports.com

Thanks! 

[Guleria]

Hello,

Add this css in theme.css.liquid or related css file a/to theme you are using.

nav.panel-menu.mobile-main-menu.mmitemopen {
    z-index: 9999;
}

Thanks 

[FFP]

Hi @Guleria 

Thanks for the feedback! Where in the theme.css.liquid file would this need to be placed or is it an item that be included at any part of the file?

[indextwo]

Late answer, but for anyone else looking for a fix to this: you don't need to adjust your own theme's CSS (there may be more than just the navigation that the TrustPilot widget overlaps):

For some reason TrustPilot's widget has a default z-index of 1000. All you need to do is go into the TrustPilot app, click to manage Widgets, and select the widget you're having an issue with. On the left-hand side will be a list of various options, and one of those will have a title like 'Widget stacking order' and a default value of 1000. Change this to 0 (which is the default value for z-index) and it should now appear just fine.

[Tom__Lane]

This does not work for me either. Do you have any other suggestions?

[indextwo]

I think you'd need to inspect the TrustPilot widget in your browser and see where that `z-index` is being set, as _something_ will be placing it above your other content. It's possible it's in the theme; it's possible TrustPilot might be caching the CSS that's set for your widget. But figuring out where the widget's z-index is coming from will be key to solving it.

[Tom__Lane]

Sorry I've just read this again and I misunderstood the first time round. I think I have the opposite problem. The widget is showing fine on a computer screen but then on a phone screen it doesn't show up at all. I'm using the Dawn version 12 theme, have you heard of this happening before?

[indextwo]

It sounds like there's a rule somewhere that's hiding the TrustPilot widget on screens below a certain size. I haven't used Dawn, so I don't know if it's out of the box or you just use a Custom Liquid / HTML blow to insert it. But inspecting it (best to do it on a desktop with your browser in mobile mode) should show you what's happening.

If it's still something that's only happening on your phone and it appears fine on desktop browser in mobile mode, it's possible it's being blocked by something else (ad blocker in the browser, maybe?)

Check the inspector panel in your browser first and see if there's a rule that's hiding it.

[Tom__Lane]

Ok thanks for that info, I'll have a look into it