[How To?] Dropdown list in header (1.8.7.)

[thelovelyone]

Hello,

i am looking for an up to date drop down list method for mybb that is working properly, i've looked into several threads and tried them, but most of are either made for 1.6 or do not work well on the most recent mybb version.

i would appreciate if someone makes a small tutorial with the adequate codes working for mybb 1.8.7.

[Ashley1]

What do you want to put in the drop down list ?

This will do it, you can just place a drop down into the navigation bar:
https://community.mybb.com/thread-194906.html

[thelovelyone]

Mhm. I wanted to add a drop down list here(replacing them):



Basically like this:

Options(click for dropdown)
-User cp
(-Mod cp)
(-Admin cp)
-Private Messages
-Buddy List
-Todays Posts
-New posts

Not sure what to take out of your tutorial.

[Ashley1]

Using the W3 framework, the dropdown will look something like this:

<div class="w3-dropdown-click">
  <button onclick="myFunction()" class="w3-btn">Click Me</button>
  <div id="Demo" class="w3-dropdown-content w3-card">
    <a href="{$mybb->settings['bburl']}/usercp.php" class="usercp">{$lang->welcome_usercp}</a>
    {$modcplink}
    {$admincplink}
    <a href="#" onclick="MyBB.popupWindow('{$mybb->settings['bburl']}/misc.php?action=buddypopup&modal=1', null, true); return false;">{$lang->welcome_open_buddy_list}</a>
    <a href="{$mybb->settings['bburl']}/search.php?action=getnew">{$lang->welcome_newposts}</a>
    <a href="{$mybb->settings['bburl']}/search.php?action=getdaily">{$lang->welcome_todaysposts}</a>
    <a href="{$mybb->settings['bburl']}/private.php">{$lang->welcome_pms}</a> {$lang->welcome_pms_usage}
  </div>
</div>

<script>
function myFunction() {
    var x = document.getElementById("Demo");
    if (x.className.indexOf("w3-show") == -1) 
        x.className += " w3-show";
    else 
        x.className = x.className.replace(" w3-show", "");
    }
}
</script>

[thelovelyone]

Can you explain abit precisely what to place where.

How it looks for me rn: