Menu not carrying over

Support
#2

Hi Justin,

I’ve checked your website (I’ve shared its link in the Secure Note), and I can see it’s still under construction so I couldn’t see it, you will have provide us with WordPress Dashboard login details in a “Secure Note” so we can see your website.

Your first two questions, might be caused by a caching issue, try to clear cache from your caching plugin and your browser cache as well.

There are also some CSS/HTML questions, theme customization isn’t supported in our support policy, however, we might help you by providing some starting guide to help you achieving what you want, I recommend checking these tutorials for now:

Thanks.

#3

I sent a secure note.

I have always been provided ccs code by apex. Not sure when this stopped…

#4

I believe it is not cache issue I checked on another computer.

#5

Hi @fortknoxusa,

We could only provide a simple and easy snippet, and we can’t really provide CSS for complex one especially with many changes that almost like a development.

Since you wish your menu to be transparen (probably overlaying on top of next section), then you’ll have to set yout header position to fixed top instead of using this CSS

.home .x-navbar {
    background-color: transparent;
    position: fixed;
    width: 100%;
    border: none;
    box-shadow: none;
}

Please remove that CSS and let’s do this

  1. Go to Theme Options > Header > Navbar > NAVBAR POSITION and set it to Fixed top.
  2. On same area, set NAVBAR TOP HEIGHT (PX) to 0 so it would overlap to next section (floating effect).
  3. Then go to Theme Options > Integrity and toggle on the NAVBAR TRANSPARENCY option to make it transparent.

You don’t need CSS for that setup.

Thanks!

#6

Thanks for the help Rad!

Any answer about why all my pages are not the same format as my home? Like they have the default theme with a grey background and have a different menu and bread crumbs.

And with question 4 is that something x theme cant support?

#7

Hi There,

To make the navbar of all pages same as home page, please find this custom CSS:

.home .x-navbar {
    background-color: #373737;
    position: fixed;
    width: 100%;
    border: none;
    box-shadow: none;
}

And change to this:

body.x-navbar-fixed-top-active .x-navbar-wrap {
    height: 119px;
    margin-bottom: 0;
}
.x-navbar {
    background-color: #373737;
    width: 100%;
    box-shadow: none;
}

.x-breadcrumb-wrap {
    background: #373737;
}

That is technically possible. However, that would fall beyond the scope of our support since it would require custom development. I recommend you try with The Grid or Essential Grid plugin instead.

Hope that helps and thank you for understanding.

#8

Thanks for the help.

#9

once I added that code it made a fine white line under the header…

How to get rid of that?

Also how can I change the placement of the logo and menu text?

And add a call button

#10

Hello @fortknoxusa,

Thanks for updating the thread.

You can add following CSS under X > Theme Options > CSS to remove line under navigation bar and swap the position of logo and menu:

.x-navbar {
    border-bottom: 0 !important;
}

.x-brand {
    float: right !important;
}

.masthead-inline .desktop .x-nav {
    float: left !important;
}

To add a call button, you can add a Custom menu under Appearance > Menus and give it a class name to style the same according to your needs. Here is a screenshot.

Thanks.

#11

I am not trying to swap the menu and logo.
I am just trying to reposition the logo more to the right and the menu text down.

Also how can I make the top menu bar smaller.

#12

Also that code did work to have the menu on every page, but the background on the FAQ page is still doing the default grey with the content in a white box

#13

Hello @fortknoxusa,

Thanks for updating the thread.

Please add following CSS to adjust the position of logo and navigation:

.x-nav-wrap.desktop {
    margin-top: 30px;
}

.x-brand {
    margin-left: 50px;
}

If you are referring to reducing the font size then please add following CSS under X > Theme Options > CSS:

.x-navbar .desktop .x-nav > li > a {
    font-size: 15px;
}

In FAQ page I see that you haven’t added the background image itself. Please add background image and see how it goes.

Thanks.

#14

I was referring to the width of the black menu/nav bar. how to make that smaller width wise?

Also can you explain how to add a call button and regular button to the menu? A staff member tried to explain earlier in this thread but it seems like they left out steps?

thanks for your patience.

#15

Also the menu is still not carrying over to the other pages. Right now the menu is correct on the FAQ page but it is not correct on the home page. as you can see the white line under it and the menu text not centered.

How to make the menu the same on all the pages??

#16

Hey Justin,

There’s no option to make the width of the navbar smaller. Maybe you mean the height?

In that case, you need to reduce your Logo Width and Navbar Top Height.

Also, remove this code:

.x-nav-wrap.desktop {
    margin-top: 30px;
}

Increase the Navbar Top Logo Alignment and the Navbar Top Link Alignment instead of using that.

Button in the Navbar would need custom CSS. @Prasant showed you that you need to add a class to the menu. Here’s a detailed guide for that. Once you’ve added that class, you need to target and style that like a button. That is outside the scope of our support. To make the button/menu a “click to call” link, follow this tutorial.

As you can see here, the issues you’re facing are mainly caused and/or could only be solved by custom CSS. We could not continually provide you with custom code as that would be veering into custom development. We provide code to guide you and help you get started. Developing your site especially using custom codes is not a part of our support service. Please see our Terms.

I’d recommend you use Pro as you have lots of header customizations. Adding a button to the header would also be easy.

I hope you understand.

#18

The menu is still not the same on all pages. the code someone gave me did not work

I want the menu the same on all pages. It is only correct on the faq page.

#19

And the other pages still are not blank like I said earlier…there is still the white paper page template. and that white line is still in the headline. See screen shot.

#20
#21

As I’ve said, the issues are because of your custom CSS. This CSS that you placed in your Home page Content CSS is causing the issue with your Navbar not the same with other pages.

The white line is part of Integrity’s design. It is showing up like that because the breadcrumbs is hidden behind the navbar because of custom CSS and incorrect configuration of the options. There was a bug with the breadcrumbs in the version you’re using so please update to the latest version of X and Cornerstone and deactivate the breadcrumbs in Theme Options > Header. We don’t support issue arising from custom code even if we gave the code.

And I also said earlier that it would be best to upgrade to Pro because you have lots of header design requirements that needs custom CSS with X.

You’re using a Blank Container page template for your FAQ page. Use Blank No Container.

Again, before we continue with support, do the following:

  1. Remove all custom code.
  2. Update X and Cornerstone to the latest version.

Please don’t get me wrong, I’d personally like to help. But, that is if it’s reasonable and within our Terms.

Thanks.

#23

I updated and deleted the code.

I added the code on the theme option css not the homepage and its still not working with the menu on being the same on every page.