Need some help with possible theme incompatibility

Hi,

This floating bar is not due to our plugin. Please check.

Not the floating bar but the social sharing icons on the floating bar ??

I did some CSS hacks to make it look like that

Please see:

View post on imgur.com

On the front page the floating social sharing buttons don’t seem to display properly and you can’t even click on them, and it looks like some kind of bootstrap incompatibility.

It seems due to the fact that floating bar appearing at front page is rendered in excerpt displayed in the image slider.
You can try enabling Super Socializer - Sharing (Vertical) widget from Appearance > Widgets page in any of the widget area of homepage. You have to disable all the page groups in Sharing Location option in Sharing Options section at Super Socializer > Social Sharing page, to avoid double interface.

Wow thanks that works!

Unfortunately there seems to still be some issues with the mobile site version. Could you have a look?

We are still seeing the same issue at front page.

Hi, I’ve tested it on a number of browsers and using incognito mode, front page on desktop looks fine now?

The issue seems to be that now on the mobile site, the floating share bar that’s supposed to be at the bottom does not appear at all

This is because of the margin-right:-765px you have applied.
You need to specify right margin of sharing div for mobile devices. Something like following:

@media screen and (max-width: 783px){
.the_champ_bottom_sharing{
    margin-right:0px !important
}
}

Ah yes! Thanks so much. You’re right I missed that @media element setting for the widget on the main page. That’s why it was showing on the other pages but not the main page.

One last question, I hope you could help me with this CSS hack that I have not been able to figure out.

I am trying to stretch the floating mobile sharing bar (i.e. mobile site only), to fill up the whole width of the screen. I’m having a bit of trouble figuring out the proper CSS modifications. I hope you could help me with this! Thank you for your time ??

Please see this image for what I’m referring to: https://i.imgur.com/JpzBLwk.png

To make the required adjustment as you have indicated in screenshots, use following CSS (previous CSS we posted above is also included):

@media screen and (max-width: 783px){
.the_champ_bottom_sharing{
    margin-right: 0px !important;
    width: 100% !important
}
.the_champ_bottom_sharing .the_champ_sharing_ul li{
    width: 16.66% !important;
}
}

Brilliant! Thank you very much – fantastic support ??

You’re welcome ??