Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I did have a similar problem with this but never managed to find a solution...

I have a custom post-type with a number of pages, but what I want to do is grab a particular div from the pages and display them in a Fancybox when I link to them. Here is the HTML:

about.php - this page has the fancybox links, so I want the links on this page to grab the div from another page called single-team.php:

        <ul id="teamScroller" class="jcarousel jcarousel-skin-tango">
        <?php $teamFeed = new WP_Query(array('post_type' => 'team', 'orderby' => 'name')); ?>
        <?php while ($teamFeed->have_posts() ) : $teamFeed->the_post(); ?>
        <li class="teamItem">
            <?php if (has_post_thumbnail( $post->ID )): ?>
                <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' ); ?>
                <a href="<?php the_permalink() ?>" rel="bookmark" class="teamThumb" title="<?php the_title(); ?>"><img src="<?php bloginfo('template_directory'); ?>/thumbs.php?src=<?php echo $image[0]; ?>&w=71&h=71&zc=1" alt="<?php the_title(); ?>" /></a>
            <?php endif; ?>
            <a href="<?php the_permalink() ?>"><h2 class="redSubHeader teamThumb"><?php echo substr($post->post_title,0,50); // short title ?>...</h2></a>
        </li>
        <?php endwhile;?>
    </ul>

single-team.php - This is the content I want to display in the Fancybox div on about.php. single-team.php has other elements within it, but I've just pasted the code I was to grab here...

<section>
    <div id="productMainPanel">
        <h1 class="bottomBorder"><?php the_title(); ?></h1>
        <?php if (has_post_thumbnail( $post->ID )): ?>
            <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' ); ?>
            <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><img src="<?php bloginfo('template_directory'); ?>/thumbs.php?src=<?php echo $image[0]; ?>&w=640&h=157&zc=1" alt="<?php the_title(); ?>" /></a>
        <?php endif; ?>
        <?php while (have_posts()): the_post(); ?>
            <?php the_content(); ?>
        <?php endwhile; ?>
    </div>
</section>

And of course, the jquery:

$(document).ready(function() {
    $('a.teamThumb').live('click', function(e){
        e.preventDefault();
        var url = $(this).attr('href');
        url = url + ' #productMainPanel';
        $('#productMainPanel').load(url, function(data, stat, req){
            $(this).fancybox();
        });
    })


});

Does anyone know how I can get this to work? Because so far, it's either just linked straight to the page or it's opened up the Fancybox but displayed the entire single-team.php page.

Thanks

share|improve this question

1 Answer 1

up vote 2 down vote accepted

Remove the get_header(), get_footer(), and get_sidebar() references from single-team.php.

share|improve this answer
    
Thank you Jamal, funnily enough, this was one of the first things I tried, but it didn't seem to work! I must have changed something in the jquery at the same time. But thank you anyway, that's fixed it! –  remi90 Sep 30 '11 at 10:10

Your Answer

 
discard

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.