Comma Separated Link List
A thread at some random forum asking how you make your WordPress links look like "this, this, this" popped up in my tutorialtastic referrers, so I figured I'd post how I do it here.
Firstly, you'll want to alter the way WordPress displays the links. I do so using the following snippet:
<ul class="inlinelist">
<?php wp_list_bookmarks('category=##&after=.</li>&title_before=0&title_after=0&categorize=0&title_li'); ?>
</ul>
...where ## is the id of my links category; swap the after=. to after=, for a comma separated list.
Note the inlinelist class on the <ul> tag: this is how I make it appear as if it's a paragraph instead a long list. I simply style the tag using CSS. This'd go in your stylesheet as follows:
.inlinelist {
list-style: none;
margin: 0 0 1.5em 0;
}
.inlinelist li {
display: inline;
}
If you haven't reset the "padding-left" on <ul>s earlier in your CSS, you'll want that as:
.inlinelist {
list-style: none;
margin: 0 0 1.5em 0;
padding-left: 0;
}
.inlinelist li {
display: inline;
}
...to make sure it displays the same in all browsers (because some indent links with padding, and some with margin) too.
That's it. Not very complicated 
Comments (6)
Leave a Comment
No HTML (it will be stripped); first time comments are moderated; comments left without a legitimate first name or nickname will be deleted (no, your momma didn't call you "cheap quality wardrobes").
On Thu 28th Aug 2008 @ 20:42, Vasili said:
If I ever need to make something comma separated and I can access it with PHP, I'll turn it into an array and implode() it with a comma.
On Thu 28th Aug 2008 @ 21:38, Rachael said:
^ Why would you go to that trouble though when WP has the built in feature?
I don't manage my links through WP. Maybe I should start doing it.
On Fri 29th Aug 2008 @ 01:44, Jenny said:
You can also do it with plain CSS, if you don't care that some older browsers won't add the commas:
.inlinelist li:after {
content: ",";
}
.inlinelist li:last-child:after {
content: "";
}
On Fri 29th Aug 2008 @ 01:59, Aaron said:
I never thought that it would be that hard. I would like to know what plugin you use for your related posts, though.
On Fri 29th Aug 2008 @ 04:09, Hannah said:
That's how I did mine, except with pixel units. I really should change that since everything else uses "em"...
On Fri 29th Aug 2008 @ 09:19, Vickie said:
I'm not using commas, but I float:left instead because I wanted display:inline-block but IE sucks. Meh.