Manual talk:Collapsible elements

Expand/Collapse All?

Does this have any support for an "expand all" or "collapse all" button? Pretty desperate for the ability to use such myself.

Doesn't work?

This didn't work correctly in my Mediawiki 1.12.0 install. Looking at the source code of the page it created, initially hidden content is indeed hidden, but there is no "Show" link to reveal the content. Do you have any ideas? --Gadlen 19:13, 5 June 2008 (UTC)

I'm not seeing the "hide" or "show" links

I'm running 1.13.4. any thoughts, could it be firefox? --69.244.124.138 01:16, 17 March 2009 (UTC)

still doesn't work any thoughts this what is is displayed:

Edited both common.js and common.css This is the header cell, which is always shown This cell is not shown by default.

(no hide or show links)

--69.244.124.138 04:42, 25 March 2009 (UTC)

Is this code for 13.3 +  ?

--Mappc 00:00, 5 April 2009 (UTC)

I'm still interested in getting some resolution....any thoughts

--Mappc 22:54, 6 April 2009 (UTC)

This does work for me (IE6 , Firefox 3 and MediaWiki 13.4)

I had to change the function below the rest stay as it is. --AndreasMueller 21:56, 26 May 2009 (UTC)

function createCollapseButtons()
{
    var tableIndex = 0;
    var NavigationBoxes = new Object();
    var Tables = getElementsByClassName(document, "table", "collapsible");
 
    for ( var i = 0; i < Tables.length; i++ ) {
            /* only add button and increment count if there is a header row to work with */
            var HeaderRow = Tables[i].getElementsByTagName( "tr" )[0];
            if (!HeaderRow) continue;
            var Header = HeaderRow.getElementsByTagName( "th" )[0];
            if (!Header) continue;
 
            NavigationBoxes[ tableIndex ] = Tables[i];
            Tables[i].setAttribute( "id", "collapsibleTable" + tableIndex );
 
            var Button     = document.createElement( "span" );
            var ButtonLink = document.createElement( "a" );
            var ButtonText = document.createTextNode( collapseCaption );
 
            Button.className = "collapseButton";  //Styles are declared in Common.css
 
            ButtonLink.style.color = Header.style.color;
            ButtonLink.setAttribute( "id", "collapseButton" + tableIndex );
            ButtonLink.setAttribute( "href", "javascript:collapseTable(" + tableIndex + ");" );
            ButtonLink.appendChild( ButtonText );
 
            Button.appendChild( document.createTextNode( "[" ) );
            Button.appendChild( ButtonLink );
            Button.appendChild( document.createTextNode( "]" ) );
 
            Header.insertBefore( Button, Header.childNodes[0] );
            tableIndex++;
    }
 
    var Tables = getElementsByClassName(document, "table", "collapsed");
    for ( var i = 0;  i < Tables.length; i++ ) {
        collapseTable( i );
    }
 
    var Tables = getElementsByClassName(document, "table", "autocollapse");
    for ( var i = 0;  i < Tables.length; i++ ) {
        if ( i >= autoCollapse ) {
            collapseTable( i );
        } 
    }	
}

Worked A-OK

No editing needed over here. Using MediaWiki 1.15.1 with no other custom JS. 74.65.88.219 01:55, 7 October 2009 (UTC)

Worked for me too on 1.15.1. At first it was very frustrating, I couldn't get it to work, but all I needed to do was the Shift-Refresh thing in my browser. =D --J.nesta 18:36, 5 November 2009 (UTC)

hide/show placement not working

I updgraded to 1.15.1. Now my hide/show buttons are always on the left even though I have the Common.css file with float right. See at http://sunshinereview.org/index.php/User:Ljarratt

1.16 functionality

Beta 3. This function works flawlessly for me.

Funny, not doing a damn thing for me (as describe, prior to 1.7 in the main article)

MediaWiki 1.16.2

PHP 5.2.11 (apache2handler)

MySQL 5.0.77

--99.197.224.57 06:04, 26 March 2011 (UTC)

1.15.3 Not Working - Using skin Cavendish

can anyone help with making this functional? http://emajenanything.com/mainwiki/wiki/index.php?title=Test THANKS

What?

How come I don't have neither common.js nor common.css in my wiki? how do I make this effect? :( --201.255.119.39 07:22, 19 July 2010 (UTC)

You can create them using your search box and searching for

MediaWiki:Common.css
MediaWiki:Common.js

--Skew 03:14, 22 September 2010 (UTC)

show/hide: jumping to top

A click on my show/hide button causes the page to jump to the top. Any ideas? Gohnarch 20:30, 27 September 2010 (UTC)

I have same problem on two different installs of 1.15 (Ubuntu and CentOS) - tried code from "This does work for me ..." above and that seems to be OK for now ... WBN 82.41.58.191 23:49, 13 October 2010 (UTC)

That's as a result of these two lines

ButtonLink.setAttribute( 'href', '#' );
addHandler( ButtonLink, 'click', new Function( 'evt', 'collapseTable(' + tableIndex + ' ); return killEvt( evt );' ) );

If you look at the current mw MediaWiki:Common.js, it reads

ButtonLink.setAttribute( 'href', "javascript:collapseTable(" + tableIndex + ");" );

(see W:Fragment identifier). I will update the page to show this change if that is all right with everybody. --JCrue 18:24, 30 November 2010 (UTC)

Still not working

Hi, I'm trying to install this on 1.15, and the "hide/show" tags aren't appearing. I've edited the common.js and common.css, as above and as shown on the article page, purged webcaches, etc, etc, and still no go. Any ideas for how to troubleshoot this? - very frustrating!

1.17 example not working on diffs

Hi!

I noticed that the new examples doesn't works when the page is seen in a diff like this. I think it should work even in this case (not only when viewing the page directly). Helder 16:03, 23 February 2011 (UTC)

During development it worked fine in preview, diff and oldid view. Will look into it. Krinkle 11:00, 24 February 2011 (UTC)

It does work in the latest development version, as for example ran on TranslateWiki, here. Hm.. Krinkle 11:32, 24 February 2011 (UTC)

Seems the cause isn't in the script after all. The problem is the FlaggedRevisions-extension which loads the page-contents afterwards via JavaScript causing any onload handlers to fail miserably since there isn't a page at that time (TOC-toggle, mw-collapsible, mw.util.$content) See also bugzilla: 26175 and bugzilla: 27513. I can't fix this untill FlaggedRevs has some kind of hook or is fixed otherwise. Any javascript handlers will fail (potentially $.fn.placeholder and $.fn.checkboxShiftClick as well) Krinkle

Cannot get Collapse to work in 1.17

I have tried to different 1.17 installs and I cannot get collapse to work at all. I am following the examples exactly:

<div class="toccolours mw-collapsible" style="width:400px">

This is text is collapsible. {{Lorem}}

</div>

Just shows the text. There is no option to collapse. The other examples give the same results. The ability to collapse is completely missing, even though the directions say "After 1.17... Basically all you do is add the class "mw-collapsible" to an element." What am I missing?

• Site #1: http://wiki.cyanogenmod.com/wiki/User:Pconwell/sandbox2
• Site #2: http://w.gu1dry.com/User:Pconwell/Sandbox2

I can't get this to work over at http://everquest.wikkii.net either. I also couldn't get the old style of collapsible tables using common.css and common.js to work either. I'm going nuts trying to figure out what I have done wrong. 24.40.138.185 21:52, 24 June 2011 (UTC)

On ResourceLoader/Default_modules#jQuery.makeCollapsible it is said that this feature is currently available on trunk, since rev:78914, but there is no mention of MW 1.17. So, I think this page is outdated.

Anyway, on this page it is explained how to install the plugin on MW 1.17 (as was made here on MediaWiki.org). Helder 12:43, 28 June 2011 (UTC)

Thank you for your concern. I had created MediaWiki:JQuery-makeCollapsible.js and MediaWiki:JQuery-makeCollapsible.css on my wiki and put the two lines in my Common.js before posting here. But it just doesn't seem to work. Neither does the old style collapsible tables. I'm at a loss here to understand why. 24.40.138.185 07:29, 29 June 2011 (UTC)

Notice that the current code of your MediaWiki:Common.js has syntax errors before the makeCollapsible plugin is loaded (copy and paste it on JSHint to check the syntax). Specifically, this will not work:

if ( {{PAGENAME}} == 'Main Page' )

So, I think the plugin will work if you add these lines again and fix the syntax errors above (or just remove everything from your MediaWiki:Common.js except this:

/* FROM MEDIAWIKI.ORG COMMON.JS  Load collapsible javascript */
mw.loader.load( 'http://www.everquest.wikkii.net/w/index.php?title=MediaWiki:JQuery-makeCollapsible.js&action=raw&ctype=text/javascript' );

) and clear your cache. Helder 13:18, 29 June 2011 (UTC)

