Having Facebook 3-Icon Header Menu Style, Sub-Menu and Notification System, HOW?

Facebook is very good at design and convenient for user/member. One of these out standing design is Menu – Mini Menu and Notification System with popup and sound alert.

By default, SocialEngine provides basic menu with not really good design and without sub-menus supported, also notification is quite not outstanding (Figure 1)

In this tutorial, with Advanced Menu System and Advanced Feed Notification, we will help you to set up these below features available on your site:

• Mini menu with 3 icons
• Drop-down menus and Sub-Menus
• Menu style customization
• Popup Notification and Sound Alert when notifications come

Let get started!

Figure 1. Default Mini Menu of SE

1. Mini menu with 3 icons

 With Advanced Menu System, it could be archived easily with few steps. After installation you only need to drag Advanced Menu widget to site header page under mini menu (Figure 2 & Figure 3)

Figure 2: Drag Advanced Menu System to site header

Figure 3: Mini Menu of Advance Menu System

2. Drop-down Menus

Here is the guide to create Drop-down menus:

• Step 1: Go to Admin> Plugins> Adv Menu System> Menu Settings
• Step 2: Choose all menus that you want to become sub-menu
• Step 3: Click “Submenu Selected” (Figure 4)

Figure 4: Choose sub-menu

The same steps for mini menu, see Figure 5.

Figure 5: Sub-menu

To Un-submenu, please do all steps as above, then click “Un-submenu Selected” instead of “Submenu Selected”.

3. Menu style customization:

It’s very easy to change background and text color to suite your site style. To do this, go to (Admin> Plugins> Adv Menu System> Style Settings) and adjust the style as you want it to be (Figure 6)

Figure 6: Advanced Menu System- Style Settings

4. Popup notification and sound alert:

Colorful the menu to suite your site: very easy to change background and text color of the box. To do that, go to this link (Admin> Plugins> Adv Menu System> Style Settings) and modify its parameters (Figure 7-a,b).

Figure 7-a:  Advanced Notification – Back-end – Style Settings

Here is the front-end result as an example of above settings.

 Figure 7-b: Advanced Notification – Front-end style

For sound alert, if you don’t like the default one, you can easily upload a new file for your own use by going to Admin> Plugins> Adv Notification> Sound Alert Settings (Figure 8)

Figure 8: Advanced Notification – Back-end – Sound Alert Settings

Besides your members can disable sound alert if they don’t like due to its annoyance. Simply, go to  Setting> Sound Notification Settings and disable it (Figure 9).

Figure 9: Advanced Notification – Back-end – Sound Alert Settings

Just with some simple steps with the Advanced Menu System and Advanced Feed Notification, your site can be so friendly, convenient and attractive. It will help to increase activities and traffic on your site considerably.

In addition, there are many other features for you – as an Admin – to discover. Please find more details at: 

Advanced Menu System: http://socialengine.younetco.com/adv-menu-system.html

Advanced Notification: http://socialengine.younetco.com/advanced-feed-notification.html

Should you have any feedback or suggestions, feel free to let us know at Contact Us.