PrettyPhoto 3.1.2

[prettyphoto]

The prettyPhoto website… Please go here for more information and donate if you like it

We need to place all the files needed in the header.php of the theme we use. If we’re using many jquery then we should make no-conflict jquery for this plugin also. Notice ‘/prettyphoto’ is ‘prettyphoto’ folder in the root of the theme folder.

<!-prettyphoto–>
<link rel=”stylesheet” type=”text/css” media=”all” href=”<?php bloginfo(‘template_url’); ?>/prettyphoto/css/prettyPhoto.css” />
<script src=”<?php bloginfo(‘template_url’); ?>/prettyphoto/js/jquery.prettyPhoto.js” type=”text/javascript”></script>
<script type=”text/javascript”>
var $jP=jQuery.noConflict();
$jP(document).ready(function(){
});
</script>
<script src=”<?php bloginfo(‘template_url’); ?>/prettyphoto/facebook.js” type=”text/javascript”></script>
<!-end prettyphoto–>

This is the facebook.js with jquery no conflict implemented.

$jP(document).ready(function(){

$jP(“a[rel^=’prettyPhoto’]”).prettyPhoto({theme:’facebook’,slideshow:5000, autoplay_slideshow:false});
});

To assign file types for different players, we need to create players and modify the “jquery.prettyPhoto.js”

function _getFileType(itemSrc){if(itemSrc.match(/youtube.com/watch/i)){return’youtube’;}else if(itemSrc.match(/vimeo.com/i)){return’vimeo’;}else if(itemSrc.match(/b.mp4b/i)){return’jw’;}else if(itemSrc.match(/b.wmvb/i)){return’wmp’;}else if(itemSrc.match(/b.avib/i)){return’wmp’;}else if(itemSrc.match(/b.mpgb/i)){return’wmp’;}else if(itemSrc.match(/b.m4vb/i)){return’quicktime’;}else if(itemSrc.match(/b.movb/i)){return’nonver’;}else if(itemSrc.match(/b.flvb/i)){return’jw’;}else if(itemSrc.match(/b.swfb/i)){return’jw’;}else if(itemSrc.match(/biframe=trueb/i)){return’iframe’;}else if(itemSrc.match(/bajax=trueb/i)){return’ajax’;}else if(itemSrc.match(/bcustom=trueb/i)){return’custom’;}else if(itemSrc.substr(0,1)==’#’){return’inline’;}else{return’image’;};};

Image Gallery

2014×1132 image in shadowbox

2014×1132 image in MediaboxAdv

2014×1132 image in prettyPhoto with the expand button on the top-right corner.

prettyphoto pic1 prettyphoto pic2


HTML

<a title=”HTML” href=”//www.dognmonkey.com?iframe=true&amp;width=90%&amp;height=100%” rel=”prettyPhoto”>HTML </a>

PDF

<p style=”text-align: center;”><strong><em><a title=”PDF display” href=”/media/teststuff/lockcoding.pdf?iframe=true&amp;width=90%&amp;height=100%” rel=”prettyPhoto”>PDF file</a></em></strong></p>

YouTube full url autoplay

<p style=”text-align: center;”><strong><em><a title=”dognmonkey” href=”//www.youtube.com/watch?v=iJT9HZye1PQ?fs=1&amp;autoplay=1″ rel=”prettyPhoto”>YouTube full url autoplay</a></strong></em></p>

YouTube playlist iframe

<p style=”text-align: center;”><strong><em><a title=”dognmonkey” href=”//www.youtube.com/embed?listType=playlist&list=PLuRzvc_tEcZST27lPO1_WgftNO1pVUZZY?iframe=true” rel=”prettyPhoto”>YouTube playlist iframe</a></strong></em></p>

Vimeo Url

<p style=”text-align: center;”><a title=”Short Love Story” href=”//vimeo.com/1618300&amp;fullscreen=1″ rel=”prettyPhoto”>Vimeo Url </a></p>

JWplayer .flv Player Test

<p style=”text-align: center;”><em><strong><a title=”a8.flv” href=”/media/teststuff/a8.flv?&amp;image=/media/teststuff/tn_cab04_76.JPG&amp;backcolor=000000&amp;skin=/jwplayer5_1/fs31.zip&amp;bufferlength=8&amp;volume=50″ rel=”prettyPhoto[vide]”>JWplayer .flv Player Test </a></strong></em></p>

NonverBlaster .mov Player Test

<p style=”text-align: center;”><strong><em><a title=”ltooz560b.mov” href=”/media/teststuff/a8.mov?&amp;teaserURL=/media/teststuff/tn_cab04_75.JPG” rel=”prettyPhoto[vide]”>NonverBlaster .mov Player Test </a></em></strong></p>

Quicktime .m4v Player Test

<p style=”text-align: center;”><em><strong><a title=”tasting.m4v” href=”/media/teststuff/tasting.m4v” rel=”prettyPhoto[vide]”>Quicktime .m4v Player Test </a></strong></em></p>

WMP 560×325 avi Player Test

WMP mpg Test

WMP wmv Test

WMPlayer

sixflag marineworld

<p style=”text-align: center;”><strong><em><a href=”//maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=1001+Fairgrounds+Dr,+Vallejo,+CA&amp;sll=37.0625,-95.677068&amp;sspn=51.443116,135.263672&amp;ie=UTF8&amp;hq=&amp;hnear=1001+Fairgrounds+Dr,+Vallejo,+Solano,+California+94589&amp;ll=38.146168,-122.226076&amp;spn=0.023625,0.036478&amp;z=14&amp;iwloc=A&amp;output=embed?iframe=true&amp;width=100%&amp;height=100%” rel=”prettyPhoto”>sixflag marineworld</a></em></strong></p>

14 Comments

  • I missed something like, where did you find the prettyphoto[vide] line? what should I modify in jquery.prettyphoto.js?

    • Hello Chasez,
      I don’t understand your question. What do you want to do? You want to play videos with different types of players?

    • I’m trying to get jwplayer to open with prettyphoto pop-up and I don’t get what do I have to do. whit this tutorial I can’t even get the vimeo link to open with prettyphoto. btw – yes I’m noob 😀

    • Hello chasez,
      it’s a lot of work to get jwplayer in the js file, why don’t you get my modified js file and put it the prettyphoto folder and use it. The only things you must change (in the first few lines of the js file) is the path (your server path) of jwplayer and nonverblaster (if you want to use it)

      (function($){$.prettyPhoto={version:’3.1′};$.fn.prettyPhoto=function(pp_settings){pp_settings=jQuery.extend({animation_speed:’fast’,player:’/idogjs/jwplayer5_1/player.swf’,player1:’/idogjs/fancybox/NonverBlaster.swf’,

      Let me know if it works for you.

    • any chance you could upload the modified js file again? it seems to have gone.

      trying to get .mp4 and .flv to play with nonverblaster.

    • (function($){$.prettyPhoto={version:’3.1′};$.fn.prettyPhoto=function(pp_settings){pp_settings=jQuery.extend({animation_speed:’fast’,player:’/idogjs/jwplayer5_1/player.swf’,player1:’/idogjs/fancybox/NonverBlaster.swf’,

      just replace these ‘/idogjs/jwplayer5_1/player.swf’ and ‘/idogjs/fancybox/NonverBlaster.swf’ to your URL and it should work.

      I modified the compressed version of the original ones.

Leave a Reply

Your email address will not be published. Required fields are marked *