Some of the drop-in templates allow you to click the menu header to shrink the menu to a button.

My guild has asked if I can set that up with the template we're using now (Deathwing). I made my brain hurt for the last 2 hours trying to figure it out and only determined I need to edit the menu.html file to make it work and other menu.html files that do have that clicky clicky don't work.

So.. how do I do this?

Also, can I have some menus default to closed and some open?

By far, the easiest way for you to do this would be to add the following to the bottom of your site's layout:

<script type="text/javascript">
	jq_preload(function(){
		jq(".menu > .menucat")
			.css("cursor","pointer")
			.click(function(){ jq(this).siblings(".menuchoice").slideToggle() });
	});
</script>

This doesn't toggle any on or off by default, but you can do this by adding something like the following to the bottom of your layout as well for each menu you wish to hide:

<script type="text/javascript">
	jq_preload(function(){
		var tohide = ["Facebook","Current Progression"];
		for(i=0;i<tohide.length;i++)	
			jq('.menu .menucat:contains(' + tohide[i] + ')')
				.siblings(".menuchoice")
				.hide();
	});
</script>

In the case above, it will automatically close the Facebook, and Current Progression menus. Modfying the tohide list (var tohide = ["Facebook","Current Progression"]) to add or subtract any particular items will hide any listed items by default.


That said, making it remember your settings with cookies is a more advanced topic. For that I'd recommend reading the showhide.js file found in some of the new templates. That'll help you understand the cookie system with javascript.

Chops, in line with this, is there a way to make certain menu items non-shrinkable?

Edit: For example, I want the donate button to always be visible.

Bumping because I would still like to make my Donation menu item not hidable.

Yeah, it's possible, here's the javascript you can add to do this:

jq_preload(function(){
    jq(dge("LDonate to Malice Website"))
        .unbind()
        .attr("onclick","")
        .css("cursor","auto");
    jq(dge("MDonate to Malice Website")).show();
});

Thanks, Chops!! You're the bomb as always!

Did some hackage and got it all working.

I basically edited a copy of showhide.js and then adjusted my menu, layout and css accordingly.

Thanks for the pointer

Excellent!