hi @jcpacelli,
Ca you please give a link to the page?
If you checked “enable control buttons” in feed settings and they are clickable but not visible, maybe they are transparent or have the same color as their background has.
Please check the values of “Control Buttons Container Opacity” and “Control Buttons Opacity” in plugin themes (Pro version)-> customize lightbox -> control buttons.
yes, the link is here: http://www.communityfirstmc.com/carology/
i’ve checked their colors and tried changing them. they should be white over a red background. I’ve got the Container Opacity at 80% and the Button Opacity at 100%
Seems that the only link that is working (but still not visible) is the Open in IG link. The mouse doesn’t find the controls, info, fullscreen, etc. buttons
Yeah, they aren’t working for some reason. But I decided to go a different route. I’m just linking straight to IG from a click instead of dealing with the lightbox. I had a hell of a time making the info box actually responsive. I’m showing 4 lines of the caption and on mouseover, the full caption is displayed. Here’s my code I’m using for the concatenation of the ellipsis as well. I found this is the best solution.
#wdi_feed_0 .wdi_photo_title{
overflow:hidden;
position:relative;
line-height:1.5em;
max-height:6em;
text-align:justify;
margin-right:-1em!important;
padding-right:1em;
}
#wdi_feed_0:hover .wdi_photo_title:hover{max-height:100%;}
#wdi_feed_0:hover .wdi_photo_title:hover:before{content:'';}
#wdi_feed_0 .wdi_photo_title:before{
content:'…';
position:absolute;
right:.4em;
bottom:0;
}
#wdi_feed_0 .wdi_photo_title:after{
content:'';
position:absolute;
right:0;
width:1em;
height:1em;
margin-top:.2em;
}
.wdi_layout_ms .wdi_photo_title{
margin-left:3%!important;
}
.wdi_layout_ms:hover .wdi_photo_title:hover{
margin-left:5%!important;
}
-
This reply was modified 9 years, 1 month ago by
jcpacelli.
hi @jcpacelli,
there is a conflict with other plugin/theme which loads old version (3.2.1, 2013 year) of font awesome.
This part of the code
<link rel="stylesheet" id="font-awesome-css" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css?ver=3.2.1" type="text/css" media="all">
It prevents our plugin from loading the newer (4.6.3, 2016) version. That old version does not have the icons displayed in lightbox, as well as those appearing when user hovers on thumbs.
Just open web inspector and change the 3.2.1 to 4.6.3 in the code mentionend above to see how it works.
To fix the issue you need to find if the theme or some plugins loads font awesome and disable it from there. In that case instagram’s newer version will be loaded automatically.
Hi, sorry for resurrecting an old thread, but I’m running into the same issue with the fontawesome icons not displaying on a different feed. Can you elaborate with how i go about displaying the proper fontawesome version?
Thanks
Hello, @jcpacelli!
Could you please post the link to the page where you have published this feed? We will check Font Awesome version on this site and suggest a solution.
Also, could you specify, if this happens on the same website and on a different Instagram feed, or on a new website?
Thank you! Have a great day!
Sure, it’s http://www.therevrepublic.com/partners/bourbon-st-wraps/ and it is a different Instagram feed but the same website.
Thank you, @jcpacelli!
Please note, that the following line loads Font Awesome 3.2.1, which is an old version of it.
<link rel="stylesheet" id="font-awesome-css" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css?ver=3.2.1" type="text/css" media="all">
The latest stable version is 4.7.0 (http://fontawesome.io/), could you please locate the plugin/theme file which adds this, and change the Font Awesome version to 4.7.0?
This will resolve the problem.
Cheers!
