Staff Bios Look

Support Area Forums Responsive Visual Staff Bios Look

Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
URL to the page in question: http://www.grassrootschurch.info
  • Author
    Posts
  • #22845
    Steven Bill
    Participant

    Hi again Bill – you may get sick of me after a little bit. I apologize in advance for this.

    Is it possible to change the look of the staff bios? I’m not a huge fan of the massive images and then the squished text. Even if we could scale those images down and allow for formatting to actually take place in the text (i.e. para breaks, etc.) that would help.

    Ideally the staff bios from the epic template would be great.

    Let me know what I might have to do for this.

    Thanks a bunch!
    Steve

    #22849
    Bill Robbins
    Moderator

    Hey Steve,

    This one is actually not too hard for us to change. As long as the height of the image is set to be 465 pixels tall, you can make the width to be anything you want as long as it is 720 pixels wide or smaller.

    The way WordPress crops images, it will scale them down until either it reaches the set width or height of an image size. It’ll then crop the other dimension off at that point.

    So if we set our image to be the prescribed height (465 pixels in this case), then we can use any width we want.

    I’ve attached a screenshot to show how the demo’s staff page would look if I set the top staff person’s image to be 438 pixels wide by 465 pixels tall. It’ll leave more room for their bio text that way too.


    The drawback to the option above is if you want to use the image format for your staff, you’ll end up with an oddly shaped and too small image as the background. So I would suggest altering the image size that appears on the staff listing so it won’t affect the featured image for the individual staff member.

    To do that you’ll need to edit the images.php file (Appearance > Edit in your WordPress control panel). Then in this line:

    
    add_image_size('portrait-small', 720, 465, true);
    

    change the 720 to the width you’d like to have the image be and save your changes.

    See how that works for you. Let me know if you need any help.

    Have a great weekend,
    Bill

    #22860
    Steven Bill
    Participant

    Hi Bill,

    Okay, this is good. But take a look at http://www.grassrootschurch.info/about/staff/ – each of the profile pics are 438px x 465px and yet they do not line up with each other visually. You’ll see what I mean when you check it out. But if not, I’ve attached a print screen to show you.

    Also, let’s say I didn’t want to make the profiles clickable – how could I turn that off? And remove the “Read more” and just have all the bio info show up on this page. Is that possible?

    Also, is it possible to display staff according to the staff type they’re in? I.e. I’d like to just set up subpages of staff into the different types and have them go directly there. Let me know if this is something we can accomplish.

    And one more thing on this staff bio – any way I might be able to add little | between Facebook Twitter and Email? So like this: (807) 630-9176 | Email | Twitter | Facebook

    I guess if I were to remove the “Read More” I could just do it manually. But let me know what you think.

    Thanks again Bill for your prompt responses. Really appreciate this!
    steve

    PS – I changed the images.php to be: add_image_size(‘portrait-small’, 400, 465, true);
    Another question: If I extend the width of the sheet, should I also extend the width of the slider?

    #22893
    Bill Robbins
    Moderator

    You can have multiple lists of staff. What you’ll want to do is use staff groups to organize them. They work like categories do for posts. You can then add the staff groups directly to your navigation menu instead of using the staff page template. That will give you multiple pages of staff with them grouped accordingly.

    Any chance you could send over a login so I can take a look at the backend of things for your staff images? You can mark a reply in the form as private and I’ll be the only one who has access to it.

    Thanks,
    Bill

    #22895
    Steven Bill
    Participant
    This reply has been marked as private.
    #22899
    Bill Robbins
    Moderator

    Steven,

    Thanks for sending that over. It looks like the Regenerate Thumbnails plugin just needed to be run. That seems to have made the images nice and uniform for us at last.

    You can remove the link in your staff member’s names and also allow the full text to be displayed with a bit of editing. Here’s how:

    1. Go to the Appearance section in your WordPress dashboard and choose Edit.
    2. From the list of files on your right, choose archive-staff.php and find this line:
      
      <a href="<?php the_permalink(); ?>" rel="bookmark"><?php the_post_thumbnail( 'portrait-small' ); ?></a>
      
      

      and change it to be like this:

      
      <?php the_post_thumbnail( 'portrait-small' ); ?>
      
    3. Change this line:
      
      <h2 class="title"><a href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
      

      to be like this:

      
      <h2 class="title"><?php the_title(); ?></h2>
      
    4. And lastly change this line:
      
      <?php the_content_limit(400, "Read More"); ?>
      

      to be like this:

      
      <?php the_content(); ?>
      
    5. Save your changes.

    You’ll also need to repeat that for the taxonomy-staff-group.php file if you plan on using staff groups.

    See how that comes together.

    Thanks,
    Bill

    #23019
    Steven Bill
    Participant

    Bill, when I went to change the archive-staff.php, I had no problems. However, when I went to change taxonomy-staff-group.php all that it had on it was this: <?php get_template_part( 'archive-staff' ); ?>

    So what do I need to change there? If anything?

    #23022
    Bill Robbins
    Moderator

    Steven,

    My apologies…nothing to change there then.

    Bill

Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Staff Bios Look’ is closed to new replies.