3 replies [Last post]
Invader_Stu
Invader_Stu's picture
Offline
newbie
Last seen: 7 years 31 weeks ago
Timezone: GMT+2
Joined: 2013-04-11
Posts: 2
Points: 3

Hello everyone

I was hoping someone might be able to help me with a wordpress template problem I’m trying to work out. I’m redesigning my blog at the moment and I want a certain look for the category and other lists in my side bar. So far I’ve not found a way to do it but I’m sure there must be a way.

The look I’m trying to achieve is this:

But what I am getting is this:

I want the lines to be between each entry in the list and I want the bullet points to be gone.

At the moment this is the code I am using in the page...

(div class="sidebar_devider")
(?php wp_list_cats('sort_column=name&list=1&hide_empty=1&show_count=1'); ?)
(/div)

... and in my css style sheet.

.sidebar_devider {
width:180px;
height: auto;
float: left;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color:#9db1cf;
}

Obviously this does not work because the sidebar_devider is around the code that creates the category list but I just don’t know how to get it between each entry in the list.

I’d be very grateful to anyone who can help.

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 46 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

but I just don’t know how to

but I just don’t know how to get it between each entry in the list.

Puzzled By styling the generated list how else! Have you actually looked at the generated markup produced by this function, if you do you'll see that it provides all the classes or ID's to work from that you'll need.

Also I'm guessing you've copied that WP function from somewhere as it's been long deprecated, you mustn't use deprecated functions they are only there for legacy purposes you should use this one:

wp_list_categories()

Look it up on the WP codex as you'll find a full list of args that it will accept.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Invader_Stu
Invader_Stu's picture
Offline
newbie
Last seen: 7 years 31 weeks ago
Timezone: GMT+2
Joined: 2013-04-11
Posts: 2
Points: 3

I'm not really sure how to

I'm not really sure how to style the generated list. I'm still a novice to making web design and I'm learning things as I go. Are their any examples any where I could follow? I've tried a few things suggest by other people and I've still not been able to get them to work.

This has been my latest attempt as suggested by someone else:

(ul class="categories-list"(
(?php wp_list_categories('sort_column=name&title_li=&hide_empty=1&show_count=1'); ?)
(/ul)

ul.categories-list {list-style-type: none;}
.categories-list li {border-bottom: 1px solid #ddd;}

... but nothing changed.

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 46 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Use a web dev tool such as

Use a web dev tool such as Firebug to examine what rules are being applied or overridedn by others styles from elsewhere.

Failing that you are going to need to provide a link.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me