Forum:Tabber issues.

When I checked in on the Mega Man Wiki Tuesday morning, every tabber or last tabber on a page (if there is more than one set) now have extra tabs simply labeled 1, 2, 3, etc. They pop up about a second after everything else on the page (including the tabs that should be there) have loaded.

Here are pages with the issue:
 * A page with a single tabber in use.
 * A page with multiple tabbers.

This just suddenly happened and I am at a loss of what the problem could be. No changes have been made to tabbers css or javascript. -- Udana 01:32, March 29, 2012 (UTC)


 * They look fine. At least right now. --


 * I really dislike tabber, but they seemed to go away when created with the suggested syntax on the help pages... the only downside is no in-line CSS. Try converting it to the syntax here on a small scale page first. See here for a small set up. You'd have to add the CSS to common.css instead of in-line, but it should work. Rappy 09:22, March 29, 2012 (UTC)


 * The tabber we've been using is the original from BarelyFitz Designs. I liked the flexibility of it, which is why I started using it about two years ago instead of wikia's version. After doing some troubleshooting on my personal sandbox wiki, it seems that for whatever reason, the original tabber's javascript started conflicting with wikia's; because when I removed the original tabber js the extra tabs went away. Guess I've got a lot of converting to do..., I don't have the knowledge to tweak javascript.


 * Also, your example page is empty... But, I've worked out how to customize the css. Thanks for your help and looking into it. --Udana 05:53, March 30, 2012 (UTC)


 * Yeah, it seems I had the wrong link (it's fixed now). The problem with using the original is that it wasn't written for Wikia. Anything that Wikia changes can easily conflict with something written for Wikipedia. Tweaking the JS is possible, but often it is better to work it out without tweaking. Let me know if you have any other issues. I may be able to help. Rappy 05:57, March 30, 2012 (UTC)


 * I'm having the same issue. Can you clarify what you had to change to get it to work? If it works at all, because the pages you linked above still have the problem. -- 06:36, March 30, 2012 (UTC)


 * What wiki? Mine seem to be working fine so it shouldn't be an issue with the Tabber coding and Wikia's coding. Rappy 06:37, March 30, 2012 (UTC)


 * Have I missed something? The first time I looked at Udana's pages I saw perfectly working tabbers. Now they're gone. Is this problem solved ??? --

The tabber was adding extra tabs above the tabs that should be there (duplicating them). Rappy 06:53, March 30, 2012 (UTC)

IcecreamKitten if you have any tabber javascript in your wiki's Common.js page you need to remove it. I haven't done this on the Mega Man Wiki yet, because removing the js will break tabbers across pages not using Wikia's tabber syntax as seen on the Help Wiki page, and I would rather leave it functioning and a little weird until I've gotten things figured out, than just not working at all.

Pecoes the problem doesn't always show at first; its a little strange. When I checked Rappy's example page the problem was present even though Wikia's syntax was being used. But, when I opened the page in the editor and exited back out the extra tabs were no longer there.

This is the test page from the sandbox wiki I'm using. Everything is working perfectly from what I see, except for the third tab in the first example. Wikia's tabber seems to have issues with Float alignment. -- Udana 15:27, March 30, 2012 (UTC)


 * The first tab should work now. The third tab of the first tabber, I mean :) --


 * That's a great solution! Thanks:D --Udana 17:49, March 30, 2012 (UTC)


 * So the only way to solve it is to use the less convenient wikia tabber? Terrific... -- 20:45, March 30, 2012 (UTC)


 * You could probably use the other one too, but not as is. You would have to go through its code and rename all the exposed variables and functions and then you would have to dig even deeper and rename its css classes. That's the only way to avoid collisions.


 * What functionality does that other tabber offer you, that Wikia's tabber does not? --


 * That's a good question. If it's code-wise better, Wikia could update their code to match. If it's default CSS, that can be easily added. Rappy 23:12, March 30, 2012 (UTC)


 * BarelyFitz tabber is more convenient in that it uses simple div boxes to create tabs. Simple and effective.


 * Try to make a template out of the wikia tabber without stumbling on various problems... -- 23:39, March 30, 2012 (UTC)


 * Wikia's tabber can be templated. You'd have to use  instead. Rappy 23:41, March 30, 2012 (UTC)

You have two options: Both options require roughly the same amount of work and will give you the same amount of headaches. The second option is more stable though. With the first option you'll cut yourself from future updates of both versions of tabber.
 * 1) Rewrite the other tabber.js so it doesn't collide with Wikia's tabber.js.
 * 2) Use Wikia's tabber.js and accept that your template will become uglier and more complex.

I would follow Rappy's advice.

Or.

If you're feeling adventurous

I looked over Wikia's tabber.js and it appears they've rewritten/changed nothing from the original. All the code that transforms divs with certain classes into a tabber is there and completely intact. It looks like all they did is write a preprocessor of some sort that translates the  tags into the divs tabber.js expects. So if you were to load the tabber.css and tabber.js yourself, the preprocessor would never be started, right?

This is not the most efficient solution, mind you. It bypasses Wikia's caches and maybe even your browser's cache. It should work though. --
 * Maybe it was because of your browser &mdash;  S a m  Wang  05:41, March 31, 2012 (UTC)
 * I made a little demo of my idea: w:c:pecoes:TabberTest --