Remove top phone number and make header on home page different

How do I make the header on the home page only different than the rest of the site? Also ho do I remove the call phone number at the top of the home page. http://screencast.com/t/wVA5cfRib

 

Hello,

1. For your first issue, could your please share your website link.

2. To remove the call phone number from the top of the header,
paste the code given below in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.header_wrapper .call-us {
display: none;
}

This will remove the call phone numbe section.

3. To change the color of header tag,
paste the code given below in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.home-content .page_info h1 {
color: red;
}
.feature-content .feature-content-inner .feature-content-text h3 a {
color: red;
}
.featurebox h2 {
color: red;
}
.feature_testimonial h2 {
color: red;
}

In place of "red" you can put your color or color code.

 

Thank you for your response. I need to do 3 other things for this client, how do I change the home page header height only so that the menu is at the top, also how do I change the color of the menu to have the background color of the header (dark) and the menu text to light color. and finally remove the bottom section that contains the posts and the testimonial here is a screen shot http://screencast.com/t/K2bvaAjBhTAA

Thank you in advance for you great help. Your support has earned you an excellent review on the Warriorforum from me

 

the website is http://lizaglickman.com

 

I just posted the review on warrior, thanks again for your help

 

Hello,

1. Our RoadFighter theme do not have the header on the font page.
See the link for reference.
http://inkthemes.com/wptheme/roadfighter-yoga/

To solve this header issue follow the instruction given below.
Go to the Dashboard > settings > reading
and set it to default as shown in the image given below.





2. Paste the code given below in Custom CSS to change the color of menu.
(Appearance > Theme Option > Styling Option > Custom CSS)

Code:

#menu .ddsmoothmenu li a {
color: #321c33;
}
#menu .ddsmoothmenu li li a:link, #menu .ddsmoothmenu li li a:visited {
color: #321c33;
}

In place of "#321c33" you can put your color or color code.

3. Paste the code given below in Custom CSS to remove the bottom section that contains the posts.
(Appearance > Theme Option > Styling Option > Custom CSS)

Code:

.feature_blog_content {
display: none;
}

This will solve your issue.

 

Thank you for your help, what you suggested worked great. I need to address 2 issues, 1. how do I reposition the menu to the top of the page? 2. how do I change the color the rollover menu items and remove the shadows from the menu items

 

http://lizaglickman.com

 

Hello,

1. Paste the code given below in Custom CSS

Code:

.menu-wrapper {
margin-top: 0px;
position: absolute;
top: 0px;
width: 1084px;
}

This will solve your first issue.

2. Paste the code given below in Custom CSS for your second issue.

Code:

#menu .ddsmoothmenu li li a {
color: red ! important;
text-shadow: none;
}

This will solve your issue.

 

thsnk you thank you, that worked perfectly, only 1 item left, the rollover color on the current page and on the item that has sub items goes dark same as background, I need it to stay the light color, how do I do this??

 

I just found an issue that I must correct. The menu does not work in a mobile device. How do I correct this?

 

Hello,

Paste the code given below in Custom CSS to change the color.
(Appearance > Theme Option > Styling Option > Custom CSS)

Code:

#menu li.current-menu-item a:hover, #menu li.current-menu-parent a:hover, #menu li.current_page_parent a:hover, #menu li a:hover.selected{
color: #321c33 ;
}

In place of "#321c33" you can put your color or color code.
This will solve the issue.

 

For this issue,
Paste the code given below in Custom CSS to change the color.
(Appearance > Theme Option > Styling Option > Custom CSS)

Code:

 @media only screen and (min-width: 960px) and (max-width: 1140px) {
.menu-wrapper {
width: 100%;
}}
 
@media only screen and (max-width: 960px) and (min-width: 768px){
.menu-wrapper {
width: 100%;
}
}
@media only screen and (max-width: 767px) and (min-width: 480px){
.menu-wrapper {
width: 318px;
}}
 
@media only screen and (max-width: 480px){
.menu-wrapper {
margin-top: 12px;
width: 275px;
}
}

This will solve your issue.

 

Thank you very much, it all works now