[Solved] Centering Image/Video Embeds  


Sean
Posts: 2
 Sean
Customer
(@seanb793)
Member
Joined: 3 years ago

Hi,

Thanks for the WpForo plugins and its wonderful add-on's as well! 

My question pertains to wpForo Embeds in particular; users are mentioning that they can't seem to centre the image/video embeds on their posts. Please see the last post on this thread from our website -  https://highereg.com/forums/sam-oz/sam-ozs-main-portfolio-thread/#post-70

As you can see, the video playlist is aligned to the left. Here's the source code of the post -- 

<p>Hello everyone,</p><p>I would like to show you a personal project, a tribute to Ghibli's studio.</p><p>You can follow the thread here : <a title="Tribute to Ghibli" href="https://highereg.com/forums/sam-oz/personal-project-tribute-to-ghibli/" target="true"> https://highereg.com/forums/sam-oz/personal-project-tribute-to-ghibli/</a></p><p>I explain a few things about each track.</p><p> </p><p><a title="Tribute to Ghibli" href="https://youtu.be/M7Y6M8poNF0?list=PLtXeYdQkBIfpr75mP2cXxPmWsB_ze_p1u" target="true">

 

As you can see, using the 'Align Centre' option from the text editor doesn't work -- nor does using HTML tages <center> within the source code. How may we solve this?

 

Thanks!

4 Replies
Tom
Posts: 2927
 Tom
Admin
(@tomson)
Support Team
Joined: 4 years ago

This kind of embedded objects are not a simple text to align. They are not align-able. You should use extra wrapper divs like explained it here (use {;} source button to inset extra divs, don't insert it in visual editor mode):

How to Center a Video in WordPress

2 Replies
maltrain
Customer
(@maltrain)
Joined: 3 months ago

Member
Posts: 8
Posted by: Tom

This kind of embedded objects are not a simple text to align. They are not align-able. You should use extra wrapper divs like explained it here (use {;} source button to inset extra divs, don't insert it in visual editor mode):

How to Center a Video in WordPress

That's a case by case solution... is any way of making the process automatic on every post?

Astghik
Admin
(@astghik)
Joined: 2 years ago

Support Team
Posts: 2894

Hi @maltrain,

Please try the following CSS code, add it in Dashboard > Forums > Settings > Styles > "Custom CSS code" textarea, save it, delete all caches and check again (press CTRL+F5 on frontend). Please open a new support topic and leave some URL to allow us to check it if the CSS code I've provided doesn't help:

#wpforo-wrap .wpforo-post-content .wpf-video {
text-align: center;
margin: 0 auto !important;
}
Sean
Posts: 2
 Sean
Customer
(@seanb793)
Member
Joined: 3 years ago

Thanks! That works for all standard YT links and images. However, I've found that wrapping entire YT PLAYLIST links with the <div> tags do not seem to work. They remain left-aligned regardless.

Share: