Return to previous page

Social Icons/links in Header and Missing Page Title Tag

This topic has 52 replies, 5 voices, and was last updated 10 years, 5 months ago ago by Eva Kemp

Eva Kemp

Support staff

July 8, 2014 at 12:36

You’re welcome.

Regards,
Eva Kemp.

#9096 Copied

P90Pete

Participant

July 8, 2014 at 16:10

Hi All – I would still like the langauge-area (with the social icons) to align right and the register-login area to align left in the top header. I tried modifying the css with no results. Please let me know how to accomplish this.

Also, is there a way to modify .header-type-1 to have a gray background (#929292) and text color (#292D33)/text hover(#F16521) on the navigation bar?

http://rivernorthworkshop.com/

Thanks in advance!
Pete

#9129 Copied
Eva Kemp

Support staff

July 8, 2014 at 17:04
Hello Pete,

Please add this code to align register-login area and langauge-area:
```
.top-bar .top-links {
    float: left;}
.top-bar .languages-area {
    float: right; }
```
To change header background use this code:
```
div.header-type-1 {
background: #929292;
}
```
To change text color for the menu:
```
.main-nav .menu > li > a { color: #292D33; }
.main-nav .menu > li > a:hover {color: #F16521; }
```
Regards,
Eva Kemp.
#9143 Copied
P90Pete

Participant

July 8, 2014 at 17:23

The social icons and registration code worked like a charm.

The other css you sent changed the header and not the nav bar (black in header-type-1). I would like to change the nav bar background color to #929292, the main nav text color to #292D33 and the hover bar (beneath the navigation text) to #F16521. Make sense?

http://rivernorthworkshop.com/

Thanks for your quick reply!

#9150 Copied

P90Pete

Participant

July 8, 2014 at 17:54

Sorry… I want the nav bar background to be #F3F3F3. I was able to change it in the stylesheet but need to change the vertical lines and text color as well. I’ll keep working until I hear from you. Thx!

#9154 Copied
Eva Kemp

Support staff

July 8, 2014 at 17:58
Sorry for misunderstanding.
Please use this code to make all changes you need:
```
.main-nav {background: none repeat scroll 0% 0% #F3F3F3;}
.main-nav .menu > li > a { color: #292D33; }
.menu > li.current-menu-item > a {border-color: #F16521;}
```
Regards,
Eva Kemp.
#9155 Copied
P90Pete

Participant

July 8, 2014 at 18:15

Very close. I need to be able to change the font color (passive & hover) and the active state background. It would be great if I could change the vertical lines as well.

Thanks so much!

#9158 Copied
Eva Kemp

Support staff

July 8, 2014 at 21:14
To change the vertical lines color use this code:
```
.main-nav .menu > li > a {border-left: 1px solid #2B2B2B;}
.main-nav .menu > li:last-child > a {border-right: 1px solid #2B2B2B !important;}
```
(change the color value to yours).
To change active state background:
.main-nav .menu > li.current-menu-item > a {background-color: #F3F3F3;}
To change font color:
.main-nav .menu > li > a { color: #292D33; }
Just to clarify: you want to set the hover color for the text, not for the background of the menu items, don’t you?

Regards,
Eva Kemp.
#9171 Copied
P90Pete

Participant

July 8, 2014 at 21:50

The new code is not working. Should I change it in the stylesheet or custom css?

#9176 Copied

Robert Hall

Support staff

July 9, 2014 at 06:59

Hello P90Pete,

All changes should be done only in custom.css file.

Regards,
Robert Hall.

#9196 Copied

P90Pete

Participant

July 14, 2014 at 22:32

Hi Guys – My main nav bar still needs a little tweaking. Can you send me the custom CSS for the following:

Would like a complete boarder to outline the active & passive state of each main nav item.
Change the hover color of the each nav box.
Have a fixed size for each nav box. Currently dictated by the number of type characters.

On another topic, when I updated the theme it added an additional homepage. How do I remove the /home-page/ from the URL of the child pages? BTW… the homepage, individual blog and individual portfolio pages were not effected. Just the secondary landing pages.

http://rivernorthworkshop.com/home-page/projects/

Thanks in advance for your help!
Pete

#9797 Copied
Eva Kemp

Support staff

July 15, 2014 at 12:25
Hello @P90Pete,

Could you please show us a screenshot of what you wish to do with the menu border?
To change hover color for each menu item add this code into custom.css file:
```
li.menu-item.menu-item-type-post_type.menu-item-object-page.current-menu-item.page_item.page-item-722.current_page_item.menu-item-724 > a:hover {background: red !important;}
li.menu-item.menu-item-type-post_type.menu-item-object-page.current-page-ancestor.current-page-parent.menu-item-355 > a:hover {background: red !important;}
li.menu-item.menu-item-type-post_type.menu-item-object-page.menu-item-357 > a:hover {background: red !important;}
li.menu-item.menu-item-type-post_type.menu-item-object-page.menu-item-356 > a:hover {background: red !important;}
li.menu-item.menu-item-type-post_type.menu-item-object-page.menu-item-358 > a:hover {background: red !important;}
```
Change color values to yours.

To have the fixed size of each nav box you need change the width of the box:
.main-nav .menu > li {width: 150px;}

Had the url of the pages been without “home-page” slug before the update?
Have you made any changes after update?
Please provide us with FTP credentials to check it.

Regards,
Eva Kemp.
#9849 Copied
P90Pete

Participant

July 15, 2014 at 18:57

Thanks for the code.

Here’s a comp of how I want it to look:

The URLs did not have /home-page/ prior to updating the theme to the latest version. Do you want access to my hosting provider for FTP? Credentials to wordpress are in the private content.

Please, contact administrator
for this information.

#9889 Copied

P90Pete

Participant

July 15, 2014 at 19:22

FYI… I would like to be able to modify the outline on the nav bar and each boxes independent of each other. Thx!

#9891 Copied
Eva Kemp

Support staff

July 15, 2014 at 20:37
Please try to use this code to create borders for menu items:
```
.main-nav .menu > li > a {
    border-left: 1px solid #FFF;
}
.main-nav .menu > li:last-child > a {
    border-right: 1px solid #FFF !important;
}
.menu > li.current-menu-item > a {
    border-left: 1px solid red !important;
    border-bottom: 1px solid red !important;
    border-top: 1px solid red !important;
}
.main-nav .menu > li > a {
    border-top: 1px solid red;
    border-bottom: 1px solid red;
}
```
If you don’t have FTP account created, then you can provide us with the credentials to your hosting control panel.
Was url slug changed immediately after update or you made any changes for the pages?

Regards,
Eva Kemp.
#9899 Copied
P90Pete

Participant

July 15, 2014 at 20:59

It didn’t box out everything and the Home box is smaller than the other ones. I would also like each box to be completely outlined. Check it out.

http://rivernorthworkshop.com/

The URL slug was changed right after I updated the theme. I’ll see if the site owner will setup credentials for you to access their hosting service.

Thanks!
Pete

#9902 Copied

P90Pete

Participant

July 15, 2014 at 21:01

Also, can we change the outline color for each on hover?

#9903 Copied

P90Pete

Participant

July 15, 2014 at 21:51

Here’s what the folks I’m helping with this are asking for:

The font in the active state should be Open Sans-bold, while the font in passive/hover is the Open Sans-light.

#9908 Copied

Eva Kemp

Support staff

July 16, 2014 at 09:48

Hello,

Unfortunately this requires additional customization to be able to edit each menu item. This service is paid. If you agree please create a ticket at https://support.8theme.com/ and our specialists will provide you with more information.
Thank you.

Regards,
Eva Kemp.

#9961 Copied

P90Pete

Participant

July 16, 2014 at 14:54

I will check with the folks that own the site to see if it’s something they want to pursue. In the meantime can we clean up the code you sent to outline the nav boxes (see #9902) and send code to add a stroke to the entire nav bar?

Thanks for all your help!
Pete

#9996 Copied

P90Pete

Participant

July 16, 2014 at 15:03

Could you give me a rough estimate of cost for custom development for the request above. Put in the private content please.

#9997 Copied

Eva Kemp

Support staff

July 16, 2014 at 15:37

Hello,

To get rid of the changes that have been made you need just remove the code you were provided in previous posts.
We’ve sent an email with the price details to your email address.
Please check it.

Regards,
Eva Kemp.

#10007 Copied
Tagged: header links, page title tags, seo friendly, social icons, woocommerce wordpress
1 2

Viewing 52 results - 31 through 52 (of 52 total)

The issue related to '‘Social Icons/links in Header and Missing Page Title Tag’' has been successfully resolved, and the topic is now closed for further responses

Social Icons/links in Header and Missing Page Title Tag

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection