Looking for mod to add normal & collapsable menu buttons

[JohnWayne999]

Hi,

Currently my menu has these buttons: Home, Help, Search, Profile, My Messages, Calendar, Members, Logout

1) Is there a mod that will help me insert two additional buttons to this shown above?
I want to have the freedom to choose where the two new buttons will sit in relation to existing ones.
For example I want to have Chatroom in between Search and Profile, and then MUD in between say Calendar and Members.

I don't want to go into the code of themes etc. I am after a simple mod that will do the job for me for SMF 2.0.1

2) Suppose now I want to create a third button called Games (say between Members and Logout) and it needs to be collapsable ie. when user places mouse over it, I want it to automatically show a drop down menu listing all the games I have installed (I will supply the URLs for each game). Is there a mod for this also please?

Thanks.

[Illori]

take a look at How do I add buttons to SMF 2.0

[JohnWayne999]

Ah excellent. Thanks Illori.

Just in case some people have trouble, here is how I set up my additional menu and submenus. I'm using SMF 2.0.1. The file to edit is: /Sources/Subs.php

I added:
(1) Flashchat button which has no submenu, and upon clicking it, opens up Flashchat chat room. A very straightforward button. No tricks. Done like this:

Koodi [Valitse] Laajenna

'flashchat' => array(
'title' => 'Flashchat',
'href' => 'http://gpland.org/flashchat/flashchat.php',
'show' => true,
),


(2) The second button I added was "Games" under which there are currently 2 games available: Black Jack and Dead Souls MUD. Done like this:

Koodi [Valitse] Laajenna


'games' => array(
'title' => 'Games',
'href' => $scripturl,
'show' => true,
'sub_buttons' => array(
'black_jack' => array(
'title' => 'Black Jack',
'href' => 'http://www.gpland.org/21/21.php',
'show' => true,
'is_last'=> false,
), //end submenu 1

                                        'dead_souls' => array(
'title' => 'Dead Souls MUD',
'href' => 'http://118.139.160.127/anyterm/anyterm.shtml',
'show' => true,
'is_last'=> true,
), //end submenu 2
),
),


When the user hover his/her mouse over the button 'Games', a drop down menu automatically appears showing the two games.
Notice I changed the first submenu's is_last to false, and also kept all variables without spaces.
In terms of referring to URL, I was lazy and just quoted the exact URL rather than using what $URL variables SMF has. Worked out alright for now. So I didn't dwell on that any longer.
Second note: the "http://www.gpland etc etc" is the link to MY actual chatroom and games. You need to put in the URL for YOUR stuff otherwise your people may end up at wrong places. Note 3: The Anyterm part is just a fancy tool for letting people telnet onto your server using their internet browser.

Just another question now. I want Flashchat to spring up a new window that has no URL bar, no navigation buttons, no scroll bars, but just a simple boring frame (window) that will contain the chatroom and is separate from the forum window. How do I establish this please? ie. I do not want the member to lose his/her current forum page. I want a separate Chat window to pop out. But I want this pop out window to be so featureless it is basically just a frame with at most 'minimise/maximise/close' buttons and the rest is all chatroom. Thanks.

[Illori]

i dont know the exact code but you would need some js to put in the href part of the code, some googling should help you find out the code.

[JohnWayne999]

Yea you are right. Looks like href itself alone is incapable of force popping up another window.

POPUP TAB
I tried a couple of ways and they only ended up opening another tab. Just in case anyone is interested in opening their clicked button into a new tab, it's very simple. Just insert something infront of the second last byte (the single quotation mark).

For example in my case, I wanted Anyterm to open in an adjacent tab rather than steer away from current window.

Change this line

Koodi [Valitse] Laajenna

'href' => 'http://118.139.160.127/anyterm/anyterm.shtml', to this line

Koodi [Valitse] Laajenna

'href' => 'http://118.139.160.127/anyterm/anyterm.shtml" target="_blank',


In otherwords you are only inserting in front of the last single quotation mark this

Koodi [Valitse] Laajenna

" target="_blank Looks a bit funny but it's meant to be like that. It will work just fine.



REAL POPUP WINDOW
In order to do a real pop up window (not just tab), you'd really have to rely on javascript. This can also be done surprisingly easily by inserting just half a line. The way I did it to Flashchat was this: replace this

Koodi [Valitse] Laajenna

'href' => 'http://gpland.org/flashchat/flashchat.php', with

Koodi [Valitse] Laajenna


  'href' => "http://gpland.org/flashchat/flashchat.php\" target=\"ChatWindow\" onClick=\"window.open('','ChatWindow','height=570,width=850,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=yes');",

