How to add cool Lightbox to blogger (PrettyPhoto Lightbox)

Hi there, how you'll doing? I hope you are doing great! Well today I came up with a damn cool Lightbox + Slider for your blogger blog. It is created from a  jQuery lightbox plugin called "PrettyPhoto". Well I won't waste your time to introducing it anymore. Just check out the demo, it will say it all.

• LIVE DEMO

Installation Guide

If this is what you're looking for, follow the simple steps to install it.

STEP - 1: Go to Your Blogs Home > Template > Edit HTML

STEP - 2: Add jQuery script. (If your template already have a jQuery script installed then skip this step.) 

Place the following code just before the closing head tag </head>

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

STEP - 3: Add PrettyPhoto plugin.

Place the following code just before the closing head tag </head>

<script src='https://cdnjs.cloudflare.com/ajax/libs/prettyPhoto/3.1.6/js/jquery.prettyPhoto.min.js' type='text/javascript'/>
<link href='https://cdnjs.cloudflare.com/ajax/libs/prettyPhoto/3.1.6/css/prettyPhoto.min.css' rel='stylesheet' type='text/css'/> 

STEP - 4: Initialize the Lightbox (Final step)

Place the following code just before the closing body tag </body>

<script type='text/javascript'>
  $(".post-body").each(function(i) {
      $(this).find("img").closest('a').attr("rel", "prettyPhoto[gallery" + (i + 1) + "]");
  });
</script>
<script charset='utf-8' type='text/javascript'>
  $(document).ready(function(){
      $(".post-body a[rel^='prettyPhoto']").prettyPhoto({
          animation_speed:'normal',
          slideshow: 5000, 
          theme: 'pp_default',
          autoplay_slideshow: true
      });
  });
</script>

You've successfully installed the PrettyPhoto Lightbox. Any question or any suggestion to improve this widget is more than welcome.