[Tip] Drop Down Menu Tutorial (..for all themes)

[Dark-Skript]

any ideas how to edit for darkbreak theme? http://www.dzinerstudio.com/index.php?action=tpmod;dl=cat60 [nofollow]

[Antechinus]

I've already done a drop menu for Darkbreak. It's over at Dziner in the Darkbreak board.

[Foreclosurepedia]

I really messed up I think and I hope someone still reads this thread.  It all works except I get two menus!  The top menu I need to get rid of.

My site is http://www.ibrr.org/forum/.  The theme is Intifada.  The SMF Version is 1.1.9.  PLEASE HELP!!!  I would've included the files I modified, but didn't know how.  I did notice that the line item section @407 is similar to the next section in 538.  The 407 section has my treasury link that I want to keep and incorporate and simply do away with the register and login as I have simpleportal that does that stuff.  Mnnn, I lost my simpleportal forum button, too.  Sorry I am such a looser. 
This starts in the line 407 section  note:by some fluke I got the gallery button to add from reading thru here.

ok, fixed it on the fly.  found out I copied in the 538 section.  now the only thing I need to do is figure out how to move the donations button to where the logout button is, add a forum button and remove the other logout button.

So, I guess here's a shining example of a novice at work?

[Foreclosurepedia]

so, i fixed it all and learned on the way!!!  i guess i just needed somewhere to put my thoughts.  if someone can read thru all the modifications to the post you'll laugh yourself to death!  thanx for being here!  and i love ur program!  i just can't tell you how i did anything!  i am willing to copy all th efile stuff if anyone needs info for the intifada theme, though.

[SteveFJ]

i've read this topic through, and I'm sorry if I've missed something somewhere along the way.

I would be interested in a dropdown menu for the main menu and the boards using 2.0 RC1. That in the mod section doesn't appear to work with RC1 - I get a warning not to proceed when I try to install it. and the BK support site has been suspended at this time - it's been about a week now.

The template I'm using is based on the Babylon Theme

http://sv11.byethost11.org/suspended.page/

If anyone can advise me on this it would be most appreciated.

Many thanks
Steve J

[SteveFJ]

I've now got this to work by placing the script in the default indextemplate.php and then copying this file to replace the one my site is using. but I'm not at all sure how I can include the boards in the dropdown list too.

Any help would be great.
Many thanks.

[Antechinus]

Boards? What exactly do you want to do?

[SteveFJ]

Hi, thanks for replying.
I would like to include the list of boards in the dropdown menu.

[Antechinus]

Oh. Ok, can be done but is going to be a pretty big drop menu and frankly I doubt the utility of it since the boards are available on the index anyway. Up to you though.

For SMF 2.0 all the menus are controlled in Sources/Subs.php. You can add boards just like adding any other url. This is an example of a drop menu link from under the Profile tab:

Code Select Expand

'profile' => array(
'title' => $txt['forumprofile'],
'href' => $scripturl . '?action=profile;area=forumprofile',
'show' => allowedTo(array('profile_extra_any', 'profile_extra_own')),
),

To do a board (number 4) under that tab you would use something like this:

Code Select Expand

'profile' => array(
'title' => $txt['whateveryouwanttocallit'],
'href' => $scripturl . '?board=4.0',
'show' => true,
),

That would display the board to all members and guests. Of course you'd have to make the $txt string and put it in languages/ThemeStrings.english.php.

[SteveFJ]

Thanks very much for your help. I'll have a look at that.

The reason why I want the dropdown menu is because I've removed the jumpto feature due to its  styling abilities not being fully supported. In some browsers it's still prone to look naff, particularly when the colours around it don't go with it.

It's for an art forum, with the boards according to medium. Maybe a dozen boards at most.

Thanks again. 

[Antechinus]

Cool. Sounds ok. Have you tried styling the selects in style.css? You can do quite a bit with css, even down to individually styling each select and/or input.

[SteveFJ]

No I can't say that I have. I tried what you have written there, and it went a bit pearshaped.
I must admit I'm in two minds now anyway about the dropdown because the code is outside of the theme. It'll need replacing everytime there is an update.

I'll do a bit of reading I think. What you have suggested there on selects has got me intrigued. If I can do it that way, then that might be my better option.

Thanks again Antechinus

[Antechinus]

How do you mean outside the theme? If you mean the menu content is controlled in Sources that shouldn't matter unless the update affects that section of that file. If it doesn't (and updates are unlikely to re-write the menu) then the patch should work around your edits. In any case you can backup the file before any updates and then copy/paste the menu code back in if necessary.

When you say "pear-shaped", exactly what happened?

[SteveFJ]

Outside of the theme being elsewhere than the template theme.

I got an unexpected ; and an unexpected ) message. Not sure what I was doing really though. HTLML and CSS is currently where I'm at. I haven't really messed about with Php and Javascript that much.
I've now found this:

http://ago.tanfa.co.uk/css/examples/menu/tutorial-h.html#hs3

It's a CSS dropdown menu tutorial.

It might be ideal for just adding the boards.

[Antechinus]

That will drive you mental trying to integrate it with an SMF theme, unless you're pretty good at adapting things. In any case it just gives a basic box menu without any real styling. There are already a stack of examples in this thread. I've done Babylon for 2.0 and you said your template was based on Babylon.

The error you got must have just been a basic syntax error and should be easy to fix. Exactly what code where you trying to use?

[SteveFJ]

They were  syntax error4

Code Select Expand

               'forum' => array(
                  'title' => $txt['whateveryouwanttocallit'],
                  'href' => $scripturl . '?board=1.0',
                  'show' => true,
               ),

Oops posted before ready so this is an edit:
I added that to the end of the one for the forum.

It is based on Babylon becase that's the one I think is the best. My site doesn't look anything like that now though.

There might be lack of styling in the css but a background image can be added to spruce it up. Until you mentioned it though I didn't know css could create a dropdown menu. It must have a disadvantage though because Javascript wouldn't have been used to make something that works better... I think. 

[Antechinus]

That bit is ok. How were you putting it under the forum button itself? What was the complete code for the whole thing?

[SteveFJ]

I've since editted that last reply as I posted it accidentally.

This is one of the configurations I tried, showing the whole string for that section:

Code Select Expand

'forum' => array(
'title' => empty($txt['sp-forum']) ? 'Forum' : $txt['sp-forum'],
'href' => $scripturl . ($modSettings['sp_portal_mode'] == 1 ? '?action=forum' : ''),
'show' => in_array($modSettings['sp_portal_mode'], array(1, 3)),
'sub_buttons' => array(
),
               'forum' => array(
                  'title' => $txt['whateveryouwanttocallit'],
                  'href' => $scripturl . '?board=1.0',
                  'show' => true,
               ),
),

[Antechinus]

Yep, basic error. Do it like this instead:

Code Select Expand

         'forum' => array(
            'title' => empty($txt['sp-forum']) ? 'Forum' : $txt['sp-forum'],
            'href' => $scripturl . ($modSettings['sp_portal_mode'] == 1 ? '?action=forum' : ''),
            'show' => in_array($modSettings['sp_portal_mode'], array(1, 3)),
            'sub_buttons' => array(
                  'forum' => array(
                  'title' => $txt['whateveryouwanttocallit'],
                  'href' => $scripturl . '?board=1.0',
                  'show' => true,
               ),
         ),

You had a closing ), before the drop code. It wouldn't like that. 

CSS is great for drop menus and javascript is only necessary to get them to work in IE6 or earlier (because it's a bit dodgey calling elements on hover), and even then you only need a few short lines of js to haul out one or two elements. Other than that a well made css menu will be fine in all browsers.
I did Babylon for 2 Beta 4 here: http://www.simplemachines.org/community/index.php?topic=253756.msg1780206#msg1780206
That didn't have the js for IE6 and earlier though, plus I could do better code now anyway. Might have a look at it this week.

[SteveFJ]

You're a star. Most appreciated. I'll look at that tomorrow as it's a bit late in the UK now - 1.30.

What you have said there is very interesting. IE7 does display the css dropdown menu properly without having to take it into account coding wise. So dropdown menus in Javascript could become obsolete in theory.