Tweaking New Age 1.0 theme
-
I just changed my website over to the New Age Theme which I like but I’d like to make it so the 2 sidebars are different colors so they don’t blend together or have a separator line, but I can’t figure out how to do that/where to change the background color in the css. I’d also love to add a Facebook fan box but it requires 200pixels and the sidebars are less than that. Thoughts? The website is http://www.feministpeacenetwork.org.
-
Try editing style.css and changing:
#blog_right #sidebar #sidebar_left { float:left; width:51%; }
to
#blog_right #sidebar #sidebar_left { background:#fff; float:left; width:51%; }
Substitute the color you want for #fff.
Esme, thank you, I’ll try that. I managed to change the ratio of width between the 2 sidebars but I need a little more width and was trying to figure out how tonarrow the width of the post so the sidebars had a larger percentage of the total. I changed the number of pixels in each, but that didn’t do it. Any clues?
Also, no matter where I specify a picture should go when I embed it, it ends up on the left. Sometimes I want it on the right 🙂 This seems very odd.
Other than that, I really like this theme, way less glitches than some of the others.
Forget the above (except the thanks!), still working on it, more to follow.
Esme, thank you that worked. I’ve done that and made some other changes and would love some feedback! The 2 big things I still don’t like are:
1–I’d like the sidebar background colors to go all the way to the bottom of the page instead of just ending where their content ends and
2. I want to change the link color so that links stand out from the text but can’t figure out where that is in the style sheet.1. You and about 99% of all web designers! 🙂 The only way to extend the sidebar background beyond the sidebar itself to the bottom of the page is to fake it. The trick is to use a page background image that includes the coloured areas for the sidebar (sometimes called “faux columns”). so the sidebar doesn’t have a color of its own but lies on top of a background column that is the right width.
Can be a little harder to pull off sometimes than it sounds.
2. style.css. Look for:
#blog_right #sidebar li a { color:#474747; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px; font-weight:normal; line-height:19px; text-decoration:none; }
Simply removing
color:#474747;
will cause the sidebar links to default to #000.Esme,
Okay, will forget the faux column lol. Other than that these sidebars now look MUCH better imho. On the posts themselves I’d like to change the linked text to red so it stands out, but couldn’t figure that out.The other thing that is strange is that no matter where I put in pictures, they end up on the left??
In the CSS I gave above, try changing
color:#474747;
tocolor:#800000;
. That should give you a dark red link.With rgard to your images:
.item_class img, #blog_comm img { float:left; margin:5px; }
is the offending block in style.css that is forcing all images to be left-aligned. Try getting replacing it with:
.alignleft { float:left; } .alignright { float:right; } img.alignleft { margin:0 20px 20px 0; } img.alignright { margin:0 0 20px 20px; } img.aligncenter,.aligncenter { float:none; display:block; margin:0 auto; } img.alignnone,.alignnone { float:none; margin:0; }
The problem is that it also changes the links in the sidebar and darn near everything in the sidebar is a link so it is too much red. I was hoping to just turn the links in the posts themselves red, but maybe that is hoping for too much?
Won’t be able to get back to this for a few days (real work calls!)but I’ll fix the image code then. You have been so much help, thank you!
Sorry – I misunderstood.
Try adding:
.item_class_text a {color:#800000;)
to your stylesheet. That should just affect links within posts.
Where should I insert it? I tried just below other .item_class lines but it didn’t do anything?
Try adding it right at the bottom. If that doesn’t work, post back here and I’ll try and have another look tomorrow.
Yes and no. if it is just a link it turns red. But if I bolded it and made it into a link which I sometimes do for emphasis, it stays black. You can see what I mean if that doesn’t make sense at http://www.feministpeacenetwork.org.
Try deleting:
.item_class strong, #blog_comm strong { color:#000000; }
Finally got back to this–it all worked. Thank you so much for all your help!
- The topic ‘Tweaking New Age 1.0 theme’ is closed to new replies.