Page
of 3

[Free code] Basic navigation bar

28 replies
Posts:
209
Likes:
+97
Just Started
LEVEL 1
*Your Enjin website has to be on a premium paid plan, so make sure to upgrade if you want this new navigation bar along with more possibilities and features on your Enjin website.

Live example: http://codepen.io/Exodioum/full/bdyVmV/
6aKko58.png
The look of the navigation bar, it also has some cool animations, worth trying out!
- original image link here.

GgylKqL.jpg
- original image link here.

Do you want to update your website with the newest free navigation bar? Follow these steps.

Step 1: Creating an HTML module
Go to admin panel > modules, from there click on create module.
You should get a popup with tabs on the left side, click on content and create an HTML module.

Step 2: Putting it on the page you want
Go to the admin panel > pages, you should see 3 titles, and the first one is called top, on the right side of that title you have a green button saying add, click it.
A new container gets added to the top section.

Step 3: Editing the module
First thing you're going to do is click on the settings icon on the right side of the module.
You should get a popup with 4 check-boxes, uncheck all of them then save the settings.
Then click on add module and choose the HTML module you created in the first step and click on the blue add module.
Mouse-over the module and click on the pencil icon, then click on HTML Editor.

Copy & paste this code:
Spoiler: Show

If you actually prefer this navigation menu to fit the whole screen in width and absolutely on the top of the page, here is the updated code:
Spoiler: Show

If you have a question definitely ask.
If you're interested in more simple code leave a suggestion below and I'll think about it
Posted Aug 16, 15 · OP · Last edited Aug 18, 15 by Exodioum
Like
x 2
x 2
List
Undo
Ben
Posts:
1,618
Likes:
+1,384
Popular
LEVEL 4
Looks nice.

Thanks for sharing (:
Posted Aug 16, 15
Posts:
2,795
Likes:
+914
Popular
LEVEL 4
Love the modern design :)
Posted Aug 16, 15
Posts:
209
Likes:
+97
Just Started
LEVEL 1
Updated the thread - Navigation menu now has a dropdown.
wrote:
Looks nice.

Thanks for sharing (:
wrote:
Love the modern design :)

No problem, I might be posting more of this in the future. Depends if people actually need this.
Posted Aug 17, 15 · OP · Last edited Aug 17, 15 by Exodioum
Posts:
82
Likes:
+19
Just Started
LEVEL 1
Great code!

Was wondering if you knew how to get it to expand on the whole webpage? and so it is stook to the top of the page?
Posted Aug 17, 15
Posts:
209
Likes:
+97
Just Started
LEVEL 1
wrote:
Great code!

Was wondering if you knew how to get it to expand on the whole webpage? and so it is stook to the top of the page?
Ah, sure I've updated the OP for you.
Posted Aug 17, 15 · OP
Posts:
82
Likes:
+19
Just Started
LEVEL 1
wrote:
wrote:
Great code!

Was wondering if you knew how to get it to expand on the whole webpage? and so it is stook to the top of the page?
Ah, sure I've updated the OP for you.

Seemed to work ok, other than it has made the whole page liquid
Cheers anyway! Really nice code.
Posted Aug 17, 15 · Last edited Aug 17, 15 by Narcotic
Posts:
209
Likes:
+97
Just Started
LEVEL 1
wrote:
Seemed to work ok, other than it has made the whole page liquid
Cheers anyway! Really nice code.

Can you link me to the page you're trying it on? I can find the problem.
Posted Aug 17, 15 · OP
Posts:
82
Likes:
+19
Just Started
LEVEL 1
wrote:
wrote:
Seemed to work ok, other than it has made the whole page liquid
Cheers anyway! Really nice code.

Can you link me to the page you're trying it on? I can find the problem.

http://sweprox.enjin.com/test - page with code
http://sweprox.enjin.com/home - page without code
Posted Aug 17, 15 · Last edited Aug 17, 15 by Narcotic
Posts:
209
Likes:
+97
Just Started
LEVEL 1
wrote:

Alright, thanks. Code has been updated. I will look further into this later. :)
Posted Aug 17, 15 · OP
Page
of 3
Social Media
Follow us on our social media!
You will receive information, news, sneak peaks, giveaways and more!
NoticeNotices