Responsive Menu Extension

In this section you can share self-made extensions with other users of WYSIWYG Web Builder.

There are already more than 250 extensions available!
User avatar
Patrik iden
 
 
Posts: 556
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Fri Apr 17, 2015 7:39 pm

TrevH wrote:Hi Patrik,

Thanks for your reply, yes that would certainly do it for sure... I think to use a separate menu per page might not be so practical because as the site grows each menu would then need updating every time just one page was added...

I tend to make just one menu on a master page and then clone content pages from another layout so that just the content needs changing on each new page, then I just update the one master page menu to update every page's menu in one go.

To do it with separate menus on each page could take ages in update time instead of just updating a single master page menu, especially if it was a large site. Is there perhaps a java function somewhere within the original script that could be used?

http://stackoverflow.com/questions/3234 ... ndary-link
http://jsbin.com/okupe4/2#tab-1

You are doing an absolutely brilliant job, hope the links are of some use, but I don't know very much about code.

Many thanks...
Trev
Hello, i'l take a look at the links.

In the original menu script there is not any code do display an active link, i added this my self.

User avatar
Patrik iden
 
 
Posts: 556
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Sat Apr 18, 2015 5:08 am

What menu are you using, if you can use it on a master page and set separat color for active/current links? Can you explain more about I tend to make just one menu on a master page and then clone...

Thank you.

TrevH
 
 
Posts: 41
Joined: Wed Nov 26, 2014 3:31 pm
Location: UK
Contact:

Re: Responsive Menu Extension

Post by TrevH » Sat Apr 18, 2015 9:20 am

Hi Patrik,

Prior to your new responsive menu, I used 2 css menus on the master page, one for big screen (horizontal) and one for mobile (vertical) with the screen sizes set accordingly to show or hide one or the other, so technically I suppose I had to update just 2 menus but still only on the one master page... easy & quick to do. As I clone new pages from a previous page, it automatically picks up the master page elements.

Sorry if I gave the wrong impression, but I didn't actually say that there was any "active" element settings to these existing menus I used previously, my way to get around it was to simply add the page title heading on each page so the visitor knew exactly where they were.... I think you are bringing something very new with your menu which when completed with sub menus etc will be a game changer.

I wish I could be more help, the last software I used could do the active link/master page but I ditched it as it lacked so much of what WB10 can do.

Whilst I am not technically savvy enough to know if it is helping you or not, maybe the idea of using a jQuery snippet to check the current page URL and compare it with the URLs in the menu and if they match it will then add a class to the menu item... hence an active menu I saw this http://www.paulund.co.uk/use-jquery-to- ... -menu-item (the code is at the bottom of this link page for catching both absolute and relative links).

I have uploaded a zip file for you with a fully working css responsive menu complete with 2 levels of sub menus... maybe you can adapt the css for your extension in terms of being able to add sub menus.

http://bit.ly/1b7IByX

Hope this is helps in some way...
Trev.

User avatar
Patrik iden
 
 
Posts: 556
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Sat Apr 18, 2015 3:04 pm

OK, TrevH. Check it out now and get back to me please. Thank you.

Update: 2015-04-18

1. I have added function to set different text color on active/current link.
2. Finally :) You can now have the menu in an master page, then just use master object to insert the menu from master page.
Now you can just make changes to the menu in the master page and these changes will be updated in all other pages.
The nice thing about this menu is that you now can choose to indicate Active/Current page by setting up a background color just for this directly in the master page.
If you do not want any Active/Current indicator color on your links/buttons you can turn this function of.

If there is some one out here that are good at making menus like this, please let me know. Could use some help to add sublinks/dropdown menu.

Thank you.

Demo: Gradiant and borders: http://test3.fcab.se/myextensions/respo ... /menu.html You can try clicking on all the links now.

Download Version 2.0.0.0: https://dl.dropboxusercontent.com/u/318 ... e_menu.rar
Last edited by Patrik iden on Sat Apr 18, 2015 4:02 pm, edited 1 time in total.

TrevH
 
 
Posts: 41
Joined: Wed Nov 26, 2014 3:31 pm
Location: UK
Contact:

Re: Responsive Menu Extension

Post by TrevH » Sat Apr 18, 2015 3:38 pm

Hi Patrik...

Wow, superb job!!!

It works absolutely great, thank you!!!

As I said I am no coder as such, but I have up loaded a zip link with fully working sub menu code in for you: http://bit.ly/1b7IByX (consisting of one html page, a css & .js file). It maybe of some use for you in terms of coding the jquery sub menus.

Hope it's helpful, and once again my sincere thanks, this menu you have made is fantastic and I really didn't expect it so soon!!!

All the best
Trev :D

User avatar
Patrik iden
 
 
Posts: 556
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Sat Apr 18, 2015 3:54 pm

Hello, thank's for the sub menu code, i'l take a look at in soon. And well yes i got the active/current color thing workin, but it took me all night to figuer it out. But now it semes to work and i will make one minor update later to day (nothing major).

User avatar
Patrik iden
 
 
Posts: 556
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Sat Apr 18, 2015 4:11 pm

I just made a little change: Now you can controll to remove separatly the top and bottom devider/border on active links in the mobile menu (in mobile mode). I made this update because in some cases it will look better not to remove eg, the bottom border and in some it will, depends on the colors you are using. So please download againe.

Download Version 2.0.0.0: https://dl.dropboxusercontent.com/u/318 ... e_menu.rar

TrevH
 
 
Posts: 41
Joined: Wed Nov 26, 2014 3:31 pm
Location: UK
Contact:

Re: Responsive Menu Extension

Post by TrevH » Sat Apr 18, 2015 4:21 pm

Hi Patrik,

Thank you, just got your latest version and it's looking great! Nice touch with dividers... :D

Trev

User avatar
Patrik iden
 
 
Posts: 556
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Sat Apr 18, 2015 8:07 pm

Hello,Thank you. I have tested to add sub menus to this but i think i'm not good enough coder to do this. So if some one else think he/she can do this, please do.

Thank you all.

//Patrik.

andyp
 
 
Posts: 291
Joined: Fri Aug 08, 2014 8:56 am
Location: Brighton UK
Contact:

Re: Responsive Menu Extension

Post by andyp » Sat Apr 18, 2015 9:49 pm

Haven't had time to try this out Patrik.....but thanks again... and to think that you were up all night working things out :wink:
Making mistakes....and still learning as I go along.. and very grateful to those who know far more than me... :)
http://www.apgraphx.co.uk

User avatar
Patrik iden
 
 
Posts: 556
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Sat Apr 25, 2015 1:12 am

Preview of my new Extension: Multi responsive menu. This is a responsive menu with one sub menu level. You can make alot of changes in the Extension settings like: Borders/Dividers, Backgroud colors, Gradient colors, Active link colors, Change all font settings etc. I will make another demo later on a more stylish version this one is only to show as many settings as possible. But i want some peoples to test this menu first so i can fix the buggs before making a dedicated post to this Extension.

Org script: http://responsivemultimenu.com/

So here you go: http://test3.fcab.se/responsive_menu_te ... index.html

Thank you.
Last edited by Patrik iden on Sat Apr 25, 2015 11:44 am, edited 1 time in total.

TrevH
 
 
Posts: 41
Joined: Wed Nov 26, 2014 3:31 pm
Location: UK
Contact:

Re: Responsive Menu Extension

Post by TrevH » Sat Apr 25, 2015 8:50 am

Hi Patrik,

Thank you for doing all this work... I just tested your menu on the demo and cannot find anything functionally wrong with it at all.... it seems to me to be working really great!!!! :D

I really like the way the sub menus are vertical drop downs (like accordion style) and also that you have thoughtfully provided a very neat "back" button, and that all the "active" page highlights work fine on all the pages.

The only thing I did wonder was ( just a visual thing on the demo ) whether on the big screen menu version one will have the option of setting the buttons to be all the same size along with equal width sub menus, visually then every menu gives a nice straight column line, rather than variable widths.

Looking forward to your next demo and release of this fine menu, I for one am very excited about using it...

Many, many thanks.....
Trev :D

kenderuiter
 
 
Posts: 21
Joined: Thu Jul 08, 2010 7:01 pm

Re: Responsive Menu Extension

Post by kenderuiter » Sat Apr 25, 2015 8:54 am

Hi Patrick,
I looked at your demo and it really looks neat!
How and where do I download your latest version? (I never downloaded any 'external extensions' yet)
Kind regards, Ken

User avatar
Patrik iden
 
 
Posts: 556
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Sat Apr 25, 2015 9:29 am

kenderuiter wrote:Hi Patrick,
I looked at your demo and it really looks neat!
How and where do I download your latest version? (I never downloaded any 'external extensions' yet)
Kind regards, Ken
Hello and thank you. You can not download it yet. Maybe in a cople of days.

User avatar
Patrik iden
 
 
Posts: 556
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Sat Apr 25, 2015 9:31 am

TrevH wrote:Hi Patrik,

Thank you for doing all this work... I just tested your menu on the demo and cannot find anything functionally wrong with it at all.... it seems to me to be working really great!!!! :D

I really like the way the sub menus are vertical drop downs (like accordion style) and also that you have thoughtfully provided a very neat "back" button, and that all the "active" page highlights work fine on all the pages.

The only thing I did wonder was ( just a visual thing on the demo ) whether on the big screen menu version one will have the option of setting the buttons to be all the same size along with equal width sub menus, visually then every menu gives a nice straight column line, rather than variable widths.

Looking forward to your next demo and release of this fine menu, I for one am very excited about using it...

Many, many thanks.....
Trev :D

Hey TrevH and thank's. I'l look in to the size/width of the buttons.

Post Reply

Who is online

Users browsing this forum: No registered users and 7 guests