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 :)
28 Aug at 7:42 pm
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. :)
28 Aug at 8:38 pm
^ 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.
29 Aug at 12:44 am
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: “”;
}
29 Aug at 12:59 am
I never thought that it would be that hard. I would like to know what plugin you use for your related posts, though.
29 Aug at 3:09 am
That’s how I did mine, except with pixel units. I really should change that since everything else uses “em”… :/
29 Aug at 8:19 am
I’m not using commas, but I float:left instead because I wanted display:inline-block but IE sucks. Meh.