Store Snapshot created via wordpress to use with lightbox


EDITED ANSWER

Forget every thing i said before. Here is what i have found the following

  1. In php to generate a website thumbnail, you cant do it natively with php’s built in functions, so you have to call an external service or program to do it for you. Since wordpress is basically php , this fact still holds true. You can see for yourself other coders struggling to do so here 🙂 . I believe that at the url http://s.wordpress.com/mshots/v1/ there exists such a service.
  2. To use the service above eg to get a snapshot of google.com

    http://s.wordpress.com/mshots/v1/http%3A%2F%2Fwww.google.com%2F?w=300px&h=200px
    Note that the url has to be properly encoded thats why you see funny characters in the url

Now light box.

  1. Is a javascript script that allows you to have cool picture effects and is easy to use. The implementation i decided to use is a wordpress plugin called Lightbox Plus
    which depends on colorbox (just another variant of lightbox)
  2. Colorbox tries to do some kind of automatic automatic photo detection which may fail in a case like ours where we reference php files instead of direct images or so i think :) See this question on stackoverflow. For my case the problem is because colorbox has code like this somewhere

var defaults = { photo: false; }

Solution
Change the false to true 🙂
Details

  1. Download colorbox
  2. Get the file jquery.colorbox.js and copy it to the plugin js folder right next to jquery.colorbox-min.js
  3. Edit jquery.colorbox.js by changing photo:false to true
  4. Tell our plugin to use the modified file. by modifying lightbox-plus\classes\actions.class.php and replace all references to jquery.colorbox-min.js with jquery.colorbox.js

Fix your shortcode. Here is the one iam currently using BUT it only generates images of my schools website

function wpr_snap($atts, $content = null) {
        extract(shortcode_atts(array(
            "snap" => 'http://s.wordpress.com/mshots/v1/',
            "url" => 'http://www.sagive.co.il',
            "alt" => 'My image',
            "w" => '400', // width
            "h" => '300' // height
        ), $atts));

    $img = '<a rel="lightbox[roadtrip]" href="http://s.wordpress.com/mshots/v1/http%3A%2F%2Fchs.mak.ac.ug%2F?w=300px&amp;h=200px"><img src="' . $snap . '' . urlencode($url) . '?w=' . $w . '&h=" . $h . "" alt="' . $alt . '" style="border:1px solid #333;padding:2px;"/></a>';
    return $img;
}

add_shortcode("snap", "wpr_snap");

This is what i see
in admin area
How it looks

Good luck.