Modifying the look of a post

  • rainsmom

    (@rainsmom)


    10 years, 10 months ago

    I’m customizing Blocomo, a child theme of Twenty Twelve. I have set it up with a static front page, but on that static front page, I have inserted an excerpt of my latest blog post.

    The static front page is page-templates/front-page.php. It “calls” the excerpt from content-fpage.php.

    I want to modify the look of the excerpt and its title — change the font, reduce font size, and indent them about an inch — but only on this front page.

    1. In my stylesheet, do I precede my changes with the name of the static front page (.template-front-page) or with the name of the page it calls from (.content-fpage ??)

    2. The title of the excerpt is h2. Would the body be p?

    Here’s the page I’m working with.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter rainsmom

    (@rainsmom)

    10 years, 10 months ago

    Nevermind. I managed to figure this one out on my own! (Miracles DO happen!)

    Thanks anyway!!

    Michael

    (@alchymyth)

    10 years, 10 months ago

    do I precede my changes with the name of the static front page

    the theme uses body_class() which outputs template and page specific css classes;

    try using a browser inspection tool to find out.

    the same for the excerpt …

    or without a inspection tool, use ‘View source’ in your browser to look at the html code which is generated by your site.

    for the body tag, you find:

    <body class="home page page-id-701 page-template page-template-page-templatesfront-page-php custom-background template-front-page custom-font-enabled">

    there you have all css classes you could possibly use to precede the new css – just distinguish between the general and specific ones.

    for the excerpt, you’ll find:

    <div class="entry-content">

        <div class="post"><h2><a href="http://www.clickersolutions.com/wordpress/latest-post-for-front-page/">Latest post for front page</a></h2>
<p>If I ...you both you and your [...]</p>
</div>

    so a suitable specific css for formatting the excerpt text could be:

    .template-front-page .entry-content .post p { ... }

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Modifying the look of a post’ is closed to new replies.