CODEWITHSUNDEEP
wordpressyoutubeoverlayfancybox
ftoure
ftoure

Reputation: 133

How to use fancybox with wordpress without a plugin?

I am trying to use fancybox to display a youtube video within my wordpress site. I am sure of following the tutorial from fancybox.net, but I am not getting any good result. the link still opening the full page of the video in youtube instead of a fancybox overlay.

Any help will be greatly appreciated. nb: I don't wanna use a plugin

Upvotes: 0

Views: 3808

Answers (2)

Matt Ginn
Matt Ginn

Reputation: 294

I have gone through it for you and have put a working example online HERE. Here is the js used 

    $(document).ready(function() {

    $(".video").click(function() {
        $.fancybox({
            'padding'       : 0,
            'autoScale'     : false,
            'transitionIn'  : 'none',
            'transitionOut' : 'none',
            'title'         : this.title,
            'width'         : 640,
            'height'        : 385,
            'href'          : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
            'type'          : 'swf',
            'swf'           : {
            'wmode'             : 'transparent',
            'allowfullscreen'   : 'true'
            }
        });
        return false;
    });
});

Hope this helps you a bit more.

Upvotes: 1

Haso Keric
Haso Keric

Reputation: 271

You have to include the fancybox css and javascripts in the site head simply and then you can apply to any of your blog posts, content the required class or id.

Upvotes: 1

Related Questions