change header background image or height

Hi,

The dark grey background in the secondary pages of Roadfighter theme takes up a lot of space (height). Is there a way of putting images instead (by page or post) or optionally adjusting the height smaller so there is less empty space? www.3fficient.com (not the home page).

 

Hello,

Paste this code in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.header_container.not_home{
min-height:200px;
}

Adjust its value as per your requirements.

 

Thank you. That worked great.

Is it also possible to:
1. hide the breadcrumbs area
2. hide the top color bar (currently blue on my website)?

 

Hello,

1. Paste the code given below in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.page_heading_container .page_heading_content #crumbs {
display: none;
}

This will remove the breadcrumbs area.

2. Paste the code given below in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.header_container {
border-top: none;
}

This will remove the top color bar.

 

Thanks you so much. That worked great. Unfortunately, the posts still show breadcrumbs. View at www.3ficient.com > Experience. So I tried the code below but it didn't work.

Code:

.post_heading_container .post_heading_content #crumbs {
display: none;
}

Any ideas?

 

Hello,

We have checked your website and there is no problem with the code, it is working fine. Please check your website again after clearing cache and also check your site at any other browser.

 

At first attempt or click, the breadcrumbs are removed. However, if you click on Experience or its submenu more than once, the breadcrumbs are back on the blog pages. I have them mostly hidden behind the menu since this is a live site, but the menu is somewhat transparent. I went ahead and revealed them by moving the menu up temporarily - for your benefit. On a mobile device, they stand out. I verified this issue on multiple browsers (Chrome, Safari, Firefox) and devices (iPhone, iPad). On the iPhone, when viewing full site in Chrome, the breadcrumbs are obvious on the blog pages (3fficient.com > experience). I cleared the cache and the issue persists.

If this doesn't work, is there a code for moving the breadcrumbs to the footer or a widget instead?

Thank you.

 

Hello,

Paste the code given below in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.page_heading_container .page_heading_content #crumbs, .page_heading_container .page_heading_content p{
display: none ! important ;
}

This will solve your issue.

 

Thank you so much. It worked perfectly!