WordPress.org

Ready to get started?Download WordPress

Forums

Simple Staff List
Single Staff Member page (10 posts)

  1. mintymurray
    Member
    Posted 5 months ago #

    Hi Guys,

    Love this plugin, we use it on our infonet site at work. I have a small problem with the single staff page though. It only shows the name and photo of the staff member, not the job title, phone number etc.

    The URL follows this format:
    http://www.mysitename.com/wp/?staff-member=john-smith

    I have read a couple of the threads in here about editing the single staff member page, to add more info to it that page...

    I am lost! I am a newb when it comes to editing css.

    Is there a step by step guide an what I need to edit and where?

    Thanks in advance.

    https://wordpress.org/plugins/simple-staff-list/

  2. mintymurray
    Member
    Posted 5 months ago #

    Shameless bump..

  3. mintymurray
    Member
    Posted 5 months ago #

    goodness, I didn't think I was asking too much..

  4. mintymurray
    Member
    Posted 5 months ago #

    OK, so I have tried to help myself, but it still isn't working.

    I have created the single-staff-member.php in my themes folder, and pasted the following code in (including the existing code from single.php):

    <?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 class="staff-member-email" href="mailto:'.antispambot( $email ).'" title="Email '.$name.'">'.antispambot( $email ).'</a>';
    ?>
    <?php get_header(); ?>
    
    	<div id="wrap">
    		<div id="content">
    
    		<?php if (have_posts()) : while (have_posts()) : the_post();
    
    			get_template_part( 'loop', 'single' );
    
    		endwhile; ?>
    
    		<?php endif; ?>
    
    		<?php comments_template(); ?>
    
    	</div>
    
    		<?php get_sidebar(); ?>
    	</div>
    <?php get_footer(); ?>

    I have then changed the 'Staff Loop Template' to the following:

    [staff_loop]
    <div class="staff-member-container">
    <a href="http://www.mini-3.co.uk/internal/wp/[staff-name-slug]"> [staff-name-formatted]
    <img class="staff-member-photo" src="[staff-photo-url]" alt="[staff-name] : [staff-position]"></a>
     <div class="staff-member-info-wrap">
     [staff-position-formatted]
     </div>
     </div>
    [/staff_loop]
    <div style="clear:both;"></div>

    And the Staff Page CSS to:

    /*  div wrapped around entire staff list  */
    div.staff-member-listing {
    
    }
    
    /*  div wrapped around each staff member  */
    div.staff-member {
    	padding-bottom: 2em;
    	border-bottom: thin dotted #aaa;
    }
    
    /*  "Even" staff member  */
    div.staff-member.even {
    
    }
    
    /*  "Odd" staff member  */
    div.staff-member.odd {
    	margin-top: 2em;
    }
    
    /*  Last staff member  */
    div.staff-member.last {
    	padding-bottom: 0;
    	border: none;
    }
    
    /*  Wrap around staff info  */
    .staff-member-info-wrap {
    	float: left;
    	width: 70%;
    	margin-left: 3%;
    }
    
    /*  [staff-bio-formatted]  */
    div.staff-member-bio {
    
    }
    
    /*  p tags within [staff-bio-formatted]  */
    div.staff-member-bio p {
    
    }
    
    /*  [staff-photo]  */
    img.staff-member-photo {
    	float: left;
    }
    
    /*  [staff-email-link]  */
    .staff-member-email {
    
    }
    
    /*  [staff-name-formatted]  */
    div.staff-member-listing h3.staff-member-name {
    	margin: 0;
    }
    
    /*  [staff-position-formatted]  */
    div.staff-member-listing h4.staff-member-position {
    	margin: 0;
    	font-style: italic;
    }
    
    /* Clearfix for div.staff-member */
    div.staff-member:after {
    	content: "";
    	display: block;
    	clear: both;
    }
    
    /* Clearfix for <= IE7 */
    * html div.staff-member { height: 1%; }
    div.staff-member { display: block; }

    When I navigate to the single person page, it looks the same as it did before.
    If I remove the code that is in the single.php from the single-staff-member.php and then refresh the staff member page, it is blank. So at least I know the changes have affected something.

    Any help to get this last bit sorted would be amazing!

  5. Roberto Tenil
    Member
    Posted 4 months ago #

    I'm having the same problem.

    Can anyone help us?

  6. Byzantine.Woman
    Member
    Posted 4 months ago #

    Same issue! driving me nuts. The only possible solution I can think of right now is creating a group for each individual but.... that is just ridiculous.

  7. mintymurray
    Member
    Posted 4 months ago #

    I was hoping we would have received some input from the creator by now :(

    It is clearly possible, we just need a few pointers!

  8. Byzantine.Woman
    Member
    Posted 4 months ago #

    In a 3 monthago post, the creator offered a possible update later using an ID to generate the single page...

    http://wordpress.org/support/topic/show-individual-member-of-staff-from-list-by-id?replies=9
    Excerpt:
    "for example: to show the list you use [simple-staff-list]

    maybe something like [simple-staff-list id="1"]"

    That would be perfect. I am trying to allow professors be selected and searched (SEO) on their own away from their groups.

  9. Byzantine.Woman
    Member
    Posted 4 months ago #


  10. jilleryfregan
    Member
    Posted 4 months ago #

    Mintymurray's attempt is close, but this might help more:
    These calls get all the fields, but they can be placed in the entry-content area of your single-staff-member.php template.

    I copy/pasted my page.php (using twenty thirteen theme) and used your variable setting, then echoed out those values in the content area.

    <?php
    /**
     * The template for displaying staff member pages
    **/
    
    get_header(); ?>
    
    	<div id="primary" class="content-area">
    		<div id="content" class="site-content" role="main">
    
    			<?php /* The loop */ ?>
    			<?php while ( have_posts() ) : the_post(); ?>
    
    				<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    					<header class="entry-header">
    						<?php if ( has_post_thumbnail() && ! post_password_required() ) : ?>
    						<div class="entry-thumbnail">
    							<?php the_post_thumbnail(); ?>
    						</div>
    						<?php endif; ?>
    
    						<h1 class="entry-title"><?php the_title(); ?></h1>
    					</header><!-- .entry-header -->
    
    					<div class="entry-content">
    		<?
                    //GET THE VARIABLE CONTENT FROM STAFF LIST
    		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];
    		if ($custom["_staff_member_tw"][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 class="staff-member-email" href="mailto:'.antispambot( $email ).'" title="Email '.$name.'">'.antispambot( $email ).'</a>';
    ?>
    	<div id="wrap">
    		<div id="content">
    <?
    //HERE ECHO OUT THOSE FIELDS, ONLY IF THEY EXIST
    if ($title){ echo 'Title: '.$title.'<br />'; }
    if ($email){ echo 'Email: <a href="'.$email.'">'.$email.'</a><br />'; }
    if ($phone){ echo 'Phone: '.$phone.'<br />'; }
    if ($fax){ echo 'Fax: '.$fax.'<br />'; }
    if ($bio){ echo 'Biography: '.$bio.'<br />'; }
    if ($fb_url){ echo 'Facebook: '.$fb_url.'<br />'; }
    if ($tw_url){ echo 'Twitter: '.$tw_url.'<br />'; }
    ?>
    
    		<?php comments_template(); ?>
    
    	</div>
    						<?php wp_link_pages( array( 'before' => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentythirteen' ) . '</span>', 'after' => '</div>', 'link_before' => '<span>', 'link_after' => '</span>' ) ); ?>
    					</div><!-- .entry-content -->
    
    					<footer class="entry-meta">
    						<?php edit_post_link( __( 'Edit', 'twentythirteen' ), '<span class="edit-link">', '</span>' ); ?>
    					</footer><!-- .entry-meta -->
    				</article><!-- #post -->
    
    				<?php comments_template(); ?>
    			<?php endwhile; ?>
    
    		</div><!-- #content -->
    	</div><!-- #primary -->
    
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>

    This shows the name, the image as a thumbnail, and all fields if they exist.

Reply

You must log in to post.

About this Plugin

About this Topic