Clicky

Flickr-Slideshow-Wrapper

Back in 2008 I wrote a plug-in for WordPress on wordpress.org, called Flickr-Slideshow-Wrapper (FSSW).

Times are changing and so does Technology. FSSW was called a “wrapper”, as it basically embedded a native flickr.com functionality to be shown within a self-hosted wordpress.org installation.

Roughly a year ago, flickr.com changed fundamentally its layout and look&feel and made as well changes on how to embed a flickr slideshow. The used method of using iframes and Flash was declared obsolete by flickr.com. Due to security concerns with flash, I do understand flickr, especially as this method was never “officially” supported.

The sad news for the many users of FSSW is that this plug-in won’t work any longer, and there is nothing I can change about it, as the basic technology basically doesn’t exist any longer. This means that even if you are running an older WordPress installation the plug-in as such will work, but it will still not be possible to embed any slideshow.

However, there are many other plug-ins out, using new concepts of flickr.com and their API to embed pictures. I don’t want to give a particular recommendation, as every plug-in has its pros and cons. It will – as always – be best for you to try which plug-in suits your needs best.

Below you can see how the plug-in worked and how it looked like. But please note again, that we are talking about the past. R.I.P. flickr-slideshow-wrapper and thank you to so many of you, who used this plugin successfully for quite a while. Last but not least I want to thank again Cory Shubert and his wife (shubertmedia.com) for their courtesy of using their pictures for showing the functionality of this plug-in.

FSSW – Option Panel

For those interested in the code, I'm posting it below. Perhaps it might be useful as a template how to build own shortcuts, or how to embed third party content into a Wordpress plug-on, means as a template to create some other kind of "wrapper"-plugins.

<!--?php  
/*
Plugin Name: flickr-slideshow-wrapper  
Plugin URI: http://www.ramgad.com/fssw/  
Description: Including flickr slideshows. Call fssw by adding [set_id=XYZ] (recommended!) or[set_id=XYZ] (recommended!) or <set_id="XYZ"> to your content. Please do not forget to replace XYZ by the set-id of the flickr-set you want to implement (<a href="htt://www.flickr.com" target="_blank"-->flickr.com). With <set_tag="tag1, tag2,="" etc."=""> your are able to compile your own tag-based set from flickr. Please refer to <a href="http://idgettr.com/" target="_blank">idgettr.com</a> to get the relevant information. You can as well implement a <a href="http://www.slideflickr.com" target="_blank">slideflickr.com</a> show by putting the slideflickr id into <slidef="xyz">. For your convenience you can as well use [set_id=XYZ] and/or [slidef=XYZ]. Version 5.0.1 or higher are requesting PHP5!  
Version: 5.4.6  
Author: Jeannot Muller  
Author URI: http://www.ramgad.com/fssw/  
Min WP Version: 2.5  
Max WP Version: 3.8.1  
*/

// Update routines
if ( isset($_POST['action_fssw']) ) {  
if ('insert' == $_POST['action_fssw']) {  
update_option("fssw_width",$_POST['fssw_width']);  
update_option("fssw_height",$_POST['fssw_height']);  
update_option("fssw_border",$_POST['fssw_border']);  
update_option("fssw_scroll",$_POST['fssw_scroll']);  
update_option("fssw_sfli_w",$_POST['fssw_sfli_w']);  
update_option("fssw_sfli_h",$_POST['fssw_sfli_h']);  
update_option("fssw_userid",$_POST['fssw_userid']);  
}
}

if (!class_exists('fssw_main')) {  
class fssw_main {  
/**
* PHP 4 Compatible Constructor
*/
function fssw_main(){$this->__construct();}

/**
* PHP 5 Constructor
*/
function __construct(){  
// Registration
add_action('admin_menu', 'fssw_description_add_menu');  
add_filter('the_content', 'get_flickr_set_id');  
}
// Registration of WordPress-Hooks
}

function fssw_description_option_page() {  
?>

<!-- Start Options Adminarea (xhtml) --></pre>  
<div class="wrap">  
<h2>FSSW Options</h2>  
<div style="margin-top: 20px;"><form action="<?php echo $_SERVER[" method="post">&updated=true">  
<div>  
<table class="form-table">  
<tbody>  
<tr>  
<th colspan="3" scope="col">Settings</th>  
</tr>  
<tr>  
<th scope="row">Width: (flickr)</th>  
<td>  
<input name="fssw_width" size="3" type="text" value="<?=get_option(" />" type="text" /><span style="color: blue;"> Example: 450</span></td>  
</tr>  
<tr>  
<th scope="row">Height: (flickr)</th>  
<td>  
<input name="fssw_height" size="3" type="text" value="<?=get_option(" />" type="text" /><span style="color: blue;"> Example: 450</span></td>  
</tr>  
<tr>  
<th scope="row">Border: (flickr)</th>  
<td>  
<input name="fssw_border" size="3" type="text" value="<?=get_option(" />" type="text" /><span style="color: blue;"> Example: 0</span></td>  
</tr>  
<tr>  
<th scope="row">Scrolling (yes|no): (flickr)</th>  
<td>  
<input name="fssw_scroll" size="3" type="text" value="<?=get_option(" />" type="text" /><span style="color: blue;"> Example: no</span></td>  
</tr>  
<tr>  
<th scope="row">User-ID: (flickr)</th>  
<td>  
<input name="fssw_userid" size="15" type="text" value="<?=get_option(" />" type="text" /><span style="color: blue;"> Example: 12345678@A12</span> (please use <a href="http://www.slideflickr.com/" target="_blank">slideflickr.com</a> to retrieve your ID)</td>  
</tr>  
<tr>  
<th scope="row">Width: (slideflickr)</th>  
<td>  
<input name="fssw_sfli_w" size="3" type="text" value="<?=get_option(" />" type="text" /><span style="color: blue;"> Example: 450</span></td>  
</tr>  
<tr>  
<th scope="row">Height: (slideflickr)</th>  
<td>  
<input name="fssw_sfli_h" size="3" type="text" value="<?=get_option(" />" type="text" /><span style="color: blue;"> Example: 450</span></td>  
</tr>  
</tbody>  
</table>  
<p class="submit_fssw"><input id="submit_fssw" name="submit_fssw" type="submit" value="Save changes »" />  
<input class="submit" name="action_fssw" type="hidden" value="insert" />

</div>  
</form></div>  
<p style="text-align: justify;">Call your flickr-slideshow-wrapper by adding [set_id="XYZ"] to your content. Please do not forget to replace XYZ by the set-id of the flickr-set you want to implement (<a href="http://www.flickr.com" target="_blank">flickr.com</a>).</p>  
<p style="text-align: justify;">If you have problems with FSSW, please feel free to drop a comment at: <a href="http://www.ramgad.com/fssw/">http://www.ramgad.com/fssw/</a></p>

<!--?php

} // Ende Funktion fssw_description_option_page()

// Adminmenu Optionen erweitern
function fssw_description_add_menu() {  
global $fssw_width, $fssw_height, $fssw_border, $fssw_scroll, $fssw_sfli_w, $fssw_sfli_h; $fssw_userid;  
add_options_page('FSSW', 'FSSW', 9, __FILE__, 'fssw_description_option_page'); //optionenseite hinzufügen  
}

function get_flickr_set_id($content) {  
$fssw_width = get_option('fssw_width');
$fssw_height = get_option('fssw_height');
$fssw_border = get_option('fssw_border');
$fssw_scroll = get_option('fssw_scroll');
$fssw_sfli_w = get_option('fssw_sfli_w');
$fssw_sfli_h = get_option('fssw_sfli_h');
$fssw_userid = get_option('fssw_userid');

// standard initialisation (default values)
if ( $fssw_width == null or $fssw_height == null) {  
$fssw_width = "450";
$fssw_height = "450";
}

// parse and replace

$content = preg_replace('/<set_id="([a-zA-Z0-9_]+)"/?-->/', '<a href="http://www.flickr.com/slideShow/index.gne?set_id=$1">http://www.flickr.com/slideShow/index.gne?set_id=$1</a>', $content);

$content = preg_replace('/[set_id=([a-zA-Z0-9_]+)]/', '<a href="http://www.flickr.com/slideShow/index.gne?set_id=$1">http://www.flickr.com/slideShow/index.gne?set_id=$1</a>', $content);

$content = preg_replace('/<set_tag="(w.+)" ?="">/', '<a href="http://www.flickr.com/slideShow/index.gne?user_id='.$fssw_userid.'&tags=$1'.'">http://www.flickr.com/slideShow/index.gne?user_id='.$fssw_userid.'&tags=$1'.'</a>', $content);

$content = preg_replace('/<slidef="([a-za-z0-9_]+)" ?="">/', '<a href="http://www.slideflickr.com/slide/$1">http://www.slideflickr.com/slide/$1</a>', $content);

$content = preg_replace('/[slidef=([a-zA-Z0-9_]+)]/', '<a href="http://www.slideflickr.com/slide/$1">http://www.slideflickr.com/slide/$1</a>', $content);

return $content;  
}

}

//instantiate the class
if (class_exists('fssw_main')) {  
$fssw_main = new fssw_main();
}
?>