-
Hi. I just updated my player to the most recent version. Now there is a thick white border around my videos in Lightbox mode, and it looks terrible. It ruins the viewing experience because it looks ridiculous, and is distracts, visually. I know you didn’t design the border, and that it’s common with WP Lightboxes but it was not there in the previous version. So whatever changed to make that border appear, I really need to get rid of it. My users love that lightbox, I don’t want to ruin the experience for them. This is a very big issue for me. Thank you.
-
-
Hi guys. Still waiting to hear back regarding removal of that white border/box around the lightbox popup windows for my videos. Thanks
Hi Tim,
Your CSS designer should be able to remove that border by modifying your styles.css file.
Please provide a URL with the issue visible and we’ll take a look though.
Making the web work for you, Alec
But this border only started showing up when I updated the player. It wasn’t there before. So I uploaded the “older” player (the one I was using before the update) and the border is gone again. So it has something to do with the CSS in your latest public release player. If you tell me what lines to modify, I can do that myself, no problem. I know how to edit CSS but I’m not a CSS designer/coder, so I just need guidance on what lines to modify. Thanks Alec!
Tim
Hi Tim,
although I can reproduce a white frame around a videos, it would really help to make my answer more accurate if you’d provide a URL.
It’s not a regular border, that could be just switched off, but with help of this code you can hide the white box and leave just the video visible.
#cboxMiddleLeft, #cboxMiddleRight, #cboxTopLeft, #cboxTopRight, #cboxBottomLeft, #cboxBottomRight { width: 0; }
#cboxTopCenter, #cboxTopLeft, #cboxTopRight { height: 0; }
#cboxBottomLeft, #cboxBottomRight, #cboxBottomCenter { height: 0; }
#cboxContent { background: transparent none repeat scroll 0 0; }
.flowplayer.lightbox-starter .fp-ui { background: transparent none repeat scroll 0 0; }
.flowplayer.lightbox-starter { background-color: transparent !important; }
#colorbox, #cboxOverlay, #cboxWrapper {overlay: hidden;}
If the code doesn’t work, you might have to add !important declatarions to all of the above instances.
thanks
Hi Viktor. Sorry, I forgot that Alec wanted a URL. But I also need more specificity from you if you wouldn’t mind….where do you want me to insert this CSS code you just sent me? Which CSS file should I insert it to, and where?
Here is a URL for you. It’s all I can provide, because most of our Lightboxed videos are for subscribers, but this page has a light boxed video that’s public.
http://www.vericast.net/shows/vericast-catholic-podcast/ look in the right sidebar. You’ll see a model that says “CLIP”, and a thumbnail. That’s the video lightbox.
Tim
Disregard the message below (I’m just leaving it in for records). I am using MaxCDN and a caching plugin on my site. I just purged the CDN of the site’s files an reloaded. The white box has returned. This time at least the background is dark again. So we’re back to the original problem. A white box/border around the light boxed videos. Just to be clear, this was not there in the last version I was using, so it has to do with a change you made from the last version, to this new version. I don’t know if that helps point you in the right direction or not. If you want me to insert that CSS somewhere anyway, just tell me which file, and where to paste it. Thanks.Actually here’s a new problem.
====BELOW IS THE ORIGINAL ‘UPDATE’ I SENT A FEW MINUTES AGO=====
I updated the plugins (player, and pro pack) ahead of modifying any CSS. and now the white borer is gone, but NOW there is no black background. It’s a video box playing over my site’s background. How do I make that background black again? Also, there is a “Close” button. That needs to go away too. Why is there so much change with this new version? It’s really annoying.
Tim
Hi Tim,
thanks for the link, but after your last message I still can see the white box around your video. Tried on various browsers and it’s the same everywhere. If you have some kind of a caching plugin installed, please try to clear it’s cache manually and let me know so I can recheck.
The code I gave you has to go into your theme stylesheet (/wp-content/themes/Newspaper/style.css).
thanks
vk
I made a simple page with a lightbox, and a screen capture of what I’m seeing (I’m putting it up now). here’s the link. http://www.vericast.net/player-test/ It’s the white box/border around the video, with a “close” button in the lower right corner. It wasn’t there until I updated to the latest public release.
Also my theme style sheet is enormous. Where within the style sheet should I place that code? Thank you Viktor
Tim
Hi Tim,
I’d suggest you place this code just at the end your your stylesheet file
#fv_player_pro_boxMiddleLeft, #fv_player_pro_boxMiddleRight, #fv_player_pro_boxTopLeft, #fv_player_pro_boxTopRight, #fv_player_pro_boxBottomLeft, #fv_player_pro_boxBottomRight { width: 0 !important; }
#fv_player_pro_boxTopCenter, #fv_player_pro_boxTopLeft, #fv_player_pro_boxTopRight { height: 0 !important; }
#fv_player_pro_boxBottomLeft, #fv_player_pro_boxBottomRight, #fv_player_pro_boxBottomCenter { height: 0 !important; }
#fv_player_pro_boxContent { background: transparent !important; }
.flowplayer.lightbox-starter .fp-ui { background: transparent !important; }
.flowplayer.lightbox-starter { background-color: transparent !important; }
#fv_player_pro_colorbox, #fv_player_pro_boxOverlay, #fv_player_pro_boxWrapper, #fv_player_pro_boxContent {overflow: hidden !important; }
Sorry for the inconvenience, but we had to change the lightbox naming classes to exclude future problems. I’ve tested the above code on your test page and it removed the border together with the close button.
Please let me know, once you update your stylesheet and cleared the cache so I can check back.
thanks
vk
Ah ha, PERFECT! THANK YOU so much for your help and your patience. This was a really big deal for me. I’m so grateful to you. Have a wonderful day!!
Tim
Glad I could help. Have a nice day too!
I just added the code to the end of my stylesheet and it didn’t have any effect on the lightbox styling. My situation is similar: the stark and ugly thick white border is unacceptable. Please help, thanks.
Hi Paul,
Our player has changed a bit since this thread was active. Could you please send us a link to your page with a video in Lightbox, so we could check it?
Thanks,
Eduard
