Forum:Beyond the Wiki-navigation limits


 * Note. See also: Forum:MediaWiki:Wiki-navigation has lost some menus on the Cannabis Wiki.

What We Know
This section will be updated as more information becomes apparent.

After experimenting with MediaWiki:Wiki-navigation, the following has been discovered:
 * More than four dropdown menus can be used on the navigation bar. Use *** instead of *.
 * Each dropdown can have more than seven links. Use **** instead of **.

These can be combined together to form the following example code:

***Menu 1 ****Link 1 ****Link 2      etc....

These techniques can now be used to make navigation on any wiki easier.

Eladkse @Project Holby 17:15, December 22, 2010 (UTC)


 * Fandyllic has also told me that font size, color and style can be customised using the following on Wikia.css:

 /* Change menus */ .WikiHeader li { color:red; font-family:Comic Sans MS; font-size:normal; }

/* Change menu items */ .WikiHeader .subnav li a { text-align:center; }


 * My old way was to use HTML, but this is a lot easier and safer. Eladkse @Project Holby 17:17, December 22, 2010 (UTC)


 * Here is CSS to over-ride menu and menu item highlight colors (from Forum:Scroll color in menu):

 /* Menu highlight - this is example is light red/pink */ .WikiHeader li:hover { background-color: #EFCCCC; background-image: -moz-linear-gradient(center top, white 0%, #EFCCCC 100%); }

/* Menu item highlight - this is example is light red/pink */ .WikiHeader .subnav a:hover { background: none repeat scroll 0 0 #EFCCCC !important; }
 * is the color . -- Fandyllic  (talk &middot; contr) 11:08 AM PST 22 Dec 2010

Discussion
This is probably a violation of Wikia's ToU, but Eladkse has found a workaround to the 7 item limit for the 4 dropmenus modified in MediaWiki:Wiki-navigation.

From Forum:Can_sidebar_site_navigation_be_returned_in_a_show/hide_box?:
 * A fix for the 7 link limit is to use three stars instead of two in the source code. I use this method on Casualty Wiki to get all 25 series onto one menu. Eladkse 11:30, December 20, 2010 (UTC)

See it working at Casualty Wiki.

-- Fandyllic  (talk &middot; contr) 11:32 AM PST 20 Dec 2010


 * Honestly, I only reallised that there was a 7 link limit when I read that forum today. Do tell me if it's a ToU violation so that I can fix my wiki code. Eladkse 21:03, December 20, 2010 (UTC)


 * I'd rather have Wikia tell us.
 * Here is the relevant part of the Wikia Terms of Use:
 * Not intentionally block, remove, or otherwise obstruct the proper functioning and view of advertisements, and/or user interface and functionality by other users, including but not limited to changing or adding javascript or CSS changes to the Service that would prevent the proper display or function of advertisements and/or user interface and functionality.
 * From my reading this does not violate this policy as written above, but the scary part of the above is the "including but not limited to" and "proper" part of the language which is a gigantic loophole for Wikia to enforce whatever it wants.
 * -- Fandyllic  (talk &middot; contr) 1:43 PM PST 20 Dec 2010


 * Update: After experimentation, I have found that you can also get more than four dropdowns! Just use three stars for the 'top level' items and four stars for the links.




 * However, the dropdowns are limited by space in the header. Realistically, the maximum of dropdowns you could use is five. Eladkse 21:20, December 21, 2010 (UTC)


 * You are sneaky! ;-) -- Fandyllic  (talk &middot; contr) 1:58 PM PST 21 Dec 2010


 * Most useful find since Oasis. Thank you Eladkse. Now people can actually use our navigation as intended. 00:12, December 22, 2010 (UTC)


 * In regards to whether this actually violates the ToU, I'm led to believe it isn't:
 * Extra buttons or links added to the interface (Javascript): Admins on wikis also have the ability to tweak their wikis via Javascript. For example, this might be used to add in extra links to the wiki interface. We recommend against this, except in your personal Javascript, because changes to Wikia may affect your code. We always try to avoid this, but if you do use Javascript in this way, you should be aware of that risk.


 * --D. (talk · contr) 00:38, December 22, 2010 (UTC)


 * But Eladkse's method doesn't involve Javascript changes, so the statement above is still not directly applicable. Unless, Wikia didn't mean Javascript specifically, although it was mentioned 4 times. -- Fandyllic  (talk &middot; contr) 4:46 PM PST 21 Dec 2010

(unindent). Thanks for figuring this out! I was able to add many navigation menus in the top bar. See:
 * http://cannabis.wikia.com/wiki/Main_Page
 * http://cannabis.wikia.com/wiki/MediaWiki:Wiki-navigation

Depending on the minimum font size you use in your browser you can see more or less menus before they are covered up by the "random page" and "wiki activity" buttons. Menus extend past those buttons to the right. A horizontal scroll bar will show up if you put your mouse over there. It would be nice if we, or the staff, could move those buttons somewhere else.

If you put your mouse at the very bottom of the menu bar right at the line at the bottom, then all the menus will drop down. Even the ones partially covered by the "random page" and "wiki activity" buttons. --Timeshifter 02:28, December 22, 2010 (UTC)


 * Oh my god Timeshifter, your wiki's main page, my eyes, ahhhh. I guess its not meant for the non-potheads to like. 03:08, December 22, 2010 (UTC)


 * Some people like it. Let me know your thoughts here:
 * http://cannabis.wikia.com/wiki/User_talk:Timeshifter --Timeshifter 03:30, December 22, 2010 (UTC)


 * This is getting better and better. You can increase or decrease the font size of the dropdowns and links using the font size tag:




 * This means more dropdowns can fit into the space available. Eladkse @Project Holby 11:34, December 22, 2010 (UTC)


 * Font and colour can also be changed. See the new section above for details. Eladkse @Project Holby 13:17, December 22, 2010 (UTC)
 * Links and wordwrapped dropdowns can now be aligned left, right or center. Eladkse @Project Holby 13:53, December 22, 2010 (UTC)
 * While the above will work, it's actually safer and more flexible to use CSS over-rides.

 /* Change menus */ .WikiHeader li { color:red; font-family:Comic Sans MS; font-size:normal; }

/* Change menu items */ .WikiHeader .subnav li a { text-align:center; }
 * You can test this at Special:MyPage/wikia.css. -- Fandyllic  (talk &middot; contr) 8:43 AM PST 22 Dec 2010


 * Oops. Didn't know about those. I was just adding code to the section as I was experimenting with html/wiki codes. The CSS is a lot easier. Eladkse @Project Holby 17:14, December 22, 2010 (UTC)

Setting bar text properties
How would I set the font size in the top bar so that it is always smaller text? People are used to small text in menus even when they set their browser to use a larger text for the main body of a page. --Timeshifter 12:59, December 24, 2010 (UTC)


 * What specifically do you mean by the "top bar"? The "Wikia" top bar or the wordmark one? -- Fandyllic  (talk &middot; contr) 8:13 AM PST 24 Dec 2010


 * Have you tried the CSS code in the top section?
 * If so and it doesn't work, you could also try this method:
 * Edit Mediawiki:Wikia-navigation
 * On each label you want smaller size on put the following:




 * Save and refresh.
 * I'm not an expert at these sorts of things, but this should help. Eladkse @Project Holby 17:34, December 24, 2010 (UTC)


 * Here are example CSS to change the various font size of the two bars of menus at the top of the page.

 /* Sets font size for "Wikia" bar menu items */ .GlobalNavigation > li > a { font-size:14px; }

/* Sets font size for account link and login/logout (I think) */ .AccountNavigation > li > a { font-size:12px; }

/* Sets font size for wordmark bar menu items */ .WikiHeader li a { font-size:18px; }
 * -- Fandyllic  (talk &middot; contr) 4:53 PM PST 24 Dec 2010

(unindent). Thanks for all the help! I experimented here:
 * http://cannabis.wikia.com/wiki/User:Timeshifter/wikia.css

It seems that when there is no added CSS that the topmost Wikia menu text size is set for around 15px by Wikia. Normal (not advanced) Firefox font size settings do not effect it.

The wordmark bar menu item text size is set to 12px by Wikia. Normal (not advanced) Firefox font size settings do not effect it either.

On the other hand the wordmark bar menu headings (not the items within menus) follow the Firefox font size setting. Firefox will allow one to set the heading font size all the way down to 9px (as small as Firefox will go), and the menu headings will get that small. The individual items within the site navigation menus remain at 12px.

Firefox has an advanced font setting called "minimum font size". That will override all Wikia settings. Nothing added to User:Timeshifter/wikia.css changes the "minimum font size" set by Firefox. The Firefox setting of "Allow pages to choose their own fonts, instead of my selections above" also does not override the "minimum font size" set by Firefox.

User:Timeshifter/wikia.css does allow one to set a wordmark menu heading font size that is not overridden by normal (not advanced) Firefox font sizing. So for consistency between headings and menu items I added the following CSS to MediaWiki:Common.css
 * http://cannabis.wikia.com/wiki/MediaWiki:Common.css

/* Sets font size for wordmark bar menu headings */ .WikiHeader li a { font-size:12px; }

--Timeshifter 08:28, December 25, 2010 (UTC)


 * I may be adding, removing, or changing the WikiHeader CSS.


 * I removed the WikiHeader CSS. I think Wikia may have set the WikiHeader font size to 12px since I wrote my comment Dec. 25. The WikiHeader navigation menu headings are no longer effected by normal Firefox font size options. That is a good thing since it looks like both the navigation menu headings and items within are now hard-coded to 12px. --Timeshifter 06:24, December 26, 2010 (UTC)

Hiding or moving Random Page and Wiki Activity buttons
I'd like a way to block or move the "Random Page" and "Wiki Activity" buttons. Any ideas? --Timeshifter 08:28, December 25, 2010 (UTC)

I'm pretty sure this is a ToU violation, but here's how I think you do it (it works, but I'm a little worried that it's hiding buttons I wasn't looking for). If anyone could do some testing around this and tell me any unexpected buttons that also disappear, I can try to make the CSS more specific. Of course, you could also use Special:Contact. /* Hide Random Page and Wiki Activity buttons */ div.buttons .secondary { display: none !important; } -- Fandyllic  (talk &middot; contr) 8:29 AM PST 25 Dec 2010


 * Thanks. This CSS worked in both Firefox and in Internet Explorer. I clicked Ctrl-F5 in both browsers. At this page:
 * http://cannabis.wikia.com/wiki/User:Timeshifter/wikia.css --Timeshifter 19:57, December 25, 2010 (UTC)

(unindent). After reading this forum thread I removed the "div". This also works in both browsers (I have to remember to log in from Internet Explorer, too):

/* Hide Random Page and Wiki Activity buttons */ .buttons .secondary { display: none !important; } --Timeshifter 12:34, December 27, 2010 (UTC)


 * You can move the buttons down below your giant nav menu with this:

.WikiHeader .buttons { bottom: -10px; }
 * not sure this way is a ToU violation, since the header height is variable.--Sxerks 18:07, December 25, 2010 (UTC)


 * Try the -10px that I changed it to, that seems to work.--Sxerks 19:36, December 26, 2010 (UTC)
 * worked better for me. -- Fandyllic  (talk &middot; contr) 4:20 PM PST 26 Dec 2010


 * Yes, the  looks better to me, too. It does not work though if the Firefox minimum font size setting is at 13px or above. Then the buttons again block the site navigation menus. I bet the 2 buttons are allocated a limited horizontal space. Then the 2 buttons have to stack vertically when the larger text causes the combined button width to surpass the allocated horizontal space. Is there a way to use CSS to allocate more horizontal space for the buttons?


 * I noticed the same problem with "pages on this wiki" needing 3 lines instead of 2 if the Firefox minimum font size setting is at 13px or above. Also, it looks tacky due to the "shouting" nature of using all-caps that is emphasized whenever anything other than a small font size is used: PAGES ON THIS WIKI. See the main page to see what I mean:
 * http://cannabis.wikia.com/wiki/Main_Page --Timeshifter 12:13, December 27, 2010 (UTC)

(unindent). Is there a way to move the buttons elsewhere? Maybe to the blank area in either top bar.--Timeshifter 20:00, December 25, 2010 (UTC)


 * Moving them would probably require Javascript. The initial CSS I posted works for me in Firefox to hide the buttons. I can't test IE, because I only have access to a Mac ATM, and to be honest, it is very low on my priority list. -- Fandyllic  (talk &middot; contr) 9:27 AM PST 26 Dec 2010


 * I forgot to log in one of the times I was looking at the page via Internet Explorer. Your initial CSS works in both browsers. Is the "div" part necessary for anything? I noticed that your CSS works with or without it. I like the idea of moving the buttons below the site navigation menus. There is room there, but there are problems. See my latest notes about it above. For now I added the  CSS here:
 * http://cannabis.wikia.com/wiki/MediaWiki:Wikia.css --Timeshifter 12:32, December 27, 2010 (UTC)


 * I used the div to be more specific about which buttons I was trying to affect, but it may not be necessary. -- Fandyllic  (talk &middot; contr) 1:28 PM PST 27 Dec 2010

(unindent). I installed Firebug. I think I figured out how to adjust the width allocated to the 2 buttons. Increasing the width to 290px allows use of larger fonts up to 18px. I am talking about "Minimum font size" in Firefox options (content tab, and then the "advanced" button).

/* === Move Random Page and Wiki Activity buttons down === */ .WikiHeader .buttons { bottom: -14px; width: 290px; }

The CSS and the latest site navigation menus are found here:
 * http://cannabis.wikia.com/wiki/MediaWiki:Wikia.css --Timeshifter 11:21, December 28, 2010 (UTC)

Still transparent
As posted previously, the Navigation drop-down menus are transparent, even when given a background color. That disables whatever item can't be selected because it does not show. I followed the link here to the 'Casualty' wiki, and it was true there. This is not my fault, it is not the fault of "my browser" which is used by 45% of all viewers worldwide, it is not the fault of my computer. It is true, it is not good, and it is not changed by changing the number of items, their color or their background, or the text size.

And I would like it to not be true, for any wiki, any computer, any browser. - Thumlyly Dec. 26, '10


 * So much text and so little information. Please be more specific and less elliptical. What are "the Navigation drop-down menus"? The ones to the right of the Wikia logo or the "Community Central" logo? What browser are you using specifically (if it is IE6, you have my sympathies, but not my help)?
 * Lastly, helping people on this forum is voluntary. You are not entitled to help, so it is to your benefit to be as polite as possible and give as much info as you can. -- Fandyllic  (talk &middot; contr) 11:09 PM PST 26 Dec 2010


 * As posted previously, you did not provide links to the wiki in question and you did not specify what browser you are using. Even though 45% of all viewers worldwide seem to be using it, you're the only one reporting a problem with it, so it's only reasonable to think that IT IS a problem related to your browser/computer/plugin/additional script/excess code in your personal wikia.js or wikia.css pages. If posting that information is a problem you could at least post a link to a screenshot of it, so that we can have a basic idea of what the issue is. Sovq 22:20, December 27, 2010 (UTC)

Bold Tag
Is there any way apart from the bold tag to make a section of text bold? The tag does not work on the naviagtion. Eladkse @Project Holby 12:13, January 8, 2011 (UTC)


 * Forget that, I managed to use the img tag to insert the actual image I was replicating using text. Eladkse @Project Holby 13:32, January 8, 2011 (UTC)
 * For the future,  will bold text.
 * I know. It just doesn't work on the Wiki-navigation code. Eladkse @Project Holby 14:54, January 8, 2011 (UTC)
 * Use CSS:
 * ...or something like -- Fandyllic  (talk &middot; contr) 7:10 PM PST 9 Jan 2011

What Is The Limit?
If the limit isn't seven items then what is the limit to how many pages it can link to? Dustpelt A Wikia Contributor


 * Items can't be seen that extend past the edge of your screen. Also, if the reader is using larger font sizes in their browser, then less items will be seen. I am talking about the "minimum font size" setting in the advanced font options in Firefox. --Timeshifter 20:19, January 9, 2011 (UTC)

Helpful info consolidated
Please see:
 * http://cannabis.wikia.com/wiki/Wiki_tools --Timeshifter 12:14, February 9, 2011 (UTC)

Tooltips in the menu buttons
Does anyone know if it's possible to add CSS tooltips to the navigation buttons? I was loking for a way to add a second-level menu like we had in monaco, and I thought of trying to do it with tooltips.

Unfortunately I couldn't make it work. Perhaps someone might be able to figure something out? -- 22:20, February 18, 2011 (UTC)


 * I doubt that would work. Most tooltips don't let you click in them, because they position themselves based on where the cursor hits the hot area. -- Fandyllic (talk &middot; contr) 18 Feb 2011 6:02 PM Pacific


 * See http://cannabis.wikia.com/wiki/Wiki_tools#Submenu_possibilities --Timeshifter 04:36, February 19, 2011 (UTC)