Enhanced FCG. New, 3rd input source is XML file.

Grumpy · By **Grumpy** on Mon Jun 28, 2010 5:21 pm

Last year I was inspired by this post to mod FCG a bit : http://www.featuredcontentgallery.com/forum/is-that-possible-to-link-fcg-image-to-my-preferred-url-488.html
But during the mod I already lost interest. I'm an IBM Midrange (ILE RPG and COBOL) developer. And in my spare time, I'm more into Ruby than PHP. I never liked PHP, and I don't know why. Anyways, last week I bumped into this code again. And yesterday afternoon I spent some time to polish the code, and finish some more tests.
You do not need posts or pages with this new option. You can specify any (external) link you want, and only the large image is mandatory.
All the existing FCG v3.2.0 functionality is left unchanged, and I also did regression tests to check on WP 2.9.2 and 3.0 (not tested with WPMU functionality of 3.0).

Screenshot of the Enhanced Featured Content Gallery Configuration
(New and changed bits are highlighted in yellow.)

At the top of the FCG Settings page, I added a new source to feed your FCG : "Select here to use Hyperlinked Slides".
Right under this, you can specify any file name you want for the XML configuration file. It doesn't even have to have an .xml extension.
The XML configuration file is only used by this new FCG source. It is meant to substitute your posts and pages as source for FCG.
You can show and hide an example of the structure of the XML configuration file at the bottom of the FCG Settings page.
Under the filename you can specify whether you want the Slides randomized or not.
Randomization is only at page load time. Just like the original FCG randomizes/shuffles the post/page IDs before displaying them. In both cases randomization takes places only once.
I also changed some descriptions to make it clear that these were only applicable to the 2 existing FCG sources.

If you do select this new source without specifying the XML configuration file name the background of the input box will be colored red, and an error message will be displayed in red at the bottom of the page.
The XML configuration file must be placed in the FCG plug-in directory to be found.

<url></url>*

Mandatory as in the original FCG. Omit it or specify as empty, then your FCG will stop working.

<alttext></alttext>

Optional as in the original FCG. Can be omitted from the XML file, or specified as empty. In which case, it will be specified as alt="", because it is a required attribute of the HTML img tag.

<thumbnail></thumbnail>

Optional as in the original FCG. Can be omitted from the XML file, or specified as empty.

<target_url></target_url>

I made this optional. FCG expects an anchor of class "open", so when omitted or empty, I specify it as <a href="#" class="open"></a>

<target_url_rel></target_url_rel>

This is an enhancement. You can omit this item, or specify it as empty. It is entirely optional.

<heading></heading>
<paragraph></paragraph>

You have to make a decision whether to display overlay text or not. Whatever your decision is, it will be applicable to all slides. Not just a few.
In the regular FCG this information is always available (think post and page headings, and post and page content).
FCG expects the HTML tags for this information to be present, or it will not work. Because it is normally fed by posts and pages.
If you omit these 2 items, or specify them but leave them empty, my code specifies them as empty : <h2></h2> and <p></p>. Because FCG requires these 2 HTML tags to be present. You'll end up with an empty text overlay. So specify a text overlay height of 0 pixels.
Don't leave the field blank, but specify an actual zero for pixels. Otherwise a 1 pixel text overlay will still slide in at the bottom.

This plug-in has so much untapped possibilities, that it's scary. Only Cu3er can touch it, but that one is Flash based and closed source.

Make good use of it.
Robert

Code pasted into the next post. Otherwise this one was over 60000 characters.
.

Grumpy · By **Grumpy** on Mon Jun 28, 2010 5:25 pm

options.php :

Code: Select all: <?php $location = $options_page; // Form Action URI ?>  <script type="text/javascript"> function show_hide(id) { document.getElementById(id).style.display = (document.getElementById(id).style.display == "block" ? "none" : "block"); } </script>  <div class="wrap"> <h2>Featured Content Gallery Configuration</h2> <p>Use the options below to select the content for your gallery, to style your gallery, and to configure the gallery slides and transitions.<br /> Visit the <a href="http://www.featuredcontentgallery.com">Featured Content Gallery Plugin</a> website for more information.</p> <form method="post" action="options.php"><?php wp_nonce_field('update-options'); ?>   <fieldset title="general_options" class="options">  <div style="padding-top: 15px"></div> <u><strong>Featured Content Gallery Code</strong></u> - If not already included, add this code to your template file where you want the Featured Content Gallery to be displayed:<br /> <blockquote><?php include (ABSPATH . '/wp-content/plugins/featured-content-gallery/gallery.php'); ?></blockquote> <div style="padding-top: 10px"></div>   <?php $galleryoldway = (get_option('gallery-way') == 'old' || get_option('gallery-way') == '') ? "checked" : ""; $gallerynewway = get_option('gallery-way') == 'new' ? "checked" : ""; $gallerymyway = get_option('gallery-way') == 'my' ? "checked" : ""; ?> <u><strong>Featured Content Selection</strong></u> - Select either a blog category, individual post/page IDs, or Slides as source for your featured content:<br /> <div style="padding-top: 5px"></div>  <table width="1020" border="0" cellpadding="0" cellspacing="7"> <tr> <td width="330"> <input type="radio" name="gallery-way" id="gallery-old-way" size="25" value="old" <?php print $galleryoldway; ?>> Select here to use category selection </td> <td width="360"> <input type="radio" name="gallery-way" id="gallery-new-way" size="25" value="new" <?php print $gallerynewway; ?>> Select here to use individual post or page IDs </td> <td width="330"> <input type="radio" name="gallery-way" id="gallery-my-way" size="25" value="my" <?php print $gallerymyway; ?>> Select here to use Hyperlinked Slides </td> </tr>     <tr> <td> Category Name:<br /> <input name="gallery-category" id="gallery-category" size="25" value="<?php echo get_option('gallery-category'); ?>"> </td> <td> Post or Page IDs <span class="style1">(comma separated no spaces)</span>:<br /> <input name="gallery-items-pages" id="gallery-items-pages" size="25" value="<?php echo get_option('gallery-items-pages'); ?>"> </td>  <td> XML Configuration Filename:<br /> <?php $gallery_XML_file = get_option('gallery-XML-file'); if ( isset($gallery_XML_file) && !empty($gallery_XML_file) ) { ?> <input name="gallery-XML-file" id="gallery-XML-file" size="40" value="<?php echo get_option('gallery-XML-file'); ?>"> <?php } else { if ($gallerymyway == "checked" ) { ?> <input name="gallery-XML-file" id="gallery-XML-file" size="40" style="background-color: #FF0000; color: #FFFFFF; font-weight: bold;" value="<?php echo get_option('gallery-XML-file'); ?>"> <?php } } ?> </td>  </tr> <tr> <td> Number of Items to Display:<br /> <input name="gallery-items" id="gallery-items" size="25" value="<?php echo get_option('gallery-items'); ?>"> </td> <td> <?php $checked3 = get_option('gallery-randomize-pages') ? "checked" : ""; ?> <input type="checkbox" name="gallery-randomize-pages" id="gallery-randomize-pages" <?php print $checked3 ?>> Check here to randomize post/page ID display </td> <td> <?php $checked4 = get_option('gallery-randomize-slides') ? "checked" : ""; ?> <input type="checkbox" name="gallery-randomize-slides" id="gallery-randomize-slides" <?php print $checked4 ?>> Check here to randomize Slides display </td> </tr> </table> <div style="padding-top: 10px"></div> <u><strong>Gallery Style</strong></u> - Choose your gallery size and colors:<br /> <div style="padding-top: 10px"></div> <table width="690" border="0" cellpadding="0" cellspacing="7"> <tr> <td width="330"> Gallery Width in Pixels:<br /> <input name="gallery-width" id="gallery-width" size="25" value="<?php echo get_option('gallery-width'); ?>"> </td> <td width="360"> Gallery Border Color (#hex or color name):<br /> <input name="gallery-border-color" id="gallery-border-color" size="25" value="<?php echo get_option('gallery-border-color'); ?>"> </td> </tr> <tr> <td> Gallery Height in Pixels:<br /> <input name="gallery-height" id="gallery-height" size="25" value="<?php echo get_option('gallery-height'); ?>"> </td> <td> Gallery Background Color (#hex or color name):<br /> <input name="gallery-bg-color" id="gallery-bg-color" size="25" value="<?php echo get_option('gallery-bg-color'); ?>"> </td> </tr> <tr> <td> Text Overlay Height in Pixels:<br /> <input name="gallery-info" id="gallery-info" size="25" value="<?php echo get_option('gallery-info'); ?>"> </td> <td> Gallery Text Color (#hex or color name):<br /> <input name="gallery-text-color" id="gallery-text-color" size="25" value="<?php echo get_option('gallery-text-color'); ?>"> </td> </tr> </table> <div style="padding-top: 10px"></div> <u><strong>Slide Transition Times and Other Options</strong></u> - Choose your slide and fade duration, carousel button name and text overlay word quantity:<br /> <div style="padding-top: 10px"></div> <table width="690" border="0" cellpadding="0" cellspacing="10"> <tr> <td width="330"> Slide Display Duration (milliseconds):<br /> <input name="gallery-delay" id="gallery-delay" size="25" value="<?php echo get_option('gallery-delay'); ?>"><br /> (Default: 9000 milliseconds / 9 seconds) </td> <td width="360"> Carousel Button Name:<br /> <input name="gallery-fcg-button" id="gallery-fcg-button" size="25" value="<?php echo get_option('gallery-fcg-button'); ?>"><br /> (Default: "Featured Content") </td> </tr> <tr> <td> Slide Fade Duration (milliseconds):<br /> <input name="gallery-fade-duration" id="gallery-fade-duration" size="25" value="<?php echo get_option('gallery-fade-duration'); ?>"><br /> (Default: 500 milliseconds / .5 seconds) </td> <td> Number of Words in Text Overlay:<br /> <input name="gallery-rss-word-quantity" id="gallery-rss-word-quantity" size="25" value="<?php echo get_option('gallery-rss-word-quantity'); ?>"><br /> (Default: 100 words) </td> </tr> </table> <div style="padding-top: 10px"></div> <u><strong>Slide Transition Type</strong></u> - Choose your slide transition effect:<br /> <div style="padding-top: 10px"></div> <?php $galleryfade = (get_option('gallery-default-transaction') == 'fade' || get_option('gallery-default-transaction') == '') ? "checked" : ""; $galleryfadeslideleft = get_option('gallery-default-transaction') == 'fadeslideleft' ? "checked" : ""; $gallerycontinuoushorizontal = get_option('gallery-default-transaction') == 'continuoushorizontal' ? "checked" : ""; $gallerycontinuousvertical = get_option('gallery-default-transaction') == 'continuousvertical' ? "checked" : ""; ?> <table width="500" border="0" cellpadding="0" cellspacing="10"> <tr> <td width="250"> <input type="radio" name="gallery-default-transaction" id="gallery-default-transaction" size="25" value="fade" <?php print $galleryfade; ?>> Simple Fade </td> <td width="250"> <input type="radio" name="gallery-default-transaction" id="gallery-default-transaction" size="25" value="fadeslideleft" <?php print $galleryfadeslideleft; ?>> Slide Left with Fade </td> </tr> <tr> <td> <input type="radio" name="gallery-default-transaction" id="gallery-default-transaction" size="25" value="continuoushorizontal" <?php print $gallerycontinuoushorizontal; ?>> Continuous Horizontal </td> <td> <input type="radio" name="gallery-default-transaction" id="gallery-default-transaction" size="25" value="continuousvertical" <?php print $gallerycontinuousvertical; ?>> Continuous Vertical </td> </tr> </table>   <div style="padding-top: 10px"></div> <u><strong>Required Custom Fields, for "category selection" and "individual post or page IDs"</strong></u> <div style="padding-top: 5px"></div> For each post or page you want to display in your gallery, regardless of your selections above, you <strong>must</strong> include a custom field. For the main gallery image, use the key <strong>articleimg</strong> and the full url of your image in the value. You <strong>must</strong> have at least two (2) items featured for the gallery to work. <div style="padding-top: 10px"></div> <u><strong>Advanced Custom Fields, for "category selection" and "individual post or page IDs"</strong></u> <div style="padding-top: 5px"></div> <?php $checked1 = get_option('gallery-use-featured-content') ? "checked" : ""; ?> <input type="checkbox" name="gallery-use-featured-content" id="gallery-use-featured-content" <?php print $checked1 ?>> Check here if you want to use custom text under the post/page title.<br /> Key: <strong>featuredtext</strong> - Insert custom text in the value. HTML is allowed. <div style="padding-top: 10px"></div> <?php $checked2 = get_option('gallery-use-thumb-image') ? "checked" : ""; ?> <input type="checkbox" name="gallery-use-thumb-image" id="gallery-use-thumb-image" <?php print $checked2 ?>> Check here if you want to use a custom thumbnail image in your gallery.<br /> Key: <strong>thumbnailimg</strong> - Insert the url of the image in the value. <div style="padding-top: 5px"></div> You can also add alt text to your gallery images with a custom field.<br /> Key: <strong>alttext</strong> - Insert the alt text in the value. <div style="padding-top: 15px"></div> For more information, please visit the <a href="http://www.featuredcontentgallery.com/install-setup">Featured Content Gallery Install & Setup</a> page. <input type="hidden" name="action" value="update" />   <input type="hidden" name="page_options" value="gallery-width,gallery-height,gallery-info,gallery-items,gallery-border-color,gallery-bg-color,gallery-text-color,gallery-use-featured-content,gallery-use-thumb-image,gallery-way,gallery-items-pages,gallery-category,gallery-fcg-button,gallery-fade-duration,gallery-delay,gallery-randomize-pages,gallery-rss-word-quantity,gallery-default-transaction,gallery-XML-file,gallery-randomize-slides" /> <div style="padding-top: 20px"></div> <u><strong>Custom and Advanced Fields configuration, for hyperlinked Slides</strong></u>  <?php $dispfilename = "Your Config File Name Here.xml"; $gallery_XML_file = get_option('gallery-XML-file'); if ( isset($gallery_XML_file) && !empty($gallery_XML_file) ) { $dispfilename = $gallery_XML_file;; } ?>  <br />Make configurations in the XML file '/wp-content/plugins/featured-content-gallery/<?php print $dispfilename; ?>'. <?php if ( ($gallerymyway == "checked" ) && ( !isset($gallery_XML_file) || empty($gallery_XML_file) ) ) {; ?> <p style="color: red; font-weight: bold;">To use hyperlinked Slides, fill out the filename of the configuration file at : "XML Configuration Filename:" above, and update options.'</p> <?php } ?>  </fieldset> <p class="submit"><input type="submit" name="Submit" value="<?php _e('Update Options') ?>" /></p> <p><em>Featured Content Gallery WordPress Plugin v3.2.0 by <a href="http://www.ieplexus.com">iePlexus</a></em></p> </form>  <div style="padding-top: 20px"></div> <u><strong>The structure of the Configuration File for Hyperlinked Slides :</strong></u>  <p class="submit"><input type="button" name="ShowHide" value="<?php _e('Show / Hide') ?>" onclick="show_hide('xmlstructure');" /></p> <div style="padding-top: 20px"></div> <div id="xmlstructure" style="display: none;"> <span style="margin: 0px 0px 0px 430px; color: #FF0000; font-weight: bold;">*</span> = Mandatory. <br /><strong><?xml version="1.0" encoding="UTF-8"?></strong> <br /><strong><gallery></strong> <br /><span style="margin: 0px 0px 0px 040px;"><strong><slides></strong></span> <br /><span style="margin: 0px 0px 0px 080px;"><strong><slide></strong></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong><image></strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><url></url&GT;</strong><span style="color: #FF0000; font-weight: bold;">*</span><span style="margin: 0px 0px 0px 167px;"></span></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><alttext></alttext&GT;</strong><span style="margin: 0px 0px 0px 116px;"></span></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><thumbnail></thumbnail&GT;</strong><span style="margin: 0px 0px 0px 68px;"></span></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><target_url></target_url&GT;</strong><span style="margin: 0px 0px 0px 68px;"></span></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><target_url_rel></target_url_rel></strong><span style="margin: 0px 0px 0px 12px;"></span></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong></image></strong></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong><caption></strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><heading></heading&GT;</strong><span style="margin: 0px 0px 0px 98px;"></span></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><paragraph></paragraph&GT;</strong><span style="margin: 0px 0px 0px 64px;"></span></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong></caption></strong></span> <br /><span style="margin: 0px 0px 0px 080px;"><strong></slide></strong></span> <br /><span style="margin: 0px 0px 0px 080px;"><strong><slide></strong></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong><image></strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><url></url&GT;</strong></span><span style="color: #FF0000; font-weight: bold;">*</span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><alttext></alttext&GT;</strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><thumbnail></thumbnail&GT;</strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><target_url></target_url&GT;</strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><target_url_rel></target_url_rel></strong></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong></image></strong></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong><caption></strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><heading></heading&GT;</strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><paragraph></paragraph&GT;</strong></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong></caption></strong></span> <br /><span style="margin: 0px 0px 0px 080px;"><strong></slide></strong></span> <br /><span style="margin: 0px 0px 0px 080px;"><strong>.</strong></span> <br /><span style="margin: 0px 0px 0px 080px;"><strong>.</strong></span> <br /><span style="margin: 0px 0px 0px 080px;"><strong>.</strong></span> <br /><span style="margin: 0px 0px 0px 080px;"><strong><slide></strong></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong><image></strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><url></url&GT;</strong></span><span style="color: #FF0000; font-weight: bold;">*</span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><alttext></alttext&GT;</strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><thumbnail></thumbnail&GT;</strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><target_url></target_url&GT;</strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><target_url_rel></target_url_rel></strong></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong></image></strong></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong><caption></strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><heading></heading&GT;</strong></span> <br /><span style="margin: 0px 0px 0px 160px;"><strong><paragraph></paragraph&GT;</strong></span> <br /><span style="margin: 0px 0px 0px 120px;"><strong></caption></strong></span> <br /><span style="margin: 0px 0px 0px 080px;"><strong></slide></strong></span> <br /><span style="margin: 0px 0px 0px 040px;"><strong></slides></strong></span> <br /><strong></gallery></strong> <div style="padding-top: 20px"></div> </div>  </div>

gallery.php :

Code: Select all:    <div id="featured"> <script type="text/javascript"> function startGallery() { var myGallery = new gallery($('myGallery'), { timed: true }); } window.addEvent('domready',startGallery); </script> <style type="text/css"> .jdGallery .slideInfoZone { height: <?php echo get_option('gallery-info'); ?>px; } </style> <div id="myGallery"> <?php $imgthumb = get_option('gallery-use-thumb-image') ? "thumbnailimg" : "articleimg"; $wordquantity = get_option('gallery-rss-word-quantity') ? get_option('gallery-rss-word-quantity') : 100; switch (get_option('gallery-way')) { case 'my' : // print "My Hello World!"; // print ("\n" . get_option('gallery-way')); // Save the current setting (most likely the default: enable libxml errors), and disable libxml errors to allow the script to fetch error information. // Always cleanup. Aggregating XML errors will eat up memory very quickly. $oldSetting = libxml_use_internal_errors( true ); libxml_clear_errors(); $url_Base = get_bloginfo('wpurl')."/wp-content/plugins/featured-content-gallery/"; //With trailing forward slah. $url_XML_File = urlencode( get_option('gallery-XML-file') ); // Without leading forward slash. $url = trim($url_Base) . trim($url_XML_File); $XML_string = file_get_contents($url); // print ($XML_string); // View the output with "View Page Source". if ($XML_string === false) { echo ('Slide configuration file ' . trim($url_Base) . trim($url_XML_File) . ' not found, or inaccessible.'); // Display error message. } else { $XML = simplexml_load_string($XML_string); if ($XML === false) { echo ('Slide configuration file ' . trim($url_Base) . trim($url_XML_File) . ' contains errors.'); // Display error message. foreach(libxml_get_errors() as $XML_error) { echo "\t".$XML_error->message; } } else { $fcg_slides = $XML->xpath('/gallery/slides/slide'); // var_dump($fcg_slides); // View the output with "View Page Source". if (isset($fcg_slides) && !empty($fcg_slides) ) { if (get_option('gallery-randomize-slides')) { shuffle($fcg_slides); } foreach($fcg_slides as $fcg_slide){ $firstXwords = Array(); if ( isset($fcg_slide->caption->paragraph) && !empty($fcg_slide->caption->paragraph) ) { preg_match("/^(\S+\s+){0,$wordquantity}/", $fcg_slide->caption->paragraph, $firstXwords); } ?> <div class="imageElement"> <?php // if ( isset($fcg_slide->caption->heading) && !empty($fcg_slide->caption->heading) ) { ?> <h2><?php print ($fcg_slide->caption->heading); ?></h2> <?php // } ?> <?php // if ( isset($firstXwords) && !empty($firstXwords) ) { ?> <p><?php print (implode(" ", $firstXwords)); ?></p> <?php // } ?> <?php if ( isset($fcg_slide->image->target_url) && !empty($fcg_slide->image->target_url) ) { ?> <a href="<?php print ($fcg_slide->image->target_url); ?>" title="Read More" class="open"<?php if ( isset($fcg_slide->image->target_url_rel) && !empty($fcg_slide->image->target_url_rel) ) { ?> rel="<?php print ($fcg_slide->image->target_url_rel); ?>"<?php } ?>></a> <?php } else { ?> <a href="#" class="open"></a> <?php } ?> <?php if ( isset($fcg_slide->image->url) && !empty($fcg_slide->image->url) ) { ?> <img src="<?php print ($fcg_slide->image->url); ?>" alt="<?php print ($fcg_slide->image->alttext); ?>" class="full" /> <?php } ?> <?php if ( isset($imgthumb) && $imgthumb == "thumbnailimg" ) { ?> <?php if ( isset($fcg_slide->image->thumbnail) && !empty($fcg_slide->image->thumbnail) ) { ?> <img src="<?php print ($fcg_slide->image->thumbnail); ?>"<?php if ( isset($fcg_slide->image->alttext) && !empty($fcg_slide->image->alttext) ) { ?> alt="<?php print ($fcg_slide->image->alttext); ?>"<?php } ?> class="thumbnail" /> <?php } ?> <?php } else { ?> <?php if ( isset($fcg_slide->image->url) && !empty($fcg_slide->image->url) ) { ?> <img src="<?php print ($fcg_slide->image->url); ?>" alt="<?php print ($fcg_slide->image->alttext); ?>" class="thumbnail" /> <?php } ?> <?php } ?> </div> <?php } } } } // Always cleanup. Aggregating XML errors will eat up memory very quickly. // Restore previous setting (most likely the default: enable libxml errors). libxml_clear_errors(); libxml_use_internal_errors( $oldSetting ); break; case 'new' : // print "New Hello World!"; // print ("\n" . get_option('gallery-way')); $arr = split(",",get_option('gallery-items-pages')); if (get_option('gallery-randomize-pages')) { shuffle($arr); } foreach ($arr as $post_or_page_id) { get_a_post($post_or_page_id); ?> <div class="imageElement"> <h2><?php the_title(); ?></h2> <?php if(get_option('gallery-use-featured-content')) { ?> <p><?php $key="featuredtext"; echo get_post_meta($post->ID, $key, true); ?></p> <?php } else { ?> <p><?php the_content_rss('', 0, '', $wordquantity); ?></p> <?php } ?> <a href="<?php the_permalink(); ?>" title="Read More" class="open"></a> <img src="<?php $key="articleimg"; echo get_post_meta($post->ID, $key, true); ?>" alt="<?php $key="alttext"; echo get_post_meta($post->ID, $key, true); ?>" class="full" /> <img src="<?php $key=$imgthumb; echo get_post_meta($post->ID, $key, true); ?>" alt="<?php $key="alttext"; echo get_post_meta($post->ID, $key, true); ?>" class="thumbnail" /> </div> <?php } break; // case '' : // case 'old' : default : // print "Old Hello World!"; // print ("\n" . get_option('gallery-way')); ?> <?php $temp_query = $wp_query; ?> <?php query_posts('category_name=' . get_option('gallery-category') . '&showposts=' . get_option('gallery-items')); ?> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <div class="imageElement"> <h2><?php the_title(); ?></h2> <?php if(get_option('gallery-use-featured-content')) {?> <p><?php $key="featuredtext"; echo get_post_meta($post->ID, $key, true); ?></p> <?php } else { ?> <p><?php the_content_rss('', 0, '', $wordquantity); ?></p> <?php } ?> <a href="<?php the_permalink(); ?>" title="Read More" class="open"></a> <img src="<?php $key="articleimg"; echo get_post_meta($post->ID, $key, true); ?>" alt="<?php $key="alttext"; echo get_post_meta($post->ID, $key, true); ?>" class="full" /> <img src="<?php $key=$imgthumb; echo get_post_meta($post->ID, $key, true); ?>" alt="<?php $key="alttext"; echo get_post_meta($post->ID, $key, true); ?>" class="thumbnail" /> </div> <?php endwhile; else: ?> <?php endif; ?> <?php $wp_query = $temp_query; ?> <?php break; } ?> </div> </div>

Example XML configuration file :

Code: Select all: <?xml version="1.0" encoding="UTF-8"?> <gallery> <slides> <slide> <image> <url>../../../../images/Image01_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail> <target_url>http://quitsmoking-1.com/Outgoing_URL01/</target_url> <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>The key to increase your Mental power, Abilities and Health is a step away..</heading> <paragraph>Effortlessly, comfortably in your home or work. Read ahead to.. Discover The Revolutionary Software That Will Reprogram Your MIND And BODY Automatically, Placing Thousands Of Positive Affirmations Directly In Your Brain, FAST AND EASY. Imagine Accomplishing Your Goals Right Now At The Touch Of a Button on Your PC.</paragraph> </caption> </slide> <slide> <image> <url>../../../../images/Image02_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail> <target_url>http://quitsmoking-1.com/Outgoing_URL02/</target_url> <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>This is the optional caption heading of slide #2. In bold and larger sized text.</heading> <paragraph>This is the actual caption of slide #2. Which is also optional of course. It is a great thing to have options. Blah Blaaah! Bladeeh Bladeeh Blaaah! Blah Blaaah!</paragraph> </caption> </slide> <slide> <image> <url>../../../../images/Image03_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail> <target_url>http://quitsmoking-1.com/Outgoing_URL03/</target_url> <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>This is the optional caption heading of slide #3. In bold and larger sized text.</heading> <paragraph>This is the actual caption of slide #3. Which is also optional of course. It is a great thing to have options. Blah Blaaah! Bladeeh Bladeeh Blaaah! Blah Blaaah!</paragraph> </caption> </slide> <slide> <image> <url>../../../../images/Image04_905x300.png</url>     </image> <caption>   </caption> </slide> <slide> <image> <url>../../../../images/Image05_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail>  <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>This is the optional caption heading of slide #5. In bold and larger sized text.</heading> <paragraph>This is the actual caption of slide #5. Which is also optional of course. It is a great thing to have options. Blah Blaaah! Bladeeh Bladeeh Blaaah! Blah Blaaah!</paragraph> </caption> </slide> <slide> <image> <url>../../../../images/Image06_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail>  <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>This is the optional caption heading of slide #6. In bold and larger sized text.</heading> <paragraph>This is the actual caption of slide #6. Which is also optional of course. It is a great thing to have options. Blah Blaaah! Bladeeh Bladeeh Blaaah! Blah Blaaah!</paragraph> </caption> </slide> <slide> <image> <url>../../../../images/Image07_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail>  <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>This is the optional caption heading of slide #7. In bold and larger sized text.</heading> <paragraph>This is the actual caption of slide #7. Which is also optional of course. It is a great thing to have options. Blah Blaaah! Bladeeh Bladeeh Blaaah! Blah Blaaah!</paragraph> </caption> </slide> <slide> <image> <url>../../../../images/Image08_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail>  <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>This is the optional caption heading of slide #8. In bold and larger sized text.</heading> <paragraph>This is the actual caption of slide #8. Which is also optional of course. It is a great thing to have options. Blah Blaaah! Bladeeh Bladeeh Blaaah! Blah Blaaah!</paragraph> </caption> </slide> <slide> <image> <url>../../../../images/Image09_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail>  <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>The key to increase your Mental power, Abilities and Health is a step away..</heading> <paragraph>Effortlessly, comfortably in your home or work. Read ahead to.. Discover The Revolutionary Software That Will Reprogram Your MIND And BODY Automatically, Placing Thousands Of Positive Affirmations Directly In Your Brain, FAST AND EASY. Imagine Accomplishing Your Goals Right Now At The Touch Of a Button on Your PC.</paragraph> </caption> </slide> <slide> <image> <url>../../../../images/Image10_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail>  <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>This is the optional caption heading of slide #10. In bold and larger sized text.</heading> <paragraph>This is the actual caption of slide #10. Which is also optional of course. It is a great thing to have options. Blah Blaaah! Bladeeh Bladeeh Blaaah! Blah Blaaah!</paragraph> </caption> </slide> <slide> <image> <url>../../../../images/Image11_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail>  <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>This is the optional caption heading of slide #11. In bold and larger sized text.</heading> <paragraph>This is the actual caption of slide #11. Which is also optional of course. It is a great thing to have options. Blah Blaaah! Bladeeh Bladeeh Blaaah! Blah Blaaah!</paragraph> </caption> </slide> <slide> <image> <url>../../../../images/Image12_905x300.png</url> <alttext></alttext> <thumbnail></thumbnail>  <target_url_rel>external nofollow</target_url_rel> </image> <caption> <heading>This is the optional caption heading of slide #12. In bold and larger sized text.</heading> <paragraph>This is the actual caption of slide #12. Which is also optional of course. It is a great thing to have options. Blah Blaaah! Bladeeh Bladeeh Blaaah! Blah Blaaah!</paragraph> </caption> </slide> </slides> </gallery>

Grumpy · By **Grumpy** on Tue Jun 29, 2010 10:03 am

.
Opening FCG links in a new window or tab.

To make FCG obey the target attribute, you should also let it "make" the attribute first. But bear in mind that the attribute target was dropped from the strict XHTML standard which WordPress uses.
You can add the target attribute to gallery.php. But this is not very clever way because it will not be a flexible solution.
Or if you want to stay "strict", and flexible, you have to load a small JavaScript to set the target attribute in the DOM, after the page has completely loaded.
So your pages will still validate.
This JavaScript will work together with <target_url_rel></target_url_rel> in the XML Configuration file.
If you want all or just some of your external (off-site) FCG links to open in a new window/tab specify : <target_url_rel>external</target_url_rel> or <target_url_rel>external nofollow</target_url_rel>. So, use of the attribute value external is important.

The JavaScript will change the target attribute to _blank of all the anchor elements in the HTML DOM with attribute rel set to external or external nofollow. After the document is completely loaded.
The reason the target attribute couldn't be manipulated, was because it didn't exist in the first place, on any of the links made/injected into the DOM by jd.gallery.js.php.

There are 2 versions of the FCG JavaScript which need to be modified to create the FCG links with the target attribute.
jd.gallery.js.php is the version being used by FCG. (For completeness you should maybe also modify the second (unused) version : jd.gallery.js.)
(All I can think of is that the file jd.gallery.js is a matter of personal preference. For example, you do not like to use a PHP file for JavaScript. Don't know for sure of course.)

Modifications

In jd.gallery.js.php (and maybe jd.gallery.js) :
Added a comma to the end of this existing line in function makeLink : title: this.galleryData[num].linkTitle
Added this new line to function makeLink : target: this.galleryData[num].linkTarget

Code: Select all: /* Added - start. BEFORE makeLink: function(num) { this.currentLink.setProperties({ href: this.galleryData[num].link, title: this.galleryData[num].linkTitle }) if (!((this.options.embedLinks) && (!this.options.showArrows) && (!this.options.showCarousel))) this.currentLink.setStyle('display', 'block'); }, BEFORE */ makeLink: function(num) { this.currentLink.setProperties({ href: this.galleryData[num].link, title: this.galleryData[num].linkTitle, target: this.galleryData[num].linkTarget }) if (!((this.options.embedLinks) && (!this.options.showArrows) && (!this.options.showCarousel))) this.currentLink.setStyle('display', 'block'); }, /* Added - end. */

Javascript function - addLoadEvent :
Stick into a separate .js file and for example name it AddEventsAtCompletion.js (name it anything you like).
Its purpose is to attach more than one Javascript to be executed after the document has fully loaded.

Code: Select all: // Function addLoadEvent() by http://simonwillison.net/ function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { if (oldonload) { oldonload(); } func(); } } }

JavaScript function externalLinks :
Stick into a separate .js file and for example name it ExternalLinks.js (name it anything you like).
Its purpose is to manipulate the target attribute after the document has been fully loaded.

Code: Select all: // From SitePoint.com. function externalLinks() { if (!document.getElementsByTagName) return; var anchors = document.getElementsByTagName("a"); for (var i=0; i<anchors.length; i++) { var anchor = anchors[i]; if ( anchor.getAttribute("href") && ( (anchor.getAttribute("rel") == "external") || (anchor.getAttribute("rel") == "external nofollow") ) ) anchor.target = "_blank"; } } // Attach this function to the window.onload event. addLoadEvent(externalLinks);

You'll also have to add these 2 lines **IN THIS ORDER** between the <head></head> HTML tags :

Code: Select all: <script type="text/javascript" src="../js/AddEventsAtCompletion.js"></script> <script type="text/javascript" src="../js/ExternalLinks.js"></script>

Now when you specify rel="external" or rel="external nofollow" as an anchor atrtribute in the HTML of your posts/pages,
and/or
<target_url_rel>external</target_url_rel> or <target_url_rel>external nofollow</target_url_rel> in the FCG XML file, when clicked, these links will open in a new window/tab.

You'll have to make this modification yourself.
I'm not adding this to the previous code above because it might not be what everyone wants. And it is different behaviour than the original FCG.

Good luck with it.
Robert

Enhanced FCG. New, 3rd input source is XML file.

Enhanced FCG. New, 3rd input source is XML file.

Re: Enhanced FCG. New, 3rd input source is XML file.

Re: Enhanced FCG. New, 3rd input source is XML file.

Re: Enhanced FCG. New, 3rd input source is XML file.

Who is online

FCG Links

Blogs, WordPress & More

More Links