Thread Starter
HiImRack
(@cre8tivesense)
Also… please excuse my lack of proper terms used. I’m a bit new to all this.
where can I find the (li list) loop for comments? I’m having trouble find out where that odd and even (class) list is pulling from.
this will depend on your theme; more recent themes use ‘wp_list_comments()’ which does all the li elements with the css classes.
http://codex.wordpress.org/Function_Reference/wp_list_comments
some themes (such as Twenty Ten, and Twenty Eleven) use a callback function in ‘wp_list_comments()’ which you would find in functions.php of the theme. there you would have more influence how the li elements are styled.
it might also be a good idea if you could describe what you are trying to achieve with the odd/even classes.
Thread Starter
HiImRack
(@cre8tivesense)
Thank for your response alchymyth.
What I’m trying to do is make a more “stylish” comment area for a blog page. I’m using a theme which (I believe) is using calls from the Twenty Ten theme. So when someone posts a comment it starts this loop (per say) with:
<li id=”li-comment-1″ class=”comment even thread-even depth-1″>
Then if someone leaves a comment or reply it shows:
<li id=”li-comment-2″ class=”comment odd alt thread-odd thread-alt depth-1″>
What seems to happen, when more comments are posted it creates a new (li id) and causes the styling to look weird.
I hope this makes more sense. I’ll take a look at the codex you sent to see if I can find something.
Thanks again.
Thread Starter
HiImRack
(@cre8tivesense)
I see… So it’s located in the functions.php file? Well, I found it in my themes functions.php file š
I think I’m good at this point. If I have any more questions, I’ll be sure to post them.
Thanks again alchymyth
Thread Starter
HiImRack
(@cre8tivesense)
Well I cant seem to get it working. But I think I found something that can help.
This is what I found in the functions.php file:
<li <?php comment_class(); ?> id=”li-comment-<?php comment_ID(); ?>”>
This line seems to output this in html:
<li id=”li-comment-1″ class=”comment even thread-even depth-1″>
But I cant find what outputs this in html:
<li id=”li-comment-2″ class=”comment odd alt thread-odd thread-alt depth-1″>
Looks like I need to find the function that controlls the (comment even thread-even depth-1) ad (comment odd alt thread-odd thread-alt depth-1)
Any suggestions on how I should go about this?
comment_class() does the output of the ‘(comment even thread-even depth-1) ad (comment odd alt thread-odd thread-alt depth-1)’
http://codex.wordpress.org/Function_Reference/comment_class
What seems to happen, when more comments are posted it creates a new (li id) and causes the styling to look weird.
for each comment, it will add a new li element; for threaded comments (if you selected that in the dashboard) it will create a new level of an unordered list (probably with the css class .children) with more li elements.
unless you re-write the whole comment function, this is as it is.
most of ’causes the styling to look weird’ can possibly be corrected with changes to style.css.
if you like, you can post a link to your site to illustrate your problem.
however, this is very much just a css problem, and has primarily nothing to do with wordpress.
Thread Starter
HiImRack
(@cre8tivesense)
I see… Thanks for the link. It helped me find out where this was located. So let me ask you this (for my education)
What would be the best way to style the comments area if using a blank theme (per say)? I mean at most just to add some space in between the comments?
But I see what your saying because this everything I’m reading looks like it CSS is the problem.
Here is a link to the comments post with the issue:
http://cre8tivesense.com/redev/blog/hello-world/
Thank you,
Shad
CSS is the problem.
yes – there is a lot you can do to style the comments, just using css.
the comment list formatting right now is done with:
#single ol li {
float: left;
margin-left: 25px;
width: 775px;
list-style-type: none;
}
i.e. no special spacing in the comments list.
try and add, for example,
margin-bottom: 20px;
to create a bit of space between comments.
Thread Starter
HiImRack
(@cre8tivesense)
lol…. That simple! You are good. Now if I just wanted to make an indent or spacing on the left of reply’s, for that to work I would need to create a new class?
Now if I just wanted to make an indent or spacing on the left of reply’s, for that to work I would need to create a new class?
the comments code would create the css class – could be ul.children li or li.depth-2 or .comment li –
you would need to read this css class or this arrangement of css selectors from the html output of a threaded comment, and add a corresponding style to your stylesheet – possibly something with margin-left: 10px; or similar.
Thread Starter
HiImRack
(@cre8tivesense)
Nice! I think I can manage to get this going…. finally!!!! š Thank you very much for your time and education alchymyth.
Take care,