For your convenience (see below), I've swapped the URL out with UUUUURRRRRLLLLL. You just need to replace UUUUURRRRRLLLLL with the URL you want. For example in my case, I would exchange UUUUURRRRRLLLLL with http://www.gpland.org/flashchat/flashchat.php
Note also good news that Flashchat won't ask you to sign in. If you are already logged in to SMF, Flashchat will recognise you even in another window (the popup window). 

Koodi [Valitse] Laajenna


  'href' => "UUUUURRRRRLLLLL\" target=\"ChatWindow\" onClick=\"window.open('','ChatWindow','height=570,width=850,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=yes');",

If you are really using Flashchat like me, you'll notice with this sized window, about 10% of Flashchat is outside of the frame such that user needs to scroll. One way ofcourse is to make the window bigger. Alternatively iframe should be able to scale the whole chatroom such that you see the entire chatroom in a given confined space.

(Credit goes to Veronia of http://webdeveloper.com/forum/showthread.php?t=200315 for Flashchat popup)



MENU WITHIN MENU
Basically submenus. Suppose I now want to have a menu that says "Games" under which are submenus that say "Action", "Cards" etc. different categories of games and under each of these categories are lists of actual games. For example under Games -> Cards I want to have "Poker", "Big2", "Black Jack", "Solitaire" etc. such that the submenu is like
     Games -> Cards -> Poker
     Games -> Cards -> Big2
     Games -> Cards -> Black Jack
     Games -> Cards -> Solitaire

and for Action category will be
     Games -> Action -> Action game 1
     Games -> Action -> Action game 2 so on

Here is how you do it: First open the file Subs.php under /Sources (I'm using SMF 2.0.1 by the way).
You'll find sections of code for menu buttons such as Profile, Admin, Members, Logout etc.
I will place my Games menu just before Members menu.
So I looked for members code first, which looks like this:

Koodi [Valitse] Laajenna

'mlist' => array(
'title' => $txt['members_title'],
'href' => $scripturl . '?action=mlist',
'show' => $context['allow_memberlist'],
'sub_buttons' => array(
'mlist_view' => array(
'title' => $txt['mlist_menu_view'],
'href' => $scripturl . '?action=mlist',
'show' => true,
),
'mlist_search' => array(
'title' => $txt['mlist_search'],
'href' => $scripturl . '?action=mlist;sa=search',
'show' => true,
'is_last' => true,
),
),
),

Insert before it, this piece of game menu code

Koodi [Valitse] Laajenna


'Games' => array(
'title' => 'Games',
'href' => '',
'show' => true,
'sub_buttons' => array(
'Action' => array(
'title' => 'Action',
'href' => '',
'show' => true,
                                   'sub_buttons' => array(
'Action game 1' => array(
'title' => 'Action game 1',
'href' => '',
'show' => true,
), //close Action game 1

'Action game 2' => array(
'title' => 'Action game 2',
'href' => '',
'show' => true,
), //close Action game 2

'Action game 3' => array(
'title' => 'Action game 3',
'href' => '',
'show' => true,
), //close Action game 3
), //close inside sub_buttons
), //close Action games category


'Cards' => array(
'title' => 'Cards',
'href' => '',
'show' => true,
                                   'sub_buttons' => array(
'Card game 1' => array(
'title' => 'Card game 1',
'href' => '',
'show' => true,
), //close Card game 1

'Card game 2' => array(
'title' => 'Card game 2',
'href' => '',
'show' => true,
), //close Card game 2

'Card game 3' => array(
'title' => 'Card game 3',
'href' => '',
'show' => true,
), //close Card game 3
), //close inside sub_buttons
), //close Card games category


), //close outside sub_buttons
), //close game array


Save, and now you will see the menu called "Games" before Members.
Hover mouse over Games and you will see submenus: Action and Cards.
Hover over Action you will have buttons: Action game 1, Action game 2, Action game 3.
Likewise hover Games -> Cards -> you will have Card game 1, 2, 3.

I haven't put in any links yet, but for example if you want Games -> Cards -> Card Game 3 to be renamed to "BWM" and point to http://www.bmw.com, then simply modify code

Koodi [Valitse] Laajenna

'Card game 3' => array(
'title' => 'Card game 3',
'href' => '',
'show' => true,
), //close Card game 3
to this

Koodi [Valitse] Laajenna

'BMW' => array(
'title' => 'BMW',
'href' => 'http://www.bmw.com',
'show' => true,
), //close Card game 3 now renamed to BWM

Hope it's not all too confusing. Feel free to check out what the submenus look like on my website, if I haven't changed them again. There might be mods floating around to do the job for you, but I reckon part of the fun is playing with the code itself. Be careful about the round brackets and commas. If you are used to C then your finger might automatically put in } or ] and ; for you but here we want the round bracket and normal comma.