Helder, thank you a million times. That was the problem all right. Thanks. 24.40.138.185 06:22, 30 June 2011 (UTC)

Indication of collapsed/expandable status

Moved from Meta-Wiki

Hi,

This might be the wrong place to ask, but we were wondering if their is an easy way to know which status of the class="mw-customtoggle-myDivision" is set in terms of being collapsed/expandable.

Using the standard solution indicates the status through the display of either [Collapsed] or [Expand], in our case we trigger the area which need to be collapsed with the display of an icon, and as soon the user switches from one status to the other one we wanted to indicated a change through a change in the icon displayed.

<div class="mw-customtoggle-topicon" style="cursor:pointer">[[File:icon-set-10-arrow-down.png|14px|link=]]</div>

So in case the class contains "mw-collapsible mw-collapsed" display one type of icon, and in case of the class just being "mw-collapsible" display another icon. --MWJames 18:13, 6 July 2011 (UTC)

Hi MWJames,

If you can provide a link to where this happends on a live-wiki I may be able to give a more fine-tuned detail. I'll show you how I would do it though. I'm assuming your toggle-icon is inside ‎<div class="mw-collasible">...‎</div>:

Wikitext:

<div id="collapse-pre-one" class="mw-collapsible">
 <div class="mw-collapsible-toggle toccolours" style="width: 100%">
  <span class="down">[[File:Arrow-down-dash-2.0.svg|50px|center|link=]]</span>
  <span class="up">[[File:Arrow-up-dash-2.0.svg|50px|center|link=]]</span>
 </div>
 <div class="mw-collapsible-content">
  {{User:Krinkle/Lorem}}
 </div>
</div>

CSS:

#collapse-pre-one  .mw-collapsible-toggle .up,
#collapse-pre-one.mw-collapsed .mw-collapsible-toggle .down {
 display: none;
}
#collapse-pre-one .mw-collapsible-toggle .down,
#collapse-pre-one.mw-collapsed  .mw-collapsible-toggle .up {
 display: block;
}

A demo of this can be found at testwiki:User:Krinkle/CollapsingTestpageMw#collapse-pre-one

Note that the collapse-pre-one is not required, it's just to make sure it won't apply to other collapsible constructions on the same page. Use whatever identifier you like Krinkle 21:14, 6 July 2011 (UTC)

makeCollapsible "in core"

Does "in core as of MediaWiki 1.18 or higher" mean that it will be enabled by default on all wikis, loaded and activated on every page? If so, will there be any way to disable it? --Yair rand 08:54, 14 July 2011 (UTC)

There is nothing to disable as all the scripts mentioned on this page are only triggered if there are elements on the page marked as "mw-collapsible". If your wiki doesn't want or have collapsible elements, this script will not be triggered and nothing will change when upgrading to 1.18. Krinkle 04:21, 4 August 2011 (UTC)

Really? It won't even load the scripts or take up time running any JS if there aren't any mw-collapsible elements in the wikitext? --Yair rand 05:14, 4 August 2011 (UTC)

Use new 1.18 collapsible in 1.17

You can use the new 1.18 collapsible code in a 1.17 install. Just paste the contents of jquery-makeCollapsible.js into your MediaWiki:Common.js

Download head version from MediaWiki

Then at the bottom of MediaWiki:Common.js, add:

mw.messages.set({"collapsible-collapse":"Collapse","collapsible-expand":"Expand"});
$(document).ready(function(){
 $('.mw-collapsible').makeCollapsible();
});

And add the contents of jquery.makeCollapsible.css into your MediaWiki:Common.css

Download head version from MediaWiki

If there is a tidier way of doing this, please let me know. --Thenickdude 11:33, 13 September 2011 (UTC)

Autocollapse

Has a version of autocollapse been implemented in core in 1.18? --★ → Airon Ĉ 14:09, 7 October 2011 (UTC)

Common.js script (Before 1.18) don't works

Hey there!

I have some Wikis running on an Debian Linux 6.0 (Squeeze) Webserver.
MediaWiki 1.17.0 (Version 95135)
PHP 5.3.3-7+squeeze3 (apache2handler)
MySQL 5.1.49-3

and i have the Problem, that this Collapse Hide & Show didnt works. I try it on two local Servers installed in Virtual Box and i have there the same problem. Could it be, that Debian Squeeze is the problem? Ive tryd all things, that i found here. But without a happy ending... Yukii 12:27, 10 October 2011 (UTC)

mw-collapsible will not work (1.18)

I've copied and pasted the examples and none of them work no matter what I do - upgraded my wiki, completely reinstalled the wiki, no dice. Leangle 8:54 PM, Dec 29 2011

Customizing Collapse/Expand location

Using 1.18, how would I customize the mw-collapsible mw-collapsed CSS so that the 'Expand' or 'Collapse' buttons appear on the left?

I'm thinking of something like what the mobile site does for certain sections - rather than having the 'expand' button float out of site off to the right, i'd prefer it to be on the left. It doesn't necessarily need to use a button, but that would be interesting as well.

66.3.56.92 23:21, 1 March 2012 (UTC)

Update:

Solved it, more or less

/* leave toggle on the right for tables */
.tablecollapse span.mw-collapsible-toggle{
  float:right;
}
 
 /* put it on the left for everything else */
.collapse span.mw-collapsible-toggle {
  float: left;
}

By setting those classes, I can make sure that for tables, the toggle still appears where it should, and for other areas, the toggle appears floating left.

not sure how to swap out images, but at this point, thats no big deal. Hope this helps someone.

Another way:
For those of you who don't like having the toggle right beside text, here's how to make text appear below it:

 .mw-collapsible-toggle {
    display:inline-block;
    float:none;
 }

Bluekuma (talk) 17:43, 22 May 2015 (UTC)

None of the above work anymore. I tested them. There is CSS that works though. I will start a new section farther down. --Timeshifter (talk) 23:44, 22 March 2019 (UTC)

Only Works for Anons

When i log into my wiki the expand/collapse links disappear and all content within them defaults to expanded. Any idea on how to fix this? I'm thinking it's not loading the java after login but don't know what to change to fix it.

Thanks!

Extensions that disrupts collapsible elements.

I notice that with mediwiki 1.17 I didn't have any collapsible elements, even doing all the things to be done. I upgrade to mediawiki 1.18, and didn't work.

So I notice that, when I disable the Page Object Model Extension It worked.

Check it.

1.19.1 Nested Collapsible elements

Tracked in Phabricator
Task T37257

In 1.19.1, using the builtin JQuery mw-collapsible and mw-collapsed classes works as expected, except if you have nested elements and "Expand" a collapsed element, it will also expand all nested elements. Ideally this could either be toggled via a setting or by default not expand all child collapsible elements.

That seems to be bugzilla:35257. Helder 18:31, 6 July 2012 (UTC)

19.2 - Collapsible Elements Load Open

I was previously using the now obsolete ToggleDisplay extension which worked nicely but now after upgrading to 1.19.2 I have started trying to use the built in Collapsible elements feature. It seems fine but when the page loads, all toggle areas load as open and only close once the page is completely loaded. This creates a kind of unwanted stutter in the visual loading of the page. Can this be fixed or is there a way to use Collapsible elements so it doesn't do this? The reason I mention the extension above is that it doesn't do this. The page loads with elements already closed and it looks great. Would love to have that effect again.

Loading issue

Is it possible to keep all the content collapsed while the rest of the page loads? I have a problem that, on pages with many images and other content, the information that I have initially collapsed is visible until the entire page loads in the browser.

It looks like this has been a proper nuisance for some time already. Cavila ^{MW 1.19.2, MySQL 5.1.63, Php 5.3.3-7, SMW 1.8} 22:47, 17 January 2013 (UTC)

Tracked in Phabricator
Task T36876

Broken in Old Custom Skins

This functionality has been completely destroyed in pre 1.17 skins. It is impossible to implement any of the fixes suggested as the skins do not conform to the new framework, and the files used in the old framework no longer exist. Can anyone suggest a fix to re-implement this behaviour in pre 1.17 skins?

Custom Toggle with arrow indicator and header

This code makes a nice Toggle element with an Arror indicator image. The image can be anything really but an arrow is the most logical choice.
I have not tested backwards compatibility on this for MediaWiki versions < V1.21.
Credit goes to Krinkle as this was adapted from his examples.
A demo can be seen here: Toggle with Arrow

Wikitext:

<div id="collapse-pre-one" class="mw-collapsible mw-collapsed">
 <div class="mw-collapsible-toggle toccolours" style="float: none;">
  <div class="mw-collapsible-toggle-row">
   <div class="mw-collapsible-toggle-header"><big>'''Example Header'''<br>Example sub</big></div>
   <div class="mw-collapsible-toggle-indicator">[[File:right-black-arrow.png|150px|link=]]</div>
  </div>
 </div>
<div class="mw-collapsible-content">
{{Lorem}}
</div>

CSS:

/* Collapse Toggle container */
#collapse-pre-one .mw-collapsible-toggle{
 display: table;
 border-collapse: collapse;
 width: 100%;
}

#collapse-pre-one .mw-collapsible-toggle-row{
 display: table-row;
}

/* Collapse Header should be on the left */
#collapse-pre-one .mw-collapsible-toggle .mw-collapsible-toggle-header{
 display: table-cell;
 vertical-align: middle;
 padding: 5px;
}

/* Collapse indicator image should be inline. align wherever you would like */
#collapse-pre-one .mw-collapsible-toggle .mw-collapsible-toggle-indicator{
 display: table-cell;
 vertical-align: middle;
 padding: 5px;
 text-align: right;
}

/* Collapse indicator image size should be something sane*/
#collapse-pre-one .mw-collapsible-toggle .mw-collapsible-toggle-indicator img{
height: 20px !important; 
width: 20px !important;
}

/* Collapse indicator image should rotate when toggled*/
#collapse-pre-one:not(.mw-collapsed) .mw-collapsible-toggle .mw-collapsible-toggle-indicator img{
 /* Safari */
 -webkit-transform: rotate(90deg);

 /* Firefox */
 -moz-transform: rotate(90deg);

 /* IE */
 -ms-transform: rotate(90deg);

 /* Opera */
 -o-transform: rotate(90deg);

 /* Internet Explorer */
 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}

--Shift9999 at 2:06AM PST - 07-17-2013

on() causes problems for older jq versions

In the code for collpasible tables, on() is used to bind behavior to the <a> for the show/hide button.... This is a jq function introduced in 1.4.2, so if you're using an older jq version, instead use the (old) bind() method instead of on().

Font color of collapsible button

Header
Collapsed content

Previously the font color of collapsible button was inheritable but now it doesn't. The problem is if someone changes the background color of talbe/div to blue, the [expand/collapse] button text is almost invisible even if the user has set color:#fff. -- Sameboat (talk) 02:44, 7 February 2014 (UTC)

Is there any news about this issue? --Rotpunkt (talk) 10:09, 23 May 2016 (UTC)

Wasn't this feature removed from the latest update? It is not in 1.24.1

I think this has been removed. How do I get it back for new updates? — Preceding unsigned comment added by 68.119.83.109 (talk • contribs) 21:45, Nov 5, 2015 (UTC)

Cannot make it work with Vector sidebar panels

I've tried to incorporate this on the sidebar panels under Vector to no avail. Applying the following...

( function ( mw, $ ) {
	$( '#mw-panel > .portal' ).each( function ( i ) {
		var id = $( this ).attr( 'id' );
		$( this ).find( 'h3' ).addClass( 'mw-customtoggle-' + id );
		$( this ).find( 'h3' ).addClass( 'mw-customtoggle' );
		$( this ).find( 'div' ).attr( 'id', 'mw-customcollapsible-' + id ).addClass( 'mw-collapsible mw-collapsed' );
	} );
}( mediaWiki, jQuery ) );

...seems to place all the nuances class & id wise just fine but there is no collapsing or toggling of the H3 element at all (can't even force everything to collapsed state by default). When I duplicate a sidebar portal in a sandbox with the exact same structure, everything works as expected.

Is there any chance the mw-collapsible (jQuery) scheme is limited to only work within the .mw-body content container while the sidebar is outside that in it's own mw-navigation container?

Maybe it's a dependency thing?

Any help would be appreciated. Thanks in advance. -- George Orwell III (talk) 04:56, 12 December 2015 (UTC)

mw-customcollapsible

Why the mw-customcollapsible application is not documented? 93.57.251.180 13:46, 30 April 2016 (UTC)

Why don't you do it yourself? <wink, wink> --Tactica amiga (talk) 13:58, 30 April 2016 (UTC)

There is a line about it on ResourceLoader/Modules#jquery.makeCollapsible and on https://doc.wikimedia.org/mediawiki-core/master/js/#!/api/jQuery.plugin.makeCollapsible. Helder 02:20, 2 May 2016 (UTC)

Expand, collapse all?

I want a remote button that only expands and a button that only collapses, any ideas? mw-customtoggle seems to only toggle between them, which doesn't work that good when a couple of tables are already expanded and I want to expand all of them.

[Expand all]

[Collapse all]

Collapsed table

Some text in here.

Other text here.

Expanded table

Even more text here.

No more text please.

Note that I think being able to click anywhere on the table to expand is important.

How to fix a collapsed spoiler?

I use spoilers type:

<div class="mw-collapsible mw-collapsed">
Spoiler name
<div class="mw-collapsible-content">
Text
</div></div>

At the same time, when the page loads - each time they are turned off, and it shows.

How to make so that it was unnoticed? Maybe there are other options spoilers?

One toggle

I would like to add, at the top of some pages, a toggle to hide some sentences of the page. So I have two questions.

1. Is it possible to place the show/hide toggle at the top of the page?
2. Can the toggle hide/show multiple texts?

Derugon (talk) 08:40, 30 April 2017 (UTC)

Toggle text of collapse/expand for customtoggle?

Hi,

I have to use customtoggle because the toggler is always outside the toggle content, and here I found no solution to alter the text of the customtoggle. Is there any official way to go? --Andreas P. 13:29, 9 August 2017 (UTC)

Selected collapsible table rows

Caption

This row should always be visible

This row has optional content and can be hidden

Header row
This row should always be visible
This row has optional content and can be hidden

Although it only shows it with div elements, the documentation makes it seem as if mw-collapsible-content could be used on any child of a mw-collapsible element, but this does not work for table rows. It should – bug report or feature request? — Christoph Päper 13:51, 16 November 2017 (UTC)

Click on a TOC item which lies within a currently hidden area, nothing will happen

If a person clicks on a TOC item which lies within a currently hidden area, nothing will happen.

It should toggle open the area, and jump to the anchor.

Seen with version 1.19.

Jidanni (talk) 12:14, 8 February 2018 (UTC)

This seems to be the case with every link into a collapsed section, not only from the TOC. --CompleCCity (talk) 09:38, 9 November 2019 (UTC)

not working collapse

I have this in a Template, in my old MW 1.25 working fine, after update to 1.30 not working. Ahy ideas?

<span class="_togglegroup _toggle_initshow _toggle _toggler toggle-visible" style="display:none;">[Anzeigen]</span><span class="_toggle_inithide _toggle _toggler toggle-hidden" style="display:none;">[Verstecken]</span> <div class="_toggle_inithide _toggle toggle-hidden"> {{{1}}}</div> — Preceding unsigned comment added by 213.61.254.68 (talk • contribs)

Try using the class names described in the documentation. You're probably using a custom script that's not working properly on recent versions of MediaWiki. --Ciencia Al Poder (talk) 09:17, 15 July 2018 (UTC)

Font size

I am a fairly novice coder in general so I apologize if there is a work around that I just don't know about due to simply being new to coding!

I am attempting to alter the font size within the collapsible section. The only code I could get to work was <big> which doesn't give us a lot of options. I couldn't find anything within the MediaWiki pages on how to further adjust size inside the Collapsible elements but I did try other options like adding style into the div and adding it around the divs. Needless to say, they haven't worked.

Any suggestions? — Preceding unsigned comment added by 2600:8800:2c01:1460:150e:7aae:fa51:e858 (talk • contribs)

If by collapsible section you mean the text that's being collapsed/expanded, I don't see how it won't work. ¿Can you post here your example? --Ciencia Al Poder (talk) 09:17, 15 July 2018 (UTC)

Animations for collapse/expand

Collapsing / expanding an element should quickly animate, instead of snapping to the next state. This would make Wiki projects seem less 2002 and more modern.

mw-customtoggle- not working!

I'm using MW 1.30.0 with the Vector skin and an Arabic UI, and mw-customtoggle-X / mw-customcollapsible-X pair functionality is not working, neither for English text nor Arabic text. Instead, I get -- the localised equivalent of -- "[show/hide]" Has anyone experienced this?

--Ahmad Gharbeia أحمد غربية (talk) 14:48, 14 August 2018 (UTC)

Partially expanding tables?

I have been searching for a way to only expand X rows of an episode table at a time. The table is simply episode #, title, short synopsis and I was hoping that I could make it collapsible such that a new link appeared at the bottom each time to reveal another say 5 rows of the table to avoid spoiling things for new fans. Short of making each individual row collapsible, or nesting collapsible tables inside each other, I've not managed to find a way to do this. Anyone know of a way to do this? — Preceding unsigned comment added by 2605:a601:9d0:c00:dc43:2021:6a28:c73f (talk • contribs) 12:06, 6 July 2019

You might get more help from here: en:Help:Table and its talk page. --Timeshifter (talk) 08:35, 8 July 2019 (UTC)

I cannot edit this page unless i remove the translate tags

I removed the translate tags in the last edit Moscowdreams (talk) 21:09, 2 May 2020 (UTC)

Expanding/Collapsing elements no longer working on UCP

I have infoboxes that are collapsed to begin with. Expanding doesn't work and even if I make it begin in the expanded state, it can't collapse. The Collapse/Expand link is not a link anymore. I also use data-expandtext and data-collapsetext to change the word for expanding/collapsing and those no longer work either. 63.155.54.240 20:17, 22 October 2020 (UTC)

Please link to some examples. --Timeshifter (talk) 08:31, 23 October 2020 (UTC)

No longer working in Georgian Wiktionary

In Georgian Wiktionary we used this template without any problems in Georgian Wiktionary. This is used in many articles. The template uses collapsible elements. It's been a few weeks now, no more collapsing and the template doesn't work anymore. In general, collapsible elements no longer work. What can be the fault and what can be helped? Thanks. Deu (talk) 08:11, 9 June 2023 (UTC)

When I open the JavaScript console (press F12 key and look for console or error console) on that page I see several JavaScript errors. JavaScript errors can cancel or break other scripts. You should check the wiki MediaWiki:Common.js, MediaWiki:Vector.js and default gadgets to see where they're coming from and fix them. Ciencia Al Poder (talk) 09:43, 9 June 2023 (UTC)

We fixed the javascript bugs, but this feature still doesn't work. გიო ოქრო (talk) 08:44, 16 June 2023 (UTC)

The structure of the toggle links has changed, and your code in wiktionary:ka:MediaWiki:Vector.css#L-23 effectively hides those links. Now they're not links, but buttons. This was changed in phab:T333357 Ciencia Al Poder (talk) 11:18, 16 June 2023 (UTC)

Page loading

I have long documents, which are collapsed into sections to facilitate navigation. Each section is in its own template. My first question is if collapsed content is 1.) loaded with the page or 2.)only loaded when it is expanded? (I assume the first because collapsed text is not searchable) My second question is if it is purged when it is collapsed again. Thanks in advance. ArexCell (talk) 13:11, 9 October 2023 (UTC)

You assume correct, collapsed elements are collapsed by a client-side script only after the entire document is loaded onto your device. I'm not sure what you mean by "purged", but collapsing is just hiding—a collapsed element still exists inside the document and is just hidden through CSS. Nardog (talk) 14:19, 9 October 2023 (UTC)

Collapsible menu disappears after upgrade to 1.32

I have a weird issue. Basically when I change to 1.32 version, all of my pages that has a collapsible menu, are filled with other random information and the collapsible menu disappears. I think probably is for the syntax but I don't know exactly what's the cause.

I recreated the same collapsible menu using this actual documentation and works. But how I can migrate every single collapsible menu of my wiki? (I have a lot of them).

9dd97 (talk) 23:33, 9 April 2024 (UTC)

How to nest collapsible elements?

How do you nest collapsible elements? I tried this code with two nested collapsible lists:

<div class="mw-collapsible">
    <div>Heading for outer list:</div>
    <ul class="mw-collapsible-content">
        <li>
            <div class="mw-collapsible">
                <div>Heading for inner list</div>
                <ul class="mw-collapsible-content">
                    <li>Apple</li>
                    <li>Banana</li>
                </ul>
            </div>
        </li>
    </ul>
</div>

Result:

Heading for outer list:

• Heading for inner list

  • Apple
  • Banana

Both buttons will expand or collapse both lists. How can I collapse the inner list without affecting the outer list and vice versa?? Dipsacus fullonum (talk) 14:29, 13 May 2024 (UTC)

:Use <li class="mw-collapsible"> instead of <li><div class="mw-collapsible">.
:

38.107.236.21 12:59, 29 November 2024 (UTC)

Toccolours class removal from examples

What about remove from the examples the use of the class toccolours? It is already used and abused and in the new skin Vector-2022 it was removed. --ZandDev (talk) 18:07, 29 October 2024 (UTC)