• Hi

    I would like to highlight a specific teaser/preview of an article, on the blog front page so it stands out from the rest.

    I tried determining the font color as I was composing the article, but this only works if you open the full article, but for the front page article teaser, where all previews have the theme’s set color.

    How can I set this? I only want this to affect 1 or 2 teasers of specific articles & not all and whether the 2 are sticky or not.

    I also tried without success to use what I thought is the article ID as seen with Firebug by adding
    #post-34198 {color: red;} or .post-34198 {color: red;} to the style, but it did not help. I am not a coding expert! ??

    Thank you in advance

Viewing 7 replies - 1 through 7 (of 7 total)
  • Hi there!

    If I understand you correctly, you want to change the colour of the text of certain post excerpts on the blog page, is that right?

    Can you tell us which theme you are using?

    Thread Starter xprt007

    (@xprt007)

    Hi ??

    I am using the Mesocolumn theme.

    Yes, I would like to make 1 or 2 specific blog posts excerpts easily noticeable.
    The problem is this:
    I wrote one particular article a couple of months ago, & even making it sticky, merely places it at the top, yet, the content pulled by some RSS script (non-WP) changes everyday. I fear some readers, just see the old date without bothering to read the content, since the post according to the date is old.

    I thought I would additionally make it look a bit different, from the rest, like by changing the teasers font & or the background color, but only for the 1, 2 or so specific posts (which I am also not sure how to direct the code to address).

    As mentioned adding some code in the text body, or the CSS of the non-WP RSS code only changes the color but IF the post is fully opened, but NOT to the front page teaser, where I actually need the effect. I could not determine what in the CSS sets the color (text/background) for the teasers on the blog front page.

    Thank you for your assistance

    Hi again!

    Ok so I downloaded the Mesocolumn theme and I was able to make a few blog excerpts on the page noticeable using the following code at the bottom of style.css:
    #post-1178, #post-1241 {
    background: lemonchiffon;
    }
    #post-1178 div.entry-content,
    #post-1241 div.entry-content{
    color: tomato;
    font-size: 1.25em;
    }

    I’m sure you’ll want to use different styling – I just wanted to make sure it would standout! ??
    Here’s what it looks like.

    I don’t know if you’re using a child theme to make your code changes – but if you simply want to alter the appearance (styles.css) like in the above example, you could achieve the same result by using the Jetpack plugin and activating the Custom CSS module. (It will appear in your dashboard, under Appearance > Edit CSS.) Either method (child theme or JetPack’s Custom CSS module) will enable you to make styling changes without worrying about these being wiped out during the next upgrade.

    Hope this helps!

    Thread Starter xprt007

    (@xprt007)

    Hi

    Just what I was looking for! ??
    Thank you very very much.
    I am using the code in a child theme.
    One more question, though which I miserably failed to solve. How about the title of such an article as well?

    I installed the Jetpack module & intend to look at it later, because it seems to be very interesting with really lots of functions & needs some time to study it. The site already has a good number of plugins, including buddypress & bbforum on a shared hosting & I hope adding such would increase resource use noticeably.

    Once again, thank you for taking the time to look into this.

    Regards

    Hi there!

    Here’s what I did re: a simple style change to the title:
    `

    #post-1241 h2 a,
    #post-1178 h2 a {
    color: green;
    }

    Here’s what it looks like at this point.

    Hope that does the trick! Happy WordPressing! ??

    Thread Starter xprt007

    (@xprt007)

    Hi

    For some reason I had to add the !important attribute to make it work. I do now have all the modification I needed.

    Many thanks for your very detailed help. ??

    Regards

    Hmm – interesting about needing the ‘!important’. I’ll look into it.

    Glad it worked out! ??

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Making a specific post teaser on blog frontpage have a different font color’ is closed to new replies.