Page Title Spacing and Color

[LargeMedia]

If you are able to help, there are a few things I would like to change.

1.) The space between the navigation bar and page title, and then page title and where the body text starts, is quite large. Is there a way to make it smaller?

2.) Can I change the color of the page titles?

3.) Can I can the color of text in the body? I tried using some basic HTML font color code, but it didn’t work.

4.) The navigation looks great on my computer. My client says the nav goes over the logo. He sent me a screen shot I can email you.

Thank you again!!

[FocuxTheme Support]

Hi

1. Can you tell me your website link? Then, I can send you the custom CSS to reduce the space between the navigation bar and the page title.

2. As same as above, there’s no option to change the color of the page titles, so I will send you the custom CSS.

3. If I understand correct, try to add the following custom CSS into Samsara options > Custom styles > CSS code

body{color:#333;}

4. You can upload the screenshot to dropbox and paste the share link here.

Thanks!

[LargeMedia]

http://largemediainc.com/peejays/

Re: #3 – I would only like to change a little of the body text color. They would like a few bold items a different color if possible.

Here are the screenshots. One is Safari (no nav bar) and the other is Firefox.

https://www.dropbox.com/sh/hd5w0jluwb122sk/AABBhkcFb_EbEYnQ40ceYpjIa

[FocuxTheme Support]

1. You can add the following custom CSS into Samsara options > Custom styles > CSS code

.page-template-page-homepage-php #container{
   padding-top:80px;
}

You can adjust the padding top value.

2. Did you mean you want to change the color of page title like “about us” in this page? http://largemediainc.com/peejays/about-us-3/
If so, try the following custom CSS

.van_headline{color:#yourcolor;}

However, after you added the custom CSS, all the pages title color will be changed.

3. it’s the custom issue(not included in the support), I suggest you can try to find the css selector first with chrome developer tool, then, add your own custom CSS to override the original CSS, then you can do anything you want. Just refer to this article: http://dailypost.wordpress.com/2013/07/25/css-selectors/

Or youtube video https://www.youtube.com/watch?v=V2aAEzlvyDc

4. Try to add the following custom CSS

.tools{width:auto;}

That’s because there are too many menu items over there, and I have told you add #primary-menu {min-width:900px}, the issue is caused by this custom code, so I think we should reduce the width of .tools container at the same time.

Thanks

[LargeMedia]

THANK YOU so much for your help. This is all wonderful.

I added the code. The navigation bar seems to have changed, but nothing else did. It looks like this:

<pre class=”brush: css; gutter: true; first-line: 1; highlight: []; html-script: false”>.van_headline {
color:#FF8000;
}
.page-template-page-homepage-php #container{
padding-top:80px;
}
#primary-menu {
max-width:900px;
}
.tools {
width:auto; }
body .wpb_content_element, body ul.wpb_thumbnails-fluid > li, body .last_toggle_el_margin, body .wpb_button {
margin-bottom: 20px;
}

Am I entering it correctly?

[LargeMedia]

This part is not in there: <pre class=”brush: css; gutter: true; first-line: 1; highlight: []; html-script: false”>

[FocuxTheme Support]

Can you tell me more details about question 1, 2, 3? And the last question seems working fine now..

1. “The space between the navigation bar and page title”. which page you point? Home page?
2,3 which part of text and page title you want to change the color?

Is it possible to post a screenshot and mark the part which you point in red line?

[LargeMedia]

Here are images for question 1 and 2. I’ve decided not to bother with question 3 so you can ignore. I have also taken a screen shot of the custom CSS code box wit the code you have provided so far.

https://www.dropbox.com/s/5a6sqsuer8nlfev/Qs-PJ-site.jpg

Again, thank you so very much!!

[FocuxTheme Support]

Hi

I’m sorry, my expression wasn’t clear, I mean you can mark the part (frontend pages) which you want to make change in red line, not the custom code in the backend screen.

[LargeMedia]

I’m sorry. There were 3 pictures. I thought that link went to all of them.

https://www.dropbox.com/s/ct9e01x0yb1klzl/Q1-PJ-site.jpg

https://www.dropbox.com/s/dsksaiskueajvxd/Q2-PJ-site.jpg

https://www.dropbox.com/s/5a6sqsuer8nlfev/Qs-PJ-site.jpg

[FocuxTheme Support]

Hi

Try the following CSS

/*Question 1*/
#container{padding-top:120px;}
.van_headline{margin-bottom:40px;}

/*Question 2*/
.van_headline h2{color:#333;}

You can adjust the value.

For question 2, you can only change the page title color globally.

For cutting off question, have you already fixed? It looks fine now!

Thanks

[LargeMedia]

The padding is brilliant – thank you!! The h2 color isn’t changing, but I’m giving up on that. It’s fine this way.

Yes, it was a problem with Visual Composer and the developer fixed it for me.

Thank you for all of your help with these issues!

[FocuxTheme Support]

OK, that’s great!

You’re welcome!

[Author]

Posts