Lsrcr Forum

Hey guys!

I do know that there's quite a few web developers here.
I wish to create a customised navbar with bootstrap to give it a unique look from other websites.

Basically I managed to change colours, borders, link hovers (basic stuff) and so on by overwriting the CSS of bootstrap.cs from the styles.css (my custom CSS file) .

But the question is this:

How do I make it look professional?

Are there any specific plug-ins or generators? Or is it just purely CSS?

These are the examples of the current navbar which I am building, that I don't find professional at all!

PC:


Responsive:



I need to make it more unique, yet simple... any ideas?

Thanks!

Use Adobe Dreamweaver for the overall layout, give the finishing touch by hand and CSS.

I have worked a lot on navbars, so I know a bit
First things first, keep the color combination ready. That isn't a great red, use flatuicolors.net for great and responsive looking colors
Next, use the Transition effect to make it a bit interactive. Not too much, that screws up. A little bit, and that should do the trick to keep it interesting.
Make use of the #active class as well. Use it to give custom css to the page the user is on.
Also, If I was you, I'd go for a sidebar. They can slide away easily, they also can be made to look very professional, much more than top navbars. + The Font Awesome icons look real neat there, and on mobile, you could omit the world and just use icons on the sidebar. + Nested Sidebar entities look better than dropdown navbar stuff, but personal opinion
I could help you out with the development of your website, I love this kind of stuff. Here's an attached image to show you how a professional sidebar may look:
Closed:

Open:

Note: Opening/Closing is either hover based or button based, whatever the need be
Feel free to message me any time you need any more help! I'd love to be helping out on this project

Thanks a lot for your help guys! I appreciate a lot your opinions and your generosity! :flush: :flush: :flush: