Hi! Some problems with mobile view.
- YouTube: Missing section of the thumbnail on the right side
- SoundCloud: Out of box on right site
- Instagram: Out of box on right site
Forums: https://spieleoase.net/community/sonstiges/neue-embed-plugin/
Thanks. Best regards, Tim
Hi @timheidinger,
Use this CSS code to fix these issues. Put this code in Dashboard > Forums > Settings > Styles Tab > Custom CSS Code textarea. Save it, delete all caches, navigate on forum front-end and press Ctrl+F5 to reset browser cache:
#wpforo-wrap .wpforo-post-content iframe{
width: 100%!important;
}
#wpforo-wrap .wpforo-post-content .wpf-video{
width: 100%!important; height: auto!important;
}
#wpforo-wrap .wpforo-post-content .wpf-video iframe{
width: 100%!important; height: 30vw!important;
}
Hi! The tweet area is now fully responsive. However I still have some trouble with YouTube embeds. The video box is not fully responsive.
Desktop window (everything looks fine):
Smaller (looks not good)
Very small (only twitter looks still nice)
Used CSS:
/* Embed Plugin */
#wpforo-wrap .wpforo-post-content iframe{
width: 87%!important;
}
#wpforo-wrap .wpforo-post-content .wpf-video{
width: 87%!important;
height: auto!important;
}
#wpforo-wrap .wpforo-post-content .wpf-video iframe{
width: 87%!important;
height: 20vw!important;
}
#wpforo-wrap .wpforo-post-content iframe.instagram-media {
width: 87% !important;
max-width: 87% !important;
min-width: 87% !important;
}
Forums: https://spieleoase.net/community/sonstiges/neue-embed-plugin/
Best regards, Tim
Hi @timheidinger,
Sorry for the delay. Please use this code. It should solve the issue:
@media screen and (max-width: 800px) {
#wpforo-wrap .wpforo-post-content .wpf-video > iframe {
height: auto !important;
width: 100% !important;
}
}
I think the embeds are not centered.
My current CSS:
/* Embed Plugin */
#wpforo-wrap .wpforo-post-content iframe{
width: 87%!important;
}
#wpforo-wrap .wpforo-post-content .wpf-video{
width: 87%!important;
height: auto!important;
}
#wpforo-wrap .wpforo-post-content .wpf-video iframe{
width: 87%!important;
/*height: 20vw!important;*/
height: 28em!important;
}
#wpforo-wrap .wpforo-post-content iframe.instagram-media {
width: 87% !important;
max-width: 87% !important;
min-width: 87% !important;
}
@media screen and (max-width: 800px) {
#wpforo-wrap .wpforo-post-content .wpf-video > iframe {
height: auto !important;
width: 100% !important;
}
}