Support » Themes and Templates » Comments layout

Comments layout

  • I’ve been searching (without luck) a way to make comments stand out. For example I was thinking about adding a frame to each comment entry with something like this:
    border-top: #808080 1px solid;
    border-left: #808080 1px solid;
    border-right: #808080 1px solid;
    border-bottom: #808080 1px solid;
    Unfortunately I can’t find the place in the wp-layout.css where to add the lines.
    Where can I find info about that? Is there any other way to make comments stand out?
    Thanks a lot.

Viewing 9 replies - 1 through 9 (of 9 total)
  • I *think* you can do this by messing with;
    ol#comments li p {
    font-size: 100%;
    as that covers the ordered list that comments appear in.
    I’ve not figured that out properly though.
    I’d recommend opening a comment up, and viewing the source to see the structure and working back from that.

    This is odd.
    There is no css for ‘comment’
    I can add the boxes and see perfect results in my css editor, but not live.

    your solution works great. I just couldn’t guess it because my default wp-layout.css doesn’t have the tags you showed in your post, so I didn’t have anything to modify (unless I retroenginered the wp-comments.php of course). I wonder if there’s any complete doc to the wp-layout.css.
    Any clue?

    By Nuclear Moose:
    My contribution:
    (When I figure out comments, I’ll add it 🙂 )

    Yeah, I already knew that 2. Let us know whe you figure out comments! 🙂

    I don’t know if it’s sacrilege to change the comment template but I got rid of the list tags and put the comments in their own <div>’s. Eventually, I want to add a third div to float in comment area with the post count. To do that I will need to learn a little bit of PHP (initialize the count=1 in the “if” statm then in the “for each” count++….I think?).

    Like Alan, I ditched the bullets by giving #olcomments a list-type: none.
    Then created a div in my CSS for the comments:

    #hisses {
    font-size: 13px;
    color: #000;
    background: gainsboro;

    In the wp-comments.php template:

    <?php if ($comments) { ?>
    <?php foreach ($comments as $comment) { ?>
    <div id="hisses">
    <id="comment-<?php comment_ID() ?>">
    <?php comment_text() ?></div>

    So each comment has a grey background but the comment author info is white, making each stand out.

    Oh, and BTW, I got my idea from reading Venomous Kate’s source code. 🙂

    Tee hee. 😉

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Comments layout’ is closed to new replies.
Skip to toolbar