Fancy-up your videos on your blog/website by applying an image frame.

Use Photoshop or PaintShop Pro and create a 300(w) x 230(h) rectangle and design it to taste. Next save the image as videoframe.png and upload it to your "images" directory.

Add the following code to your custom.css file:

1
2
3
4
5
6
7
8
9

/* Video Frame */
.vidframe {
display: block;
width:300;
height: 230px;
text-align: center;
background: url(images/videoframe.png) no-repeat;
padding: 32px 0 0 0;
}

Next use the following "wrap" script in your page, post or sidebar widget:

1

<span class="vidframe">all your video embed codes here</span>

Make sure you change your video's dimensions to 250(w) x 175(h) in the embed code.

Below is an example of the finished product:

 
Go to http://www.happyhomemakercindy.com for a live demo. (right sidebar halfway down)