[Janet]

I upgraded to CK Pro specifically for more color and format options. I’ve made great progress but there are still a few places where I can’t change the colors. I’ve been through every menu option I found. As far as I can tell there are no blue or white settings still listed anywhere. I’m obviously missing something because the page clearly still includes blue and white:

* In the text box that displays on top of the slider image (the text itself is from the Posts where the Slider images are)
* At the bottom where the Copyright text is
* The thin lines separating the footer areas

I also can’t find where to change the remaining white text — I believe it’s in a footer area (directly beneath the featured images)

An additional issue is the size of the header — there’s a huge amount of white space and it pushes my images and contact button off the bottom, requiring scrolling to see them.

Please help. Here’s my page: http://www.chisholmtrailballroom.com

[Sakin]

@Janet: Yous site looks nice.

1. In the text box that displays on top of the slider image (the text itself is from the Posts where the Slider images are)
— For this I have added the color to match your menu. So, it will be like below. But if you want to change then you can change the color code in following css as per your need and add it in “Appearance => Theme Options => Custom CSS” box.

#main-slider .entry-container {
	background-color: #7c0212; /* Show a solid color for older browsers */
	background-color: rgba(124, 2, 18, 0.6);
}
#main-slider .entry-container:hover {
	background-color: #7c0212; /* Show a solid color for older browsers */
	background-color: rgba(124, 2, 18, 1);
	border-color: #6d1c28;
}
#main-slider {
	border-color: #6d1c28;
}

2. At the bottom where the Copyright text is
— For this you can change from “Appearance => Theme Options => Color Options => Site Color Options” and change it from “Footer Background Color”

3. The thin lines separating the footer areas
— You can change the border color as per your need and add it in “Appearance => Theme Options => Custom CSS” box.
#colophon { border-color: #6d1c28 }
— Also for border color below Homepage headline.
#homepage-message { border-color: #6d1c28 }

4. The size of the header is large because of your long menu overflow.
4.1 You can either build custom menu from “Appearance => Menus” and then assign menu location to “Secondary” from “Appearance => Menus => Manage Locations” and then disable your header right sidebar from “Appearance => Theme Options => Header Options”
4.2 Or if you want to keep this menu, then you can change the padding as per your need and add it in the following css and add it in “Appearance => Theme Options => Custom CSS” box.

.header-sidebar { padding-top: 50px; }
#hgroup-wrap { padding-bottom: 50px; }
#site-logo, #hgroup { padding-top: 50px; }

[Janet]

Thank you Sakin! Three things remain:

1. I checked the “Appearance => Theme Options => Color Options => Site Color Options” –> “Footer Background Color” and I do have it set to #d5d3b8 (the beige background the other areas use). Unless I am looking at the wrong place, but I followed down as you described.

2. I reduced the text in the top level menu options but the space did not close up. I’d really like the menu to be “to the right of” (at least appear that way) the logo. The space could be 1″ shorter overall and would look much better.

3. I still have one place with white text that I haven’t been able to change — the text beneath the main picture (to the left of the green contact button).

Speaking of the Contact Us button — is there a way to change it from green?

Thank you for your help!

[Sakin]

@Janet:

1. I don’t understand why it is not working for you when it’s working on here. There is two option one is “Footer Background Sidebar Color” which will change the background of Footer Areas and another is “Footer Background Color” which will change the background of Footer Site Copyright area background. Ok and if you cannot find then you can add the following css in “Appearance => Theme Options => Custom CSS” box.
#site-generator { background-color: #d5d3b8; }

2. This is bit confusing. Can you share screenshot of what you want. I already told you that the menu come down due to header header image and Site Details Text. So, one option will be to either remove the Header Text or mode the header text down by adding in the following css in “Appearance => Theme Options => Custom CSS” box.

#hgroup.logo-enable.logo-left {
    padding-left: 0;
    padding-top: 10px;
}
#site-title {
    font-size: 24px;
    font-size: 2.4rem;
}

Or you will only to able to reduce the gap between the menu and your header by little bit. If so then you can just add the following css in “Appearance => Theme Options => Custom CSS” box.

#header-right {
    padding-top: 0;
}

3. You can change this from “Appearance => Theme Options => Color Options => Site Color Options” and change the color for “Homepage Headline Color”

4. For the homepage Headline Button background color, you can change the color code in the following css and add it in “Appearance => Theme Options => Custom CSS” box.

#homepage-message .right-section a {
    background-color: #9bc23c;
} 
#homepage-message .right-section a:hover {
    background-color: #87ae28;
}

[Janet]

Sakin, I can’t find any option to upload or embed and image but you can see the page here: chisholmtrailballroom.com

From the top down:

1. I added your recommended code to reduce the header size. It’s better but I sure wish there was some way to make it even smaller. There’s a good 1/2″ above the text and logo and close to that below the menu options. I tried the css code you recommended in #2 above but that raised the title text but not the logo, so they were no longer side by side but skewed with one partially above the other. Did not look good at all.

2. The text below the slider images is still white. I’ve changed every place where a color is specified. The only white that remains is the rollover color for the main menu. There is obviously someplace I haven’t checked but I don’t know where that is.

3. Is there any way to big lime green CONTACt button that displays in the middle of the page. I didn’t insert the css code you listed in #4 above because I wasn’t sure you knew I meant the button in the middle of the page and not the menu in the header. I was successful at changing the colors of the header menu but not the green contact button.

4. Below the footer area that displays the Homepage Featured Content Options images (there are two right now: Amenities and Packages) is another “footer” area that is simply a white bar across the screen. That footer had a Page in it but when I deleted the page (added by accident) the footer remained as an empty white bar. How can I either move the Blog Traffic widget up or eliminate that bar? I already tried moving the Blog Traffic widget from Footer Area Four to Footer Area One and it made no difference.

5. At the bottom of the page is the blue footer where the copyright is (and the copyright text is still in white).

I appreciate your help. I’m pretty overwhelmed trying to get these last items taken care of.

[Sakin]

@Janet:
1. Yes, there is about 15px margin about your css, which you can remove it by adding in the following css in “Appearance => Theme Options => Custom CSS” box.
#header-right .widget { margin-top: 0; }

2. The text below the slider, are you talking about Homepage Headline with the text “Lockhart’s Premier Rental Event Center”. For that you can change the text color from “Appearance => Theme Options => Color Options => Site Color Options” and change “Homepage Headline Color” and save changes.

3. I already gave you the css to change the contact button. You can change the color code in the following css and add it in “Appearance => Theme Options => Custom CSS” box.

#homepage-message .right-section a {
    background-color: #9bc23c;
    color: #fff;
} 
#homepage-message .right-section a:hover {
    background-color: #87ae28;
    color: #fff;
}

4. To remove that white space, you can add the following css in “Appearance => Theme Options => Custom CSS” box.
#featured-post { border: none; margin-bottom: 0; }

5. At the bottom of the page is the blue footer where the copyright is (and the copyright text is still in white).
— For copyright background color, you can change it from “Appearance => Theme Options => Color Options => Site Color Options” and then change “Footer Background Color” and save change.
— Footer copyright text color, you can add the following css in “Appearance => Theme Options => Custom CSS” box.

#site-generator { color: #1B5F7D; }
#site-generator a { color: #1B5F7D; }

[Janet]

Sakin you rock! Every change worked except for one — the white bar still shows. I copied/pasted the text you provided in #4 above (#featured-post { border: none; margin-bottom: 0; }) and even quit/restarted my browser because my throughput was slow — wanted to be sure all changes were saved and updated. Everything else looks great. If you can help me figure out that one remaining issue I’ll be in great shape!

[Sakin]

@Janet: Oh sorry can you replace that css with the following
#main #featured-post { border: none; margin-bottom: 0; }

[Janet]

Sakin that did it! I’m now in great shape. I can add my detail pages and start advertising. Thank you so much for all your help.

[Michael]

Hi Sakin

I am really glad that you are able to give so many advice on how to change things in this Theme!

I have kind of the same problem. I am trying to change the color for what is known as Footer 1-2-3-4 in Widgets. Can you give me the code for CSS on this?

B R Michael

PS. My website is http://www.houseofrecruitment.dk/

[Sakin]

Hi Michael,

I check in your site and you have already changed the the background color of footer area. But if you are talking about Text color then you can change the color code in the following css and then add it in “Appearance => Theme Options => Custom CSS” box.

/* Footer Area Widget Title Color */
#supplementary .widget-title { color: #fff; }
/* Footer Area Widget Text Color */
#supplementary .widget-area { color: #ddd; }
/* Footer Area Widget Link Color */
#supplementary .widget-area a { color: #ddd; }

Regards,
Sakin

[Veronika]

Can I move the placement of the colored box that’s on the slider on Catch Kathmandu Pro?
http://gandwcpas.com – we’d like to move the colored box on the Canastota photo so it doesn’t cover the sign – can we move just one or do we need to move all? Either answer is ok – I just don’t see how to do it.

[Sakin]

@dotcalm: Yes, you can mode position with CSS from “Appearance => Additional CSS”. Let me know where you want to move it?

[Author]

Posts