Register Arama Bugünkü Mesajlar Tüm Forumu Okundu Say

Reply
 
Thread Tools
How to create definitions for AME 2.5
vB.Org Poster
vB.Org Poster has disabled reputation
Kayıt Tarihi: Jul 2018
Mesajlar: 298

Show Printable Version Email this Page
Makale: vBulletin 3 Makaleleri, yazan vB.Org Poster 10 Jul 2018, 18:30

If you use the Automatic Media Embedder mod for vBulletin 3.8 and you want to learn how to make your own definitions this is a lesson.

AME 2.5 Mod: Major Additions - AME 2.5 - Media Embedding for posts, sigs, vm's, groups and blogs - vBulletin.org Forum
Digital Jedi's Definitions: Add-On Releases - DJ's AMEs :: Media Definitions for AME 2.5 :: More Video, Twitter, Pinterest... - vBulletin.org Forum

You will need some knowledge of "regular expressions" to do this. I suggest reading over the introduction and some of the pages on this site: Regular Expression Tutorial - Learn How to Use Regular Expressions.

The more you know the easier it will be of course.

Also I strongly strongly urge you to download RegexBuddy. There is a free trial but you will need to buy it if you continue to use it.

This lesson will assume you have RegexBuddy.

We will create a custom video definition, it will introduce you to the basics on which you can build.

One of the simplest video sites out there is TwitVid.

A sample TwitVid URL is: http://www.twitvid.com/38UOE however http://twitvid.com/38UOE is also a valid link.

The "38UOE" is the unique ID of each video.

Before we start making a definition we need to make sure the site allowed their media to be embedded, not all do. Make sure they give you the option to have embed code on the video, which TwitVid does.

Step 1: Copy and paste the URL of the video into the two main boxes of RegexBuddy. You should also make sure the "case insensitive" button is pressed because AME is not case sensitive.



The top box is going to be the actual regular expression, we will edit it. The lower box will remain the original URL. The goal will be to have the URL in the bottom box completely highlighted in yellow by the time we are done.

"But it's already yellow." That is true, but as is it would only work for this 1 video. We need to edit it so it works for all TwitVid videos.

The next step is we must "escape" all special characters in the regular expression (top box.) RegexBuddy will highlight special characters in light blue, and as you can see periods (.) are special characters in regular expressions. So are question marks (?). There are more but these are the most common.

To "escape" a special character you simply put a backslash (\) in front of it. Go ahead and escape all the special characters in the top box:



As you can see all the blue highlighting has been removed now that all special characters are escaped.

Now comes the "hard" part. We need to do something with that unique id. (38UOE). When we come to an ID theres really only one decision to make.

\d - This will match any digit, 0 to 9
\w - This will match any "word" character which for regex can be any letter or number or underscore character.

Since TwitVid uses both letters AND numbers in their IDs we must use \w.

We now need to "build" on \w... Ultimately we will end up with: ([\w]+)

Let me explain the why...

First the parentheses ( and ). These tell the program you want to use the data matched inside them later in the program. In our case this means we want to use the data inside them in our embed code. You can have multiple sets of parentheses in a regular expression. You can access them in the embed code as $p1, $p2, $p3... etc... $p1 being the left most set of parentheses and incrementing from left to right.

The square brackets [ and ]. Inside of these you put all the possible characters you need to match. Remember \w is a short-cut to say "match ANY letter or ANY number or an underscore. In TwitVid's case this is all you need. However if another site maybe had dashes (-) in their ID you would need to add that here. ([\w-]+) for example. If it had dashes and number signs and ampersands we'd use ([\w-#&]+).

But back tot he case at hand, for TwitVid it's just ([\w]+).

Last but least is the plus sign (+). The plus sign tells us that we can match 1 OR MORE of the characters specified in the square brackets. In our case that means it can match 1 or more letters OR numbers (or underscores.)

To better illustrate the + sign edit the regex in RegexBuddy. Replace 38UOE with ([\w]).



You'll see only the "3" is highlighted in the bottom box. This is because without the plus sign our regex will only match the 1st character in our ID. Go ahead and put that + back in now: ([\w]+).



Now you will see the whole line is highlighted. Remember the + means to match 1 OR MORE characters in the square brackets. If you used an asterisks (*) instead that would mean ZERO OR MORE of the characters in the square brackets.

Well it looks like we're done, right? At least with the regex, right?

Sorry... not yet. Remember there is a second URL possibility for TwitVid, the one without the "www" in the URL: http://twitvid.com/38UOE

Go paste that URL in the bottom box of regex buddy above or below the current URL:



As you can see none of that second URL is highlighted. How can we get 1 regex to match both URLs? The answer here lies in the * I just told you about. We can put the "www" inside square brackets and follow it by an * and that will tell the regex it can match either with or without the www. Actually we need to put the period after www in the brackets as well, and that period is escaped so all in all we need to put www\. into brackets.

Replace www\. with [www\.]*



Now you can see both URLs are highlighted. (RegexBuddy alternates highlight colors.)

So now we are finally done with the "hard part" of this exercise- but we're not done. Now we have to put this info into the AME Settings and edit the embed code.

In your Admin CP go to AME CP and then "Add a New Definition."



Title and Description are up to you but I'd suggest something like: TwitVid and "TwitVid Video."

The Unique Key is again up to you- just make sure you don't use one already in use on your forum. I'd go simple again like: twitvid.

Display Order: Totally up to you

Active: Yes

Contain: Yes

Regular Expression: Here we copy the regex from the top box of RegexBuddy.

Replacement: For now paste in the Embed code provided by TwitVid for this video:

Kod Blok Kilitli:      (Kayıt veya giriş yapmalısın)  
Engellenmiş, kayıtlı olmayan veya onay bekleyen kişiler kodlara erişemezler.

We must edit the above code since it is only for the video in the example. We need to look for the ID of the video and replace it with $p1 which is the first (and only) parameter we created by using parentheses in our regular expression.

Turn the above code into:


Kod Blok Kilitli:      (Kayıt veya giriş yapmalısın)  
Engellenmiş, kayıtlı olmayan veya onay bekleyen kişiler kodlara erişemezler.

There's a couple more changes we can make at this point. Instead of using the default height and width supplied by TwitVid we can replace them with height and width settings we made in the AME settings. Not all sites will allow you to do custom sizes but it doesn't hurt to try. You will need to change the specified width of 480 to $ameinfo[width] and the height of 360 to $ameinfo[height]. The final replacement code should then be:


Kod Blok Kilitli:      (Kayıt veya giriş yapmalısın)  
Engellenmiş, kayıtlı olmayan veya onay bekleyen kişiler kodlara erişemezler.

Now paste the above code into the Replacement box of the AME Definition.

The Extraction Information options can remain blank, those are only needed for advanced definitions which are rarely needed.



Now hit SAVE and you should have made your first working custom AME definition!

Let's check it out in action: Link to Embedded Video

Views: 36
Reply With Quote
Reply

Thread Tools

Şunları Yapabilirsin
Yeni Konu Açmak
Konuya Cevap Yazmak
Eklenti Eklemek
Düzenleme Yapabilmek

Forum Atla


LD'de Yeni misin? Yardıma mı ihtiyacın var?

All times are GMT +3. The time now is 06:55.

Tasarım Özelliği | Genişlik: Geniş Renk: How to create definitions for AME 2.5 How to create definitions for AME 2.5 How to create definitions for AME 2.5 How to create definitions for AME 2.5 How to create definitions for AME 2.5