Header - Inline and Submenu

I created an Inline Header for the Home page…
https://xpro.eagleheartdynamic.com/?cs-launch=1&cs_route=content.builder/12

I would like to make the Submenu (under Writing) Writing Print and Writing Web uppercase as well but didn’t know where to change it in the Inline section. I thought since I chose uppercase everything would be uppercase including the submenus.

Also, how do I get rid of the house icon on all of the other pages with the title of the page next to it. It’s redundant and I think it looks stupid.
https://xpro.eagleheartdynamic.com/?cs-launch=1&cs_route=content.builder/12

Thank you.
designerwriter

Hey Grace,

Regretfully, we don’t have an option to change the case of the sub-menu in the Original Header. I’d recommend that you create a custom header using the Header Builder and add Navigation Inline element inside it. The Navigation elements have an option to change the case of the text. This is the official solution.

If you wish to continue using the Original Header, you’d need to write your own CSS code. I’ll provide a starting point for you but just note that we will not provide more custom codes after this and we also will not support issues that will arise from the use of custom codes.

With that said, please add the following code in Theme Options > CSS. You can learn how CSS works here.

.x-navbar .x-nav li>a {
    text-transform: uppercase;
}

I’ve tested that code and it’s working. If that doesn’t work in your site, it means that there’s broken CSS somewhere in your site or there’s a conflicting code. If that’s the case, you really need to build a Pro Header. Otherwise, you need to consult with a developer.

------------------------------------------------------------

Regarding the house icon, are you referring to the Breadcrumbs? If so, that indicates the home page and it’s a common display for websites. There’s no option to change that so the solution would be to create a Pro Header and add the Breadcrumbs element. Using the said element, you can display text instead of just the home icon.

image

If that is not what you mean, please provide the URL of the page where we can find the home icon you’re referring to.

Hope that helps.

I’d recommend that you create a custom header using the Header Builder and add Navigation Inline element inside it. The Navigation elements have an option to change the case of the text. This is the official solution.

Christian I thought that is what I used… Do you mean start from scratch by starting with the header in the theme panel then add a bar, container and elements etc.? How should I start this header if I do it the way you suggest? Do I go to the menu that pops up in the sidebar and use that header instead of going to theme options. I thought I just created the Pro Header using the inline method and that’s what’s up there now? I am confused now.

Regarding the house icon…I thought there was an easy way that I could get rid of that. I have done it before in a previous version…rather that create a whole new header.

Hi Grace,

Sorry for the confusion, to clarify, what you have on your site now is the Standard Header, as you can see it looks very basic and there are only a few options that you can do on the Standard Header, those options are under Theme Options > Header.

Now if you need to create a kind of advance header layout or design, then you need to use the Header Builder (PRO > Headers).

You can check our Youtube Channel to see what kind of Headers you can do with the Header builders.

Now if you only want the “Writing Print” and “Writing Web” sub-menu to be uppercase on your standard header, then you can use the custom CSS provided by Christian above. You can add that under Theme Options > CSS area. I have tested that and it should work on your site just fine.

Have a nice day,
Cheers!

Thank you Friech. I really don’t want to create another header when this one suffices. I will use the CSS…because yes any words in the submenus I want uppercase as well. I will check out the Youtube Channel Thank you. Now if only I could get rid of that house icon. I thought there was an easy way that I could get rid of it. I have done it before in a previous version…rather that create a whole new header. It doesn’t make any sense. Can you figure out a way to get rid of it for the next update or is that impossible?

Yes absolutely, please navigate to Theme Options > Header and turn Off the Breadcrumbs option.

Cheers!

Thank you Friech! I remember that’s what I did!

Glad we could help,

Cheers!

Although, after I did that, the Essential Grid I used disappeared so I had to reinstate it on to the Home page.
Strange.

Yes that is strange, since none of the things we discuss here has something to do with Essential Grid.

It could be your browser cache, or something.

Feel free to write a new thread if you have a other question as this one is getting longer and harder to follow by my colleague and other users.

Thanks,

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.