how to style single post and page titles

[sido]

I am trying to style my .single .entry-title (http://www.youmeandfivebucks.com/free-to-be-me/) and my .page .entry-title (http://www.youmeandfivebucks.com/about/) to look like the .entry-title and .widgettitle on my homepage (http://www.youmeandfivebucks.com/) --meaning the titles have a lined background with a white background behind the text. Can anyone help? I've been driving myself crazy for the past two days trying to figure it out. Thank you!

http://www.youmeandfivebucks.com

[Jan Ruehling]

Hello Sido,

you are missing a sub-class in the title on your singleposts / -pages.

Code Homepage:

<h2 class="entry-title">
 <a href="http://www.youmeandfivebucks.com/free-to-be-me/" title="free to be me" rel="bookmark">free to be me</a>
 </h2>

Code other pages:

<h1 class="entry-title">
 About
 </h1>

The .entry-title has the striped background ... but the white background in the middle comes from the <a> - tag ... and that's missing in #2

You have to edit your loop (single.php && page.php) to

1) add an <a> tag around the title (

<h1 class="entry-title"><a>About</a></h1>

)  ... this is an ugly solution since the color will change as clickable link on hover ... OR

2) add a <span> around the title (

<h1 class="entry-title"><span>About</span></h1>

) and style it in your (Child)theme style.css:

.entry-title span {
 background: white;
 } 

OR

3) add a <span class="white"> around the title and add this in the style.css

.white {
 background: white;
 }

Example loop-change solution #3:

In single.php of your (child)theme (create if it does not exist):

<?php
 function jr_change_post_title() {
 ?>
 <h1 class="entry-title"><span class="white"><?php the_title(); ?></span></h1>
 }
 remove_action('genesis_post_title', 'genesis_do_post_title);
 add_action('genesis_post_title', 'jr_change_post_title');

/* Other code here */

genesis();

Hope that works for you ...

[sido]

Thank you so so much, Jan! I tried option #2, which worked perfectly in getting the white background on all post/page titles just the way I want. I added the following code to the genesis_post_title_hook :

<h1 class="entry-title"><span><?php the_title(); ?></span></h1>

The only problem that came up now is that the post titles on my homepage are not permalinks anymore. Any way to fix that?

[Jan Ruehling]

<?php

function jr_change_post_title() {
  if(  is_home() == false  ) {
   echo '<h1 class="entry-title"><span><?php the_title(); ?></span></h1>';
 } // end if statement 
} // end function
remove_action('genesis_post_title', 'genesis_do_post_title);
add_action('genesis_post_title', 'jr_change_post_title');
 
/* Other code here */
 
genesis();

[Jan Ruehling]

Ok ... wrong thought:

Try this:

function jr_change_post_title() {
   echo '<h1 class="entry-title"><span><?php the_title(); ?></span></h1>';
} // end function
if(  is_home() == false  ) {
    remove_action('genesis_post_title', 'genesis_do_post_title);
    add_action('genesis_post_title', 'jr_change_post_title');
} // end if statement

/* Other code here */

genesis();

[Author]

Posts