Here lately, I am seeing a lot of bloggers publishing videos on their blogs. Whether they are self-created or relevant ones from YouTube, videos are always great to relay your insights effectively and instantly grab your audience’s attention.
One thing that I notice is that many do not usually align the videos in the center. I don’t really know the reasons why they leave it as it is. The reasons could be because they don’t know how to center align the videos or because they think the default alignment is good enough. Now, I am not trying to be a perfectionist here but the center aligning of a video looks much better and professional than the default alignment (i.e. left alignment). Scroll down to check out the center aligned video below…What do y’all think?
Normally you can easily align images that are uploaded in the Media Library, as WordPress has a built-in feature that asks you whether you want the image in the left, center or right before posting it. However, if the image is not uploaded in the Media Library and the image source is from a different site, you need to use Div align attribute.
So what you basically do is just wrap the source codes for your image with the div align tag as shown below. (Note that you have to be in the HTML tab in WordPress not the Visual tab when dealing with codes.) This code is to align images to the center of your post. You replace center with left or right depending on where you want to align the image.
<div align=”center”>The Image/YouTube video Source code</div>
Similarly if you want to align the embedded YouTube video in your blog, you use the same div align tag as you would for the image.
For instance, this is the code from the YouTube video I created earlier today which is aligned to the center of this blog post further down below:
<div align=”center”><object width=”425″ height=”349″><param name=”movie” value=”http://www.youtube.com/v/K5sse1Mp4es?fs=1&hl=en_US&rel=0″ /><param name=”allowFullScreen” value=”true” /><param name=”allowscriptaccess” value=”always” /><embed type=”application/x-shockwave-flash” width=”425″ height=”349″ src=”http://www.youtube.com/v/K5sse1Mp4es?fs=1&hl=en_US&rel=0″ allowscriptaccess=”always” allowfullscreen=”true”></embed></object></div>
The bold sections are the div align codes and the rest, non-bold codes, are the video source codes. And replace the word center with left or right wherever you want the video.
This piece of HTML tag is pretty handy to make your site look a little more professional.
Still confused about it? Here is the video that I was talking about earlier:
Please feel free to comment down below and share your insights. Plus, if you like this article Tweet it, share it in Facebook or your favorite social media outlets.
Here’s to your successful blogging endeavor!
Before you go...