Hi folks.
I'm a webdeveloper myself, and I've created an png-sprite animated menu component in the past (http://mediabeez.ws).
I now would like to intergrate that into smf as a free and opensource mod.
Where would I start? I admit I've yet to read the modding docs, but if you could give me some pointers as to how menus are created in SMF, and at what points in the code, I would be much obliged and sped along my course towards this mod.
The menu arrays are in Sources/Subs.php. Look for where it says "buttons". The markup is in index.template.php, and of course the css is in index.css (the dropmenu class). JS files go in the scripts folder.
TBH that menu of yours has a somewhat irritating action. I'd suggest tweaking it some.
Lainaus käyttäjältä: Antechinus - lokakuu 14, 2011, 10:56:46 AP
TBH that menu of yours has a somewhat irritating action. I'd suggest tweaking it some.
ok, how? :)
It's too slow for practical use.
Oh, I thought it was speedy enough for comfortable use.
What exactly is not fast enough? The showing of sub-menus? That's a not-exposed option atm.
Yes they are too slow to render IMHO. This is a common problem with animated menus. There is a tendency to go "Ooo look, animationnnnnnnnnnnnnnnn" and forget that people want quick and easy access to content. If they take more than half a second from the time your cursor hits the link to fully open, it's way too slow.
Well my current menu takes exactly 0.5 seconds to open, so i guess it's within your limit after all ;)
But i'll expose the setting to open it faster / slower.
I did some experimenting this morning, and have managed to plug in my menu into id=main_menu, according to your instructions in your first reply here.
However that doesn't cover the administration menus. I don't even know how many admin menus there are..
Also, I'd like to put in a humble request for that main_menu to have less items next to each other at it's root.
I use a 800px wide theme, and my animated menu needs to have it's items the same width.
Couple that with labels that either short or long ('my messages'), then the only way to have the menu stay within the theme width (http://talk-plainly.net) is to make the menu item title/label font smaller. Not ideal.
Well I said anything over 0.5 is wayyyy too slow. I prefer something about 0.2-0.3. However, this is personal preference. I think having that option available to users makes sense. Bear in mind that there are already plenty of js-assisted drop menu systems freely available online, and these usually provide full editing of all options. If you don't match that openness then people can just use something else.
For example: simply calling the jQuery library, the HoverIntent plugin and the Superfish plugin, and pointing Superfish at the .dropmenu class, will automatically give you Superfish jQuery menus on the entire SMF drop menu system with no file editing required except for adding the calls to the head of index.template.php.
These menus use the standard css and markup as a base and will fall back to a pure css drop menu system if js is idsabled. They do not require equal width on tabs. You can leave them fluid. You can also style the main menu drops and admin drops separately with a little extra css. It's extremely simple to do (and will most likely be default in 2.1) (http://www.simplemachines.org/community/index.php?topic=438693.msg3087193#msg3087193). I already do this on my own themes.
If you want fewer tabs in the main menu bar you can customise that to suit yourself. Some admins will want more tabs, some will want less. Do what you like. :)
Lainaus käyttäjältä: Antechinus - lokakuu 16, 2011, 05:36:16 AP
If you want fewer tabs in the main menu bar you can customise that to suit yourself. Some admins will want more tabs, some will want less. Do what you like. :)
Ok, what's the best way to customize the structure of the main menu?
Change the array in Subs.php. You can rearrange the elements to get whatever layout you want.
Ok, thanks for the info.
But i've opted against having my mod change the menu structure, not all users of my mod would like it.
I may change the menu structure on just my forum, haven't decided about that yet..
Next question:
How do I create a settings page for my mod? Could not find this in the modding docs..
progress report;
I've managed on my testserver (with preliminary artwork, http://skatescene.biz/smf) to replace (hopefully) all the menus, particularly the admin menus. Thank you for re-using that id=adm_submenus, it made the job easier.
Instead of changing the main_menu structure, I opted to just shorten some language strings in ThemeFolder/languages/Admin.english.php and ThemeFolder/languages/index.english.php
I would like to create (at least) 2 settings pages for my mod, 1 pre-install and 1 post-install.
Holding my hands out for tips on this subject.
My menu uses almost the same <ul> structure as is found in ThemeFolder/index.template.php:template_menu().
Some changes had to be made to get rid of the extra <span> inside the <a> of a menu item. This extra <span> caused my animation to reset if you hover over the label text. The changes fix that.
In the <head>, ThemeFolder/index.template.php:template_html_above(), I call up
onload the relevant javascript for my menu and buttons, initialize the settings for the menus used on the page, and then initialize the menus. It's short code.
As for total size, it's under 50kb of uncompressed javascript. No other js dependencies.
And the artwork for an interesting button / menu weighs in at 100-200kb per theme.
If you want to put fluent video on the button / menu, then you're looking at 1 to 2mb per theme.
Themes can be used by both buttons and menus.
To-do list (as far as I can see now):
1) Get my menus to show faster at onload
2) Add the "selected item" feature to my menu component. Selected menu items should appear with a different color / animation. Most of the code for this is ready.
3) replace smf buttons "add poll", "notify", "mark all messages read" with my button component which has the same animation features as my menu
4) figure out how to put a mod of this together. The first hurdle I see here is those 2 settings pages, 1 for pre-install, 1 for post-install.