Jump to content
Sign in to follow this  
policyschool

How do I change the color of my boxes

Recommended Posts

mackenzie    12
mackenzie
I would recommend looking at the site using FireFox with FireBug installed. This allows you to select the section of the website to locate the code for that section. Once you find the name of the box you can create CSS code (http://www.w3schools.com/css/css_background.asp) for changing the background color. Here's a generic example: [code].box ( background-color: #F0F0F0; }[/code]

Mackenzie - PageLines Help Desk

The Centsible Family - Writer, Photographer and Coffee Addict

---------------------------------------------------

Kindly search this forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

Share this post


Link to post
Share on other sites
policyschool    0
policyschool
Do I enter the code at the bottom of the CSS code directly in Firebug or do I do it in wordpress?

Share this post


Link to post
Share on other sites
Jenny    33
Jenny
You add your custom code to WP -> PageLines -> Settings -> Custom Code -> Custom CSS

Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
Jenny    33
Jenny
Firebug is more of a "live preview" for changes so you can see how things look before adding them to your theme.

Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
policyschool    0
policyschool
I'm still having some trouble. The three boxes on my homepage seem to be named fbox_1404, fbox_1407 and fbox_1409, I entered the code: .fbox_1404 ( background-color: #F0F0F0; } using several different hex codes and I did not notice a change even after clearing my cache. I tried fiddling with the code a little bit but my knowledge of CSS is very limited. Could someone recommend a bit of code that would work?

Share this post


Link to post
Share on other sites
Rob    547
Rob
Here's the solution I came up with: [code].grid-element, .media_overview { background: none repeat scroll 0 0 #F0F0F0; margin-bottom: 12px; }[/code] Add that to Custom Code > CSS rules. The boxes may show some need for padding inside the backgrounded area.

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
Rob    547
Rob
Just an FYI, version 2.1.3 includes a new setting for the feature sliders in Dashboard > PageLines > Meta and in posts at PageLines Meta Settings > Features. It requires you to set the nature of your sliders... such as whether the size is dynamic or static. You'll need to visit your site's sliders because I'm seeing compression in a slider found here: http://nuweb9.neu.edu/dukakiscenter/?page_id=204

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
policyschool    0
policyschool
The color worked perfectly, how do I add padding to the text inside of the boxes, I noticed that adding "margin-left: 3px;" to the given code increases the spacing between the boxes.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×