WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I'm building a portfolio WordPress. It only displays image thumbnails, with a video element that call the fancybox. In the <a> tags, the attributes have the information for the fancybox to load the content. The "href=" is the url of the video to show, the "title=" is the title of the post, etc.

I want to somehow bring the content of the post to the fancybox window and display it as the title (caption under the video).

My approach so far has been to bring the content of the post into the <a> tags and then passing than content into the FBox.js file.

I've brought the post content (the_content) to a custom attribute for <a>, eventid= and also have brought it to INSIDE the <a></a> tags.

I've got that working: the post content are loaded in the index page both as the "eventid=" attribute and as the text inside the <a> tags.

This is how the Fbox calling element is loaded inside the WordPress loop in the index.

<a class="thumbnail-frame excerpt-text <?php 
if($video_url !='' || $embeded_code != '') : 
?>" <?php 
if($video_url !='' || $embeded_code != '') : 
?><?php else: 
?>rel="set-<?php the_ID(); ?>"<?php 
endif; ?> href="<?php 
if($video_url !='' || $embeded_code != '') : 
?>#embed-<?php the_ID(); ?><?php 
else: ?><?php echo $upload_image_1; ?><?php 
endif; ?>" title="<?php the_title(); ?>" eventid="<?php the_content(); ?>"><span class="post"><?php 

However, I'm still having trouble in sending that text into the FBox JavaScript plugin so that the content is grabbed from the index and loaded in the Fbox.

The most I've done is:

 'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
 return '<span id="fancybox-title-over">' + jQuery("a.video").html() + '</span>';

That posts the content of the FIRST post only inside the Fbox (it gets the content of the first a.video element it finds).

I've tried with

 'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
 return '<span id="fancybox-title-over">' + jQuery(this).html() + '</span>';

But it returns a null or undefined value and it prints it in the Fbox.

I'm stuck, I don't know how to grab the specific text content for each post and bring it into the FBox. I was thinking maybe using a global variable?

I'm a student so I'm clearly super novice, I just really want to surpass this obstacle.

The blog is hosted here: http://realitynext.heliohost.org/wordpress/

share|improve this question
It seems easier to just use iframe fancyboxes. I wouldn't try passing the entire post content + formatting via JS. – Tomas Buteler Oct 12 '12 at 1:01
up vote 0 down vote accepted

This is how i got it working:

'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
  return '<span id="fancybox-title-over">' + jQuery(currentArray[currentIndex]).html() + '</span>';
share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.