Malphurs Interactive works under the belief that great organizations deserve innovative and inspirational interactive media solutions. After all, invention is 93% perspiration, 6% electricity, 4% evaporation, and 2% butterscotch ripple.

Tutorial for Uploading Cross-Platform Friendly Video to a WordPress Site

August 23, 2011

Recently, we had the chance to come up with a process for our client to embed videos in a custom WordPress site. We were wanting a solution for our client so that they would be able to add video that would be viewable on most devices. Not only that, but also to have the tools to first grab the video off the web and upload to YouTube before posting on the site. Of course we needed to include both a Mac and PC solution. Below are the exact steps we used to assist our client:

1) First, let’s install the “More Fields” plugin on the WordPress site:

http://wordpress.org/extend/plugins/more-fields/

2) Adjust the settings in the “More Fields” plugin to accept the YouTube Video by going to the settings within the WordPress admin and clicking “More Fields” and click the “Add New Input box”:

3) Setup the input box with with a title of “YouTube Link”; select the type of post that you want the field in: Post/Page and  and select the “Video” option; Next click the “Add new Field” button:

(note: Additonally you can install the “More Types” plugin to customize the type of post that the “More Fields” box shows up in. http://wordpress.org/extend/plugins/more-types/)

4) Edit the actions of the field with the following settings:

1. Field Title: “YouTube Link”;
2. Custom Field Key: “youtube_link”:
3. Caption: “YouTube link should be in in this form: http://www.youtube.com/v/CQzUsTFqtW0″;
4. Field Type: “Text”
5. Finally, go to the bottom and click “Save” to save the settings.

5) Next go to your new post and from the screen options drop down menu select the YouTube Link field and the new field will appear below:

More Fields Instructions

Now that we have setup up the plugin on our WordPress site; we are ready to grab our video from the web. This solution had to come for both the PC and Mac environment. I will first start with the suggested software and instructions for the Mac. Click here to skip to the link for the suggested software and steps for the Windows environment.

The following is the instructions for Mac:

Step 1:

Go to the following url and purchase, download and install the grappler application.
http://thelittleappfactory.com/grappler/

Step 2:

Open Grappler. Click in the search field and enter the url for the video that you want.

Grappler Instructions

Step 3:

Click on the video to play…

Grappler Instructions

Step 4:

The video will automatically start downloading and show up in the clip tray below…

Grappler Instructions

Step 5:

Locate the video in your iTunes folder…

Grappler Instructions

The following are the instructions for Windows:

Step 1:

Go to the following url and purchase RipTiger (Media Suite Edition), download and install…

http://www.riptiger.com/editions.html

Step 2:

Within the RipTiger window click the settings option…

Rip Tiger Instructions

Step 3:

In the convert to files dropdown select “WMV video with original dimnesions” and click the “OK” Button…

Rip Tiger Instructions

Step 4:

Open Internet Explorer while RipTiger is running and navigate to the video within Internet Explorer…

Step 5:

Play the video within Internet Explorer…

Step 6:

RipTiger will automatically start downloading the video…

Step 7:

Once the video has downloaded click to select the video that you want in the list and click the convert button…

Rip Tiger Instructions

Step 8:

After the video is converted it will go into a folder titled “Converted”

Finishing the job

Now that you have pulled the video that you are wanting to post on your WordPress site; you are ready to upload the video to your YouTube channel.

The following instructions for properly linking the video:

1) Make sure that after you have uploaded the video to YouTube; you select the option to make the video public. Please see the following for an example of this:

Step 1 of Final Instructions

2) In the WP Admin copy and paste the link from below the field where the link is entered. Please see the following for an example of this:

Step 2 of Final Instructions

Additional Note of Final Instructions

3) Copy the last portion of the link to the YouTube video… Please see the following for an example of this:

Step 3 of Final Instructions

Important Note: Ensure you don’t copy the entire link from the YouTube video and paste it into the field provided. As Shown Below:

Final Instructions

4) In the WP Admin: Paste the portion of the link of the YouTube video at end of the link that you copied from step 2…

example: http://www.youtube.com/v/pastelinkhere

Final Instructions

5) In the WP Admin: Click the update button…

Step 5 of Final Instructions

And there you have it. You now have a method to grab embedded video from a website from either a PC or a Mac environment. With the addition of being able to add it to your WordPress site and is now viewable on numerous mobile and pc platforms…