WordPress.org

Ready to get started?Download WordPress

Forums

How to modify Post Title? (8 posts)

  1. lazerbud
    Member
    Posted 9 years ago #

    I've tried and couldn't figure out which CSS tag to modify in style.css to change the look of Post titles on my page, but couldn't :(

    Could someone point me to what I should be tweaking in style.css? Thanks!

  2. c0y0te
    Member
    Posted 9 years ago #

    I'm relatively new around here myself, but have been playing with the CSS files a lot in the last week or so.

    Depending on which theme you are using this may vary, but basically you need to find the section in Index.php which processes your content, and determine which "Class" its using. Then find that class in the CSS sheet and away you go.

    For example, with my theme the post titles are using a class of "post" and H2 as headers. Therefore in the CSS sheet I look for "H2" and ".post" in the CSS sheet and make the necessary changes.

    I'm sure someone far more qualified can give a more detailed answer, but that's my trial and error way; hope it's useful.

    c0y0te

  3. CanuckKev
    Member
    Posted 9 years ago #

    After looking at your source code, I see this:

    <h2 id="post-8">

    Thats what you need to look at in your CSS. the H2 and post-8 tags.

    There is also a Bold around the title from your template, and the <a> tag comes into effect as well.

  4. Jinsan
    Member
    Posted 9 years ago #

    post titles can be modified (font etc right) by changing the .title attribute in the css

  5. lazerbud
    Member
    Posted 9 years ago #

    Actually, it's the h2.pagetitle tag in the CSS that needs to be modified. However, I can't seem to add a border or anything with this tag. Just change the size and type of font.

    Could anyone throw some more light on this please?

  6. lazerbud
    Member
    Posted 9 years ago #

    no one?

  7. Ming
    Member
    Posted 9 years ago #

    CSS is applied by the most specific rule. Even though your title is surrounded by <h2> it's more specifically surrounded by <a> for your link.

    So edit h2 a { border: 1px solid #000; }
    You can also change the various states of a link like this:
    h2 a:visited { border: 1px solid green; }
    h2 a:hover, h2 a:active { border: 1px solid red; }

    That will change the border on your title text to black if it's a normal link, green if the person has already visited it and red if they hover their mouse over the link.

  8. Root
    Member
    Posted 9 years ago #

    And for further functionality you can add display: block.; if you insist :)

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.