Twenty Eleven, How to change background color of featured posts

  • Hi,

    I’m using a childplan of twenty eleven, and have customized my page color. However my static front page and featured posts show as white on the home page. I’d like them to also have the same customized page color that I selected, but can’t workout what code I need to add to my .css. I’ve searched these forums to no avail, can anyone help?

    Also I want to change the heading “Featured Post” to “Featured Artical”, change the font type and color, and add a background box around that heading of a different color, does anyone know how to do these modifications?

    I saw this one blog (and can’t find it again unfortunately) where their “Featured Post” heading background box (I don’t even know the correct term) wrapped back around the edge of the page and it looked awesome! If anyone can tell me how to do that I would be thrilled, but I’ll take what I can get!

    My site is https://esotericwisdom.cu.cc

    Thanks in advance!!

Viewing 7 replies - 1 through 7 (of 7 total)

  • I’d like them to also have the same customized page color that I selected, but can’t workout what code I need to add to my .css. I’ve searched these forums to no avail, can anyone help?

    So, to have a different color page, you’d have to do this with css.. kind of complicated. In wordpress, under pages, then when you hover over edit, there is a little address of the page id. For example, “post=78” or whatever the number of your page is.

    Then in your css. Add an element for that page… for example:

    .page-id-78 {
    background-color: #fff;
    }

    Also I want to change the heading “Featured Post” to “Featured Artical”, change the font type and color, and add a background box around that heading of a different color, does anyone know how to do these modifications?

    So to change it to “featured article” go under the appearance tab and browse to various php files and use “find” to find the text “featured post” and change that to “featured article.” For the other stuff you want to change, change the following css element to what you want:

    .featured-posts .showcase-heading

    Let me know if you still need help… prolly didn’t explain some of that very well.

    I find my self having something custom on a lot of home pages. I often use php. Read this>>

    You could then add that in the body tag:

    <body <?php
if (is_front_page())
{?>

style="background: red;"

<?php } else { ?>

style="background: blue;"
<?php } ?> >

    …tell WordPress if the page is the home page or front page, make the body background one color, if not then set the other color.

    Thread Starter GnosticGirl

    (@gnosticgirl)

    Thanks so much for your replies guys!

    I entered this to my Style CSS, but unfortunately it didn’t work:

    .page-id-116
background-color: #FFFFF2;
}

    I am not familiar with php so have no clue what I am doing! But anyway I found the featured post section in the showcase.php file of Twenty Eleven. So my attempt to change the wording ‘featured post’ to ‘featured article’ I made a showcase.php file in my childplan, and added the following:

    <div class="featured-posts">
					<h1 class="showcase-heading"><?php _e( 'Featured Article', 'twentyeleven' ); ?></h1>

    Unfortunately this replaced my entire site with a blank page, with the words ‘Featured Article’. Then I removed my code and then was left with a blank page, so I removed the showcase.php page all together and my site went back to normal.

    Obviously I’m doing it wrong!

    I want the background to always be #FFFFF2 for all posts (including featured and the home page) so no ‘else’ statements are needed. (By the way the page is called HOME).

    This is the code I think is needed for the background of the home page, but as I said I am not familiar with php and after I messed it up the first time I think I need some more instruction – I don’t want to alter the original template, I want to make the changes in the child plan. Please help! 

    <body <?php
if (is_page('HOME'))
{?>
style="background: #FFFFF2;"
<?php } ?> >
    Thread Starter GnosticGirl

    (@gnosticgirl)

    Sorry, THIS is what I entered in to my CSS (but it still didn’t work)

    .page-id-116 {
background-color: #FFFFF2;
}

    Hi GnosticGirl…

    If you’re just wanting to change the BG of the featured posts section, you would actually need to do something a little bit different than what’s been described above.

    For starters, let’s tackle the easier of the two requests, which is changing the wording of “Featured Post” to “Featured Article”…

    Copy the showcase.php file from your parent-theme into the child theme.

    Now open the file and find the line where you wanted to replace “post” with article, make the edit, save, and upload. That should take care of that little change.

    To get rid of the white background, simply add this line to the bottom of your child theme’s style.css file:

    .featured-posts section.featured-post {
    background: transparent;
}

    Give that a go and let me know if it solved your problem.

    – Greg

    Thread Starter GnosticGirl

    (@gnosticgirl)

    Datdesignguy, you rock! The transparent code worked for the featured post background color, and coping the entire the showcase.php file from my parent-theme into the child theme and then making the title change worked perfectly. Thank you very much!

    Now all I need to figure out is how to change the static home page background color and then it will be consistant throughout.

    I’d also like to change the font type and color of the ‘Featured Article” heading, and add a background box around that heading of a different color, would I do this in the css file or the showcase.php file?

    Thread Starter GnosticGirl

    (@gnosticgirl)

    Does anyone know how to change the static home page background color? It is white and I want to change to to match the rest of the site . My site again is https://esotericwisdom.cu.cc (I’m referring to the area housing the text “Explore the ancient esoteric techniques we teach today….”)

    Thanks!

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Twenty Eleven, How to change background color of featured posts’ is closed to new replies.