WordPress.org

Ready to get started?Download WordPress

Forums

Formatting Best Practices - CSS Edits, Post edit..? (5 posts)

  1. markaaron
    Member
    Posted 1 year ago #

    Hi all,

    I have some nice content, and I'd like to brush up on the formatting of my WordPress blog posts. Specifically I feel the default theme of my site (Max Magazine) is too condensed.

    How would I get more line-spacing after my <h2>'s? and in my general paragraph copy? I tried some light editing of the the style.css and adding more to the line-height affected the front page as well. Thoughts?

    See my test site with Max Magazine template with some lorem ipsum posts in the style I'd like to use:
    http://www.pencilsforsale.com/2013/04/24/post-2/

    I like the formatting style this wordpress blogger uses here, what do you guys think? http://www.copyblogger.com/formatting-wordpress-posts/

    Best practices or quick fix for this situation?

    Thanks,
    Mark

  2. simple1
    Member
    Posted 1 year ago #

    Mark,

    I personally find justified text hard to read online. Justifying introduces "rivers", or gaps of space within paragraphs that can be distracting to read. You might have picked up the justified style when you copied and pasted the lorem ipsum. You'll notice that the copyblogger.com example left justifies its paragraphs, which are a little easier on the eyes to follow.

    As for space after the title tag you could add a margin to the bottom to push the paragraph that follows it further down.

    Hope that helps.

  3. markaaron
    Member
    Posted 1 year ago #

    Hi Simple, thanks for the reply. I'm seeing left-justified is the way to go, so I fixed that.

    Otherwise, what about the best way to get better spacing with this theme? It's Max Magazine theme, and if I add bottom margin after h2 tags, it makes the homepage funky. Is there a way to just increase spacing on the posts and not the homepage?

  4. JohnPope
    Member
    Posted 1 year ago #

    Try adding the bottom margin to

    .post-entry h2

    instead of just

    h2
  5. markaaron
    Member
    Posted 1 year ago #

    Thanks, could you show me specifically how to code it?: Here's what I"m looking at:

    }

    #content .post .sticky{
    font-size:12px;
    background:#f2f2f2;
    padding:4px 6px;
    letter-spacing:1px;
    display:inline-block;
    line-height:1;
    border-bottom:1px solid #eee;
    }

    #content .post,
    #content .page{
    overflow:hidden;
    margin-bottom:15px;
    }

    #content .post .post-entry{
    overflow:hidden;
    }

    #content .post-meta .sep{
    margin:0 5px;
    }

    #content .post .author{
    overflow:hidden;
    }

    #content .post .author h3{
    margin-bottom:5px;
    }

    #content .post .author .avatar{
    float:left;
    width:50px;
    margin-top:5px;
    }

    #content .post .author .author-meta{
    margin-left:60px;
    }

Topic Closed

This topic has been closed to new replies.

About this Topic