About the Media Tag IP.Board has a function called the Media Tag that lets you post the URL to a page that has some sort of media (video, audio, slideshow, etc.) on it, and then instead of just showing that URL, it will embed that media into the post. The most well known of these is the YouTube Media Tag. By simply posting the URL to a YouTube video, we get the cool YouTube player embedded right into the post (or into this article, as in this example):
IP.Board gives us the ability to add new Media Tags by importing them as XML files, or by creating our own new ones.
Creating new Media Tags
The basic idea behind creating a Media Tag is that you just need some way to take the URL of the page the media is on and convert it to the 'embed' code the various media services provide you with. When you then make a post that matches the pattern of the URL for a given Media Tag, IP.Board swaps that URL out with the embed code, thus putting the player right into the post.
For this example, I'm going to show you how I created the plugin for the PodOmatic Media Tag. First off, check out the settings for a new media tag plugin in the Admin CP, you can find this on the Look & Feel tab -> Manage Media BBcode -> Add Media Tag button:
As you can see, there are only a couple of options that you need: a name for the Media Tag, the URL to match against, and the resulting embed code. To fully create a Media Tag, this is all you need to complete.
To create a specific one, you need to check out a page where this media is being accessed from. In this example, I went out to PodOmatic to see what one of these pages looked like. Right on their home page, they listed a couple featured podcasts, so I clicked on one of those as an example. The URL to that page was as follows:
Now, this particular media service gives you the ability to tweak the embedding properties a bit, but you typically want to just use the default options. There isn't going to be any way for people who post links to this media to be able to take advantage of these options to customize their own embedded media in posts, so it's best to just leave it all as-is. Site owners can, if they choose, hack about with the embed code to change the look of this embedded media on their own site, but doing so would affect everyone's posts on that site.
Anyway, the thing we need to do now is determine how you go from the page URL to the embed code. The way we do that is we look at that page URL and see what things will be constant and which will vary from page to page. This one is interesting in that it has a subdomain in the URL (forcefedfistfuls) which looks like the author/performer of this media. So that's probably going to change for different media, and the whole section at the end (2010-08-31T01_09_29-07_00) is likely to change from page to page. So in our Admin CP, in the box where it asks for the 'Media Replacement Match', we're going to put the page URL, but swap out the items that will change with the replacements {1}, {2}, etc., as needed. That means that for this case, our 'Media Replacement Match' value is going to be this:
http://{1}.podomatic.com/entry/{2}
What this means is that the post parser will look for content in a post that matches a pattern like that, it could have anything in where we have the {1} or {2}, as long as it has something there. If it sees that in a post, it says yes, I recognized that you have posted a media tag, and I need to now swap out that URL with some other code, all the while remembering what items you had in those {1} and {2} positions.
Now we just need to build the embed code properly. We take that full embed code we got from the site and paste it in the 'Media Replacement HTML' section. To make it work, though, we again need to swap out some stuff. Remember that we replaced items in the page URL with some codes, we need to swap those same things in the embed code, just with different codes. In our page URL, we swapped out the subdomain of 'forcefedfistfuls' with {1}, now in the embed code we need to swap out all instances of 'forcefedfistfuls' with $1 instead. You then do the same thing with the other item we swapped, the string of letters and numbers at the end, and change it to $2. That makes our 'Media Replacement HTML' section now look like this:
Save that, and test it by posting a URL from this site on your forum and you should see the embedded media:
'Gotchas' when creating a Media Tag
Not all media services are set up in such a way that you can use them to create a Media Tag. As stated earlier, the only way for a Media Tag to work is if there is a way to convert the page URL to the embed code. If the embed code has unique values in it that you can't get from the URL, then you won't be able to create a Media Tag for that. Say the page URL just has the name of the vide in it, but the embed code has some numerical ID for that video instead, that's an example of where you won't be able to create a Media Tag.
One other common thing you need to watch out for is when there is a & character in the URL. IP.Board, as it does its parsing magic, will convert that & character into the HTML equivalent of &. If you don't account for this when building the Media Tag, your code might be close, but not close enough.
What you need to do to account for this is to set your "Media Replacement Match" code to use this in place of any & characters in the URL:
(&|&)
When you do this, you also may need to renumber your elements you have replaced with {1} {2} codes, this bit of code above will need to be using one of those numbers. In my Photobucket Slideshow Media Tag, you can see an example of this:
The code for the & character is now representing what would be {4} in the URL. Then, when setting up the embed code, just keep these numbers in mind for setting up the $1 $2 characters. There is no need to worry too much about dealing with the & character in the embed code; it can be whatever the site gives you for that character, whether it be & or &. All known Media Tags
Kanał Rss
Kanał Atom