Complete n00b needs help please! – Sidebar formating (probably very easy!)

I think the smartest way to do it would be to insert some code into the stylesheet to control the look and feel of that particular unordered list.

Unfortunately, the answer to your question is a bunch of lines of code, code that would need to be placed at the bottom of your current stylesheet.

If you are just looking for a basic adjustment, this will remove the bullet points, the indent and update the font size and color of the lists in your sidebar:

Open your Admin Dashboard. Go To Appearance >> Editor. Scroll down to the bottom of the page under “Styles” and you will see a Stylesheet with the filename of style.css.

Click on that file, scroll all the way down to the bottom of the theme file, and add this snippet of code:

#main .widget-area ul ul {list-style:none;margin-left:0px;font-size:16px;}
#main .widget-area ul ul li a{color:#235570;}

A word of caution: These are the themes core files, so be careful editing stuff in here. Keep a back up in case you need to reload the theme.

This code is just a quick snippet to help clean up the list. You can add it, and if you don’t like it, erase it and save the file again and it will go back to where it was before. I haven’t tested it but it should do the trick if you add it to the bottom of the stylesheet.

Beyond that, WordPress Publishing is great for the just about everyone, but if you are not at least partially versed in CSS, styling themes is going to be extremely difficult for you and I’d recommend looking to hire someone for it.

Oturia, this is AWESOME. Thanks so much!!! The code response was fine cos you explained what to do with it – super helpful, I really appreciate it.

We are a non-profit society, so unfortunately paying someone to do this is out of the question for now – I’ve gotta learn to do it myself, or it won’t get done. I’m very happy to learn, I just don’t know where to start.

Any recommendations for good resources for a beginner to learn some basics for CSS?

I modified the code you gave to be this:

#main .widget-area ul ul {list-style:none;text-align:center;font-size:16px;}
#main .widget-area ul ul li a{color:#235570;}

So that the text is now centered within the sidebar. How would I go about increasing the line-spacing, making the font bold, and possibly even adding a little line like in the old site?

Answers to any of these 3 questions on their own, either by giving more code, or letting me know a good resource to teach myself would be awesome.

Thanks again for your help!

Also, are there any unforeseen issues to the change I made?

Thanks!

Nope, those changes were safe.

I would recommend browsing the CSS tutorials available online. The easiest way to learn is to search in a string like this:

css change hover color

or

css make text bold

You will usually find the results quite fast.

Now, on to your questions:

line spacing can be adjusted by line-height: 1232px; or however high you want it. So for a 16px font, you could use a 19px line-height:

#main .widget-area ul ul li a{color:#235570;
line-height:19px;
font-weight:bold;
border-bottom:2px solid #037c2f;
}

This should get you started in the right direction. Don’t forget to mark the post as resolved.

Good luck!!!

Thanks, I really appreciate it!