Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Brandon Stiles
Brandon Stiles
12,305 Points

Custom WP theme: After two hours, I can't get the_content() to change color!

Hey guys! I've run into a small problem coding my own WP theme from scratch (with a static Home page and a separate Blog page), and I feel like it's a simple fix: After about 2-3 hours of research and pouring through forums, I can't change the font-color of my blog posts (after I click them). So I have a two-part question:

  1. Why can't I get the_content to change color on my single.php page? Here's my code:
<?php
    get_header();
    the_post(); 
    if ( has_post_thumbnail() ) {
        the_post_thumbnail('large');
    }
?>  
<div class="">
   <div class="container">
        <h2 class="white-text light" style="margin:0;">
            <?php the_title();?>
        </h2>
        <h5 class="white-text" style="margin:0 0 7% 0;">
            <?php the_author();?>
        </h5>
        <p class="black-text" style="color:black !important;">
            <?php the_content();?>    
        </p> 
    </div>
</div>

<?php
    get_footer();
?>

My second question:

  1. Am I even doing this right?? It displays fine on my local development, but am I doing this all in the correct way? Basically, I have a front-page.php that displays my Home Page. Then I have an index.php that shows the main blog page with small excerpts. Then, when a user clicks on a single blog post to open it, the individual post is shown with the single.php template. Is this right?

Thank you SO much for your help!

3 Answers

Joe Schultz
Joe Schultz
6,191 Points

Are you linking to the single.php file? If so, you need to use the anchor <a> tag. If you just want to change the color of the text after clicking on it, you will need to style the tag like this:

<style>
  h2:active {
      color: orange;
  }
</style>

This is done as an inline style. It is better practice to actually put this statement in your css file. However, you can put this in your code to see if it works, and then add it to your css file.

Not sure if this answers your question, but I hope it gets you going in the right direction. :)

Brandon Stiles
Brandon Stiles
12,305 Points

Hey Joe Schultz ! Thanks for the reply- I think it gets me a little closer.

Basically what's happening is on my single.php page (which I'm using to design my individual blog posts), I've put 'the_title();' in an <h2>, 'the_author();' in an <h5>, and 'the_content();' in a <p>. I've also told each of those elements to show as black text. However, only the <h2> and <h5> change to black text. When I inspect it with Dev Tools, what's happening is WP is ignoring my hard-coded <p>, and creating new <p> of its own WITHOUT the black-font formatting I

If a reference would help, you can see it here: www.uptowndownentertainment.com/blog

Thanks for looking!!

Joe Schultz
Joe Schultz
6,191 Points

Ok, looking at the page did help. It looks like your 'the_content();' has paragraph tags <p> in it. Those tags do not have any style or class attributes to them. So what you could do is style the <p> to display the black text. Like this:

<style>
        p {color: black;}
</style>

You can put this code in before you display the 'the_content();' line. Of course this is not "best practice", but you can see if it will work. Once you have it the way you want it, you might want to create a new css stylesheet with these styles that the page can include.