Create a site wide navigation bar

Hi, I have a question for you. I’m creating my website at klayz.com, and currently I have different subdomains where I have installed various scripts. For example, at klayz.com/communtiy/ I have an online community created with phpBB, at articoli.klayz.com I have a WordPress install where I post various articles, at giochi.klayz.com I have a game portal created with AV Script and so on.

Now my question is this. I want a single navigation bar that is displayed in every page across my entire website, in every subdomain and subfolder. Which could be the best method to do this?

Right now I have a klayz.com/includes/kbar.php file that I include via PHP in every page, which is just a simple ul list with some CSS styles, but it is not responsive (you can see it in action if you go at klayz.com).

I have to say that I already tried with a Bootstrap menu but it was conflicting with the WordPress CSS, the community style, etc. Can you please give me some advice? Thank you a lot in advance!

Hi @Norman

I do apologise for the delay in asnwering. I didn’t see this topic till today.

I would say that you’re way of doing things is the solution that I can think of. Regarding the navigation bar being responsive or not, it is a question of styling

So what you need to choose is which styling you like best and apply that. Right now, you’ve got 3 differente stylings for the navigation bar.

The other solution could be to create exactly the same nav bar in each CMS and, again for consistency, apply the same CSS rules to all of them.

Thank you a lot molona for your reply. I just solved the thing using another bootrstrap nav element, including a custom style for it and the bootsrap css/js links in every header all around the website pages where needed. As for now it is working on most of the network websites.

Right now I have problems with the “drop down menu” on a particular page/site created initially with bootstrap. Maybe you can give me an advice on how to fix that, as I’m going crazy to fix it. If you go for example now at http://www.klayz.com/ and you resize your browser’s window in a mobile-size and you click in the dropdown menu that appear, you can see the desired effect. This effect is not working here: http://u.klayz.com/. That’s a url shortener script that I just installed and customized, but as you can see, when you resize the browser window it just doesn’t work as expected. You open the first menu but it conflict with the other menu (always created with bootstrap), additionally you can’t even close it when opened. And this is a problem. I really don’t know how to solve it right now… do you have maybe some tips for me? As always, thank you in advance.

Glauco (Norman)

I do see a small glitch when I resize for the first time, at least with FF. After the first time, it goes and then the button works as expected.

It has to do with the box of the “Klayz” text. Can’t tell you right now because it only failed once.

1 Like

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