Change color bar under Staff Image

Support Area Forums United Change color bar under Staff Image

Tagged: 

Viewing 7 posts - 1 through 7 (of 7 total)
URL to the page in question:
  • Author
    Posts
  • #16899
    Ashley Davis
    Participant

    Hi Bill,

    Just a few more questions for today.
    How/where can I change the color of the bars under the staff images?
    Is there any way to put my text AFTER/BELOW the staff images? (See: http://servingyourpurpose.com/staff/)

    THANKS!
    Ashley

    #16906
    Bill Robbins
    Moderator

    Ashley,

    Great question. I don’t believe I have a built-in option to change those. So here’s what to do:

    1. Go to the Theme Options page and select the Styling tab.
    2. Scroll down to the Custom CSS box and paste this:
      
      .staff-image {
      	border-color: #000;
      }
      
      .tax-staff-group article.type-staff,
      .page-template-templatespage-staff-php article.type-staff {
      	background-color: #dddedd;
      }
      
    3. The top style there sets the border color--the color between the image and the text area. The second style sets the color of the area behind their names.
    4. Update your settings.

    See if that won't take care of it for you.

    Have fun,
    Bill

    #16910
    Ashley Davis
    Participant

    Thanks! The color change worked great!

    Now, is there any way to make their photos ABOVE my text? Seems the default coding somewhere is to add them below any text I type on the page with the Page Attributes “Staff List Template”

    Thanks again,
    Ashley

    #16919
    Bill Robbins
    Moderator

    You could edit the theme. Here’s how to do that:

    1. Go to the Appearance section in your WordPress control panel and select Edit.
    2. From the list of files on your right, choose page-staff.php
    3. Find this section:
      
      		<div class="clearfix">
      		
      			<h1><?php the_title(); ?></h1>
      			
      			<?php the_content(); ?>
      		
      		</div>
      	
      

      and move down to just below this:

      <?php endwhile; ?>

    4. Save your changes.

    That should move the main text for the page down below the list of your staff. Hope that helps out.

    Thanks,
    Bill

    #16927
    Ashley Davis
    Participant

    Didn’t seem to work. http://servingyourpurpose.com/staff/ 🙁

    This is what my code looks like now.

    get_header(); ?>

    #16929
    Bill Robbins
    Moderator

    Let’s try it like this. Here’s the full page:

    See if that doesn’t make things upside down.

    #16931
    Ashley Davis
    Participant

    Works like a charm!

    Thanks Bill!

Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Change color bar under Staff Image’ is closed to new replies.