• REGISTRATION REQUIREMENTS:

    Your username here MUST MATCH your XenForo username (connected to your XF license).

    Once you have registered here, then you need to start a conversation at xenforo.com w/Bob and provide the following:
    1. Your XenForo License Validation Token
    2. The Domain Name associated with the License
    NOTE: Your account will be validated once ALL requirements are verified/met. Thank you for your patience.

YouTube or SoundCloud Embed Fields

Hentai

New Member
Showcase
What do you think is the best way of executing a YouTube Video Embed or Soundcloud Playlist Embed field?

The Showcase I am building and forum community around it has a heavy emphasis on music and their related music videos. What do you think is the best way of doing this kind of media embed field without resorting to a full rich-text field?

I would like to be as user friendly as possible so the more idiot proof the better. I know what possibly way is to ask for the Video ID and parse the HTML embed manually, but asking people for the Video ID is a bit complicated.

Is there a way to use ask for a Single-Line Textbox, verify its a URL, then try to parse it through the default [Media = YouTube] handling?
 
Currently, the only option is via BBCODE within the Editors (either the 5 that I use for tabs 1-5 or the custom field "Rich Text Field" content type). I believe there is already a request for a youtube custom field. You MIGHT be able to do it via custom field with a callback (I can't say for sure, cause I've never tried it, but in theory, its possible).

Would you like me to move this to the Suggestions Forum?
 
That is alright.

I was able to get it working using some real hackney Javascript to parse the video URL, grab the ID, then generate an embed code. You can see it in action here.

For anyone interested in adding your own YouTube embed custom field here is the Javascript I used, edit it accordingly to suit your own needs:
Code:
<script type="text/javascript">
function getParameter(url, name) {
    var urlparts = url.split('?');
    if (urlparts.length > 1) {
        var parameters = urlparts[1].split('&');
        for (var i = 0; i < parameters.length; i++) {
            var paramparts = parameters[i].split('=');
            if (paramparts.length > 1 && unescape(paramparts[0]) == name) {
                return unescape(paramparts[1]);
            }
        }
    }
    return null;
}

var vidid;
vidid = (getParameter('{$valueRaw}', 'v'));

var embedsourcecode;
embedsourcecode = "<iframe width=\"560\" height=\"315\" src=\"//www.youtube.com/embed/" + vidid + "\" frameborder=\"0\" allowfullscreen></iframe>";

document.write(embedsourcecode);

</script>

Even better than a custom field option would be that existing suggestion of being able to add Media Embeds as part of the gallery.

My code only works for one sample video, I really liked the other user's idea and went ahead and commented on his feature suggestion.
 
  • Like
Reactions: Bob
Apparently this trick doesn't count towards a YouTube view on their end and some users don't like that.

Isn't there a bb code that'll do it? Or that won't work for custom fields.


I may switch having users to paste the full embed code.
 
Isn't there a bb code that'll do it? Or that won't work for custom fields.
BBCODES are for the Core XenForo Redactor Editor. Rich Text Fields use the Core XenForo Redactor Editor.

Change the field type to RICH TEXT and have them embed the video with the Core XF media handling that is built in for YoutTube videos.
 
BBCODES are for the Core XenForo Redactor Editor. Rich Text Fields use the Core XenForo Redactor Editor.

Change the field type to RICH TEXT and have them embed the video with the Core XF media handling that is built in for YoutTube videos.

Nevermind - the above hack works PERFECTLY fine. After doing test the views came across as they should.

The user was simply thinking that the Showcase item page "views" = YouTube views. Maybe I'll do a phrase to make it page views.
 
Yes - edited the nflj_showcase_views phrase to make it clearer to users:

Screenshot 2016-05-21 at 9.54.05 PM.png Screenshot 2016-05-21 at 9.53.59 PM.png
 
That is alright.

I was able to get it working using some real hackney Javascript to parse the video URL, grab the ID, then generate an embed code. You can see it in action here.

For anyone interested in adding your own YouTube embed custom field here is the Javascript I used, edit it accordingly to suit your own needs:
Code:
<script type="text/javascript">
function getParameter(url, name) {
    var urlparts = url.split('?');
    if (urlparts.length > 1) {
        var parameters = urlparts[1].split('&');
        for (var i = 0; i < parameters.length; i++) {
            var paramparts = parameters[i].split('=');
            if (paramparts.length > 1 && unescape(paramparts[0]) == name) {
                return unescape(paramparts[1]);
            }
        }
    }
    return null;
}

var vidid;
vidid = (getParameter('{$valueRaw}', 'v'));

var embedsourcecode;
embedsourcecode = "<iframe width=\"560\" height=\"315\" src=\"//www.youtube.com/embed/" + vidid + "\" frameborder=\"0\" allowfullscreen></iframe>";

document.write(embedsourcecode);

</script>

Even better than a custom field option would be that existing suggestion of being able to add Media Embeds as part of the gallery.

My code only works for one sample video, I really liked the other user's idea and went ahead and commented on his feature suggestion.

Sorry for necro-posting here. I'm building a forum based around YouTube vlogging/channels. I want to utilize showcase to show off channel and allow members to show off a couple featured videos. I'd like them to embed in the showcase page. Does your custom code still work as of the latest XF and Showcase? Also, where do I add it? :)

EDIT: I figured it out :p
 
Last edited:
Back
Top