How to add a class?

  • Ichirei


    I need to modify the CSS class “.post .entry” differently for the Home and other pages, but I can’t do it because they use the same class, so if I change that, I’ll change even the other pages where I don’t want the change. Is there any way to add another class so I can customize differently the posts in Home and the other pages?




    Try using

    #home .entry-content {}

    (This is untested)

    Do you mean .post .entry? I think it will need to be .entry-content.

    What, exactly, are you wanted to change?



    So, I’ll try to explain better (with the small amount of english that I know XD).

    My first intention was to move the date on the left, outside the main content, and I did it –>

    Now I want to give more horizontal space to the post, so I added “margin-left: -60px” to the “.post .entry” of the style.css, and now it looks OK! –>

    But when I go to a page, since pages don’t have date, the space is already full horizontally, so my modification margin-left: -60px to the .post .entry gives this result –>

    So, the home looks ok, pages not, because both use he .post .entry CSS class, so my question is: how can I modify the posts in home, but not those in pages? The only thing that comes in my mind is to create a new class, but I can’t do that because WordPress doesn’t let me change the HTML. Maybe I could do this with PHP, but I know nothing about PHP 🙁

    Any idea, please?



    I see you are working on a localhost. Do you have a live version of the site where I can “play” with it?



    Remove what you modified… and try adding this to your child theme stylesheet (or custom css box in admin panel):

    .post .date {
    margin-left: -60px;
    .post {
    padding: 25px 15px 20px 30px;

    That should knock the date icon over to the left, and also adjust the content area to the left by 40 pixels. (original left padding was 70px)



    NOTE: You can also set your date to display as inline, rather than an icon, which will also give you more space in the content area.

    appearance -> graphene options -> “display” tab -> Posts Display Options

    Under “post date display”… choose “as inline text”.



    I did it! Thanks again, Josh!

    I played a little with the padding, and then changed the width value in .two-columns .post



    Great!! You’re very welcome.

    (Marking thread as Resolved)

Viewing 8 posts - 1 through 8 (of 8 total)

  • You must be logged in to reply to this topic.
Graphene Themes Forum