Support » Plugin: Simple Staff List » link to Staff Member page

  • Resolved mpmchugh

    (@mpmchugh)


    So, I notice that in the admin, when you View Staff Member you get a page displayed using single.php.

    Is there a way to set a template instead? (like :single-{posttype}.php)

    What is the Staff Member post-type?

    If so, are there template tags to pull in the other data fields? By default it only shows the image and the title. Can this be done with standard post-type template tags?

    I’m trying to figure out a way of using Easy Fanybox’s iframe ability to show the Staff Member’s page when their image is clicked. (we’re already using Easy Fancybox for a few other things).

    I guess I’d also need a [staff-page-url] tag too somehow, then.

    I was thinking of using Easy Fancybox’s ability to show inline content instead, but it requires each hidden div to be shown to have a different ID, though I guess I could use the [staff-name-slug] for the div ID.

    Just thought of that, but I’m curious if the iframe method described above would also work somehow with a custom template.

    Thanks,
    Michael

    http://wordpress.org/extend/plugins/simple-staff-list/

Viewing 15 replies - 1 through 15 (of 28 total)
  • Actually, I was able to fully implement this using the following template, loading the bios via inline fancybox overlays:

    [staff_loop]
    <a href="#[staff-name-slug]" class="fancybox staffBox"><img class="staff-member-photo" src="[staff-photo-url]" alt="[staff-name] : [staff-position]">
    	<div class="staff-member-info-wrap">
    		[staff-name-formatted]
    		[staff-position-formatted]
    	</div></a><div style="display:none" class="fancybox-hidden"><div id="[staff-name-slug]" style="width:640px;">
    <h3 class="staff-member-name">[staff-name] <span> — [staff-position]</span></h3>
    <img class="staff-member-photo-overlay" src="[staff-photo-url]" alt="[staff-name] : [staff-position]">[staff-bio-formatted]
    </div></div>
    [/staff_loop]
    Plugin Author Brett Shumaker

    (@brettshumaker)

    Awesome. Glad you got that worked out. But yes, you should be able to use a single-{posttype}.php as a template for a single staff member. You should also be able to piece together a link to a single staff member using something like: http://{your-website-name}/staff-members/[staff-name-slug].

    I’m about to post on your other question in a few minutes.

    Thanks! Just posted a review too. This plugin saved me a lot of work.

    Plugin Author Brett Shumaker

    (@brettshumaker)

    Thanks! I really appreciate it!

    I’m not quite following how this actually was done. The reason why I’d like to see individual pages working is because this is also important for site search (i.e. WordPress site search brings up the staffers, and I’d like the staff landing page to look good). Can you give the detailed instructions on how to get this done? I’m very comfortable with PHP, but not very knowledgeable about WordPress.

    Plugin Author Brett Shumaker

    (@brettshumaker)

    Hey Alex,

    What you’ll need to do is duplicate your theme’s single.php file and name it single-staff-member.php and then when someone accesses a single staff member page it’ll use that template (template hierarchy).

    Then, to access and display the Staff Member data inside single-staff-member.php, you’ll need to do something like:

    $custom = get_post_custom();
    $name = get_the_title();
    $name_slug = basename(get_permalink());
    $title = $custom["_staff_member_title"][0];
    $email = $custom["_staff_member_email"][0];
    $phone = $custom["_staff_member_phone"][0];
    $bio 	= $custom["_staff_member_bio"][0];

    ,etc

    You can always just use print_r($custom) to see all the custom fields.

    Let me know if this helps.

    Thank you! It worked like a charm. I was also able to easily add the custom properties I added to the schema to that page.

    The only remaining question is how to get the photo to render on that page – can you help out?

    Plugin Author Brett Shumaker

    (@brettshumaker)

    Hey alex,

    You can get the photo url like this:

    if(has_post_thumbnail()){
    	$photo_url = wp_get_attachment_url( get_post_thumbnail_id() );
    	$photo = '<img class="staff-member-photo" src="'.$photo_url.'" alt = "'.$title.'">';
    }

    Worked like a charm! Thank you!!

    Hey mpmchugh,

    I used the code you provided on my template and when I click on the name it pops up but if i X out and then try, it actually brings up a screen shot of the screen I’m on…any idea? Check it out at http://dev.ussailing.org/index.php/about-us/board-of-directors/

    AJ

    (@akwasiijunior)

    Hi, i got the plugin to read the single-staff-member.php page but im having problems displaying the information. Can anyone paste their single-staff-member.php ?

    AJ

    (@akwasiijunior)

    Ok Nichelabs posted this in another thread, thanks mate
    >> http://wordpress.org/support/topic/custom-post-template-for-single-staff-member?replies=3

    I havent tried it yet though but it looks good so far.

    <?php
    		global $post;
    		$custom 	= get_post_custom();
    		$name 		= get_the_title();
    		$name_slug	= basename(get_permalink());
    		$title 		= $custom["_staff_member_title"][0];
    		$email 		= $custom["_staff_member_email"][0];
    		$phone 		= $custom["_staff_member_phone"][0];
    		$fax 		= $custom["_staff_member_fax"][0];
    		$bio 		= $custom["_staff_member_bio"][0];
    		$prof 		= $custom["_staff_member_prof"][0];
    		$fb_url		= $custom["_staff_member_fb"][0];
    		$tw_url		= 'http://www.twitter.com/' . $custom["_staff_member_tw"][0];
    		$li_url		= $custom["_staff_member_li"][0];
    		if(has_post_thumbnail()){
    
    			$photo_url = wp_get_attachment_url( get_post_thumbnail_id() );
    			$photo = '<img class="staff-member-photo" src="'.$photo_url.'" alt = "'.$title.'">';
    		}else{
    			$photo_url = '';
    			$photo = '';
    		}
    		$email_mailto = '<a href="mailto:'.antispambot( $email ).'" title="Email '.$name.'">'.antispambot( $email ).'</a>';
    ?>

    Thanks AJ. You save my day. I have been really frustrated with this but looks like I am getting close. I have successfully created the single staff page. But still having trouble modifying the staff default template.

    Here is my overall template:

    <?php get_header(); ?>
    
    	<div id="page-full">
    
    		<?php while (have_posts()) : the_post(); ?>
    
    			<?php if ( has_post_thumbnail() ) { ?>
    
    				<?php the_post_thumbnail('staff-full', array( 'class' => 'shadow' ) ); ?>
    
    			<?php } ?>
    
    			<h1><?php the_title(); ?></h1>
    
    global $post;
    		$custom 	= get_post_custom();
    		$name 		= get_the_title();
    		$name_slug	= basename(get_permalink());
    		$title 		= $custom["_staff_member_title"][0];
    		$email 		= $custom["_staff_member_email"][0];
    		$phone 		= $custom["_staff_member_phone"][0];
    		$fax 		= $custom["_staff_member_fax"][0];
    		$bio 		= $custom["_staff_member_bio"][0];
    		$prof 		= $custom["_staff_member_prof"][0];
    		$fb_url		= $custom["_staff_member_fb"][0];
    		$tw_url		= 'http://www.twitter.com/' . $custom["_staff_member_tw"][0];
    		$li_url		= $custom["_staff_member_li"][0];
    		if(has_post_thumbnail()){
    
    			$photo_url = wp_get_attachment_url( get_post_thumbnail_id() );
    			$photo = '<img class="staff-member-photo" src="'.$photo_url.'" alt = "'.$title.'">';
    		}else{
    			$photo_url = '';
    			$photo = '';
    		}
    		$email_mailto = '<a href="mailto:'.antispambot( $email ).'" title="Email '.$name.'">'.antispambot( $email ).'</a>';
    
    			<?php } ?>
    
    			<?php the_content();?>
    
    				<?php endwhile; ?>	
    
    	</div><!-- #page-full -->
    
    <?php get_footer(); ?>

    Question now is where does this code go in the following default staff template? Here is what I have but still could not apply:

    [staff_loop]
        <strong><a href="http:{mywebsite}"></a></strong><div class="staff-member-info-wrap">
    		[staff-position-formatted]
    	<img class="staff-member-photo" src="[staff-photo-url]" alt="[staff-name] : [staff-position]">
    		[staff-name-formatted]
    		[staff-bio-formatted]
    		[staff-email-link]
    	</div><strong></strong>
    [/staff_loop]

    My additions are in bold letters. Any help will be appreciated.

    Hi h2ofilters,

    This has nothing to do with the default template. That’s for the shortcode.

    For the single Staff Members page itself, you need to use the variables defined in the template itself, so save the code below as “single-staff-member.php” in your template directory.

    Note the areas I commented. The variables can be dropped into the loop using snippets like <?=$bio?>. Just replace the variable name for each and wrap in what ever containers and classes you need to define your layout.

    Note I added t_ in front of a few of the variable names to prevent conflicts in my theme, but either should work.

    -Michael

    <?php get_header(); ?>
    <?php
    		global $post;
    		$custom 	= get_post_custom();
    		$t_name 		= get_the_title();
    		$name_slug	= basename(get_permalink());
    		$title 		= $custom["_staff_member_title"][0];
    		$email 		= $custom["_staff_member_email"][0];
    		$phone 		= $custom["_staff_member_phone"][0];
    		$fax 		= $custom["_staff_member_fax"][0];
    		$bio 		= $custom["_staff_member_bio"][0];
    		$prof 		= $custom["_staff_member_prof"][0];
    		$fb_url		= $custom["_staff_member_fb"][0];
    		$tw_url		= 'http://www.twitter.com/' . $custom["_staff_member_tw"][0];
    		$li_url		= $custom["_staff_member_li"][0];
    		if(has_post_thumbnail()){
    
    			$t_photo_url = wp_get_attachment_url( get_post_thumbnail_id() );
    			$t_photo = '<img class="staff-member-page-photo" src="'.$t_photo_url.'" alt = "'.$title.'">';
    		}else{
    			$t_photo_url = '';
    			$t_photo = '';
    		}
    		$email_mailto = '<a class="staff-member-email" href="mailto:'.antispambot( $email ).'" title="Email '.$name.'">'.antispambot( $email ).'</a>';
    ?>	
    
    	<div id="page-full">
    
    		<?php while (have_posts()) : the_post(); ?>
    
    			<h1><?php the_title(); ?></h1> <!-- This is the Standard page title -->
    
    			<h3><?=$title?></h3> <!-- This is the Staff Memeber Title -->
    
    			<?=$t_photo?> <!-- This is the Staff Memeber Photo -->
    
    			<p><?=$bio?></p>  <!-- This is the Staff Memeber Bio -->
    
    			<?php the_content();?>
    
    				<?php endwhile; ?>	
    
    	</div><!-- #page-full -->
    
    <?php get_footer(); ?>

    Thanks for taking the time to look into this. I removed all the t_ and saved the code as a staff-page.php but I encountered the following server error:

    Internal Server Error
    The server encountered an internal error or misconfiguration and was unable to complete your request.

    I checked all the codes and I couldn’t not see any unclosed tags.

Viewing 15 replies - 1 through 15 (of 28 total)
  • The topic ‘link to Staff Member page’ is closed to new replies.