Foldable List

By michal-frackowiak

Description

Do you like a foldable list from My Account or Site Manager? Create your own!

The trick is to embed the list within the foldable-list-container class div like below. Use your own links within the list!

Code

[[div class="foldable-list-container"]]
* foldable example 
 * [[[system: Recent changes]]]
 * [[[system: List all pages | List all solutions]]]
 * [[[system: Page tags | Browse by tags]]]
 *   and here are some "links" shown: 
 * [*http://www.wikidot.com/doc Documentation]
 * [*http://www.wikidot.com/doc:wiki-syntax wiki-syntax]
 * [*http://community.wikidot.com/howto:howto-list How-To's]
 * [*http://snippets.wikidot.com Solutions]
 * [*http://www.wikidot.com wikidot]
 * [*http://community.wikidot.com/ Community]
 * [*http://community.wikidot.com/forum:start Community Forum]
[[/div]]

In action

See the example on the page below:

NOTE: you can only use this in the side bar element.

---

Thanks to tsangk for this great snippet: conditional-blocks

---

text above inserted with:

[[include :snippets:if START |unique=1|type=equal|var1=%%name%%|var2=conditional-blocks]]
**##red|Thanks to tsangk for this great snippet:##** [[[code:conditional-blocks]]]
[[include :snippets:if END]]

---

---

Other snippets posted by michal-frackowiak

Collapsible Text Block - 02 Dec 2020 10:24
Todo List - 18 Aug 2014 15:28
Multicolumn Layout - 17 Dec 2012 19:51
Zoho Writer - 16 Feb 2012 01:57
Zoho Sheet - 16 Feb 2012 01:56
Zoho Show - 16 Feb 2012 01:55
Zoho Polls - 16 Feb 2012 01:53
WoW Tooltips - 16 Feb 2012 01:52
Widgetbox Panel - 16 Feb 2012 01:52
Video from Revver - 16 Feb 2012 01:50
Tabs - 16 Feb 2012 01:45
Standalone Page Buttons - 16 Feb 2012 01:44
Social Bookmarking - 16 Feb 2012 01:42
Simple Gallery - 16 Feb 2012 01:41
Remember The Milk Todo - 16 Feb 2012 01:39
Recent Changes (mini) - 16 Feb 2012 01:36
Rating Summary - 16 Feb 2012 01:35
Quimble Poll - 16 Feb 2012 01:33
Quikmaps Maps - 16 Feb 2012 01:33
Photobucket Widget - 16 Feb 2012 01:29
Page Previews (Snap.com) - 16 Feb 2012 01:29
Pabpixies Gadgets - 16 Feb 2012 01:28
MyBlogLog recent visitors - 16 Feb 2012 01:25
Meebo me - 16 Feb 2012 01:20
Layout With Tables - 16 Feb 2012 01:19
Instacalc - 16 Feb 2012 01:12
Include Any Page - 16 Feb 2012 01:11
Import the Digg Feed - 16 Feb 2012 01:11
Import a News Feed - 16 Feb 2012 01:10
Google Gadgets - 16 Feb 2012 01:05
Gabbly chat - 16 Feb 2012 01:02
Forum Summary for the Front Page - 16 Feb 2012 01:02
Footnotes - 16 Feb 2012 01:01
Flickr Images By Tags - 16 Feb 2012 01:00
Feedburner - 15 Feb 2012 00:53
Extra Side Bar - 15 Feb 2012 00:51
Embed Code From Other Services - 15 Feb 2012 00:50
EditGrid Spreadsheets - 15 Feb 2012 00:49
Cornify - 15 Feb 2012 00:39
Compact Feed Display - 15 Feb 2012 00:35
Center Video - 15 Feb 2012 00:28
Bibliography/Footnotes/Comments Listed in TOC - 15 Feb 2012 00:26
Babelfish Translation - 15 Feb 2012 00:25
Automatic Sitemap - 15 Feb 2012 00:25
Alexa traffic ratings - 15 Feb 2012 00:23
3d tagcloud - 15 Feb 2012 00:22

---

Rate this solution

If you think this solution is useful — rate it up!

page 1 of 212next »

FakeProGaming YT 28 Oct 2020 13:56

Last edited on 28 Oct 2020 13:56 by FakeProGaming YT Show more

JB Boykin 22 Nov 2016 20:09

Hope this works well!

---

JB Boykin
Pro-Cannabis

Now everywhere possible - not only in side bar!

Helmut_pdorf 20 Mar 2015 14:29

http://feedback.wikidot.com/bug:952 brought a comment:

• [[div class="foldable-list-container"]] - is no longer associated with side bar and can be used anywhere. New look brought new non invasive solution.

See also http://www.wikidot.com/doc-wiki-syntax:foldable-list

---

Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.

Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?

Last edited on 20 Mar 2015 14:30 by Helmut_pdorf Show more

NeptunesBlue 17 Jan 2011 18:02

It just means i'll have to add all Non User Created page links from the site into the tree, if i want it to stay open. It might be best practice anyway.

Thanks for your help Helmuti

Last edited on 17 Jan 2011 18:05 by NeptunesBlue Show more

Stop Collapsing when!

NeptunesBlue 17 Jan 2011 16:44

Stop it Collapsing when I navigate to a page that is not in the foldable list container. Is that possible at all?

Last edited on 17 Jan 2011 16:45 by NeptunesBlue Show more

Re: Stop Collapsing when!

Helmut_pdorf 17 Jan 2011 17:15

Pleas e- an example - I do not understand the question!

I made a test on my old pug-at.wikidot.com

• I opened the Help "container" - showing the sub menu
• I click ona complete another menu point outside this submenu
• the browser loads a complete different set of nav:side and nav.top and main-content- page
• the Help sub menu is closed again.

Yes - this is always going back to the standard - if you click on a link outside the sub menu

If yo click on a link INSIDE ths sub menu - than the nav:side folder "holds open"…

---

Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.

Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?

Last edited on 17 Jan 2011 17:20 by Helmut_pdorf Show more

how to create this menu?

bibliotecaespmrio 12 Aug 2010 23:34

How do I create a menu like that on this site ( http://manualmarc21.wikidot.com/ )

Re: how to create this menu?

Helmut_pdorf 14 Aug 2010 08:11

I had a look on the nav:side page of this site:

[[collapsible show="00X Campos de controlo" hide="00X Campos de controlo"]]
* [[[006 Características adicionais do material]]]
* [[[008 Todos os materiais]]]
* [[[008 Livros]]]
* [[[008 Ficheiros de computador]]]
* [[[008 Recursos em continuação]]]
[[/collapsible]]

[[collapsible show="01X-09X Números e códigos" hide="01X-09X Números e códigos"]]
* [[[017 Nº de Depósito Legal]]]
* [[[020 ISBN]]]
* [[[022 ISSN]]]
* [[[024 Outros números normalizados ou códigos]]]
* [[[034 Dados matemáticos codificados (doc. cartográficos)]]]
* [[[041 Código de língua]]]
* [[[044 Código de país de publicação]]]
* [[[080 Classificação Decimal Universal]]]
* [[[084 Outras classificações]]]
[[/collapsible]]
..
..
and so on..

[[collapsible show="Anexos" hide="Anexos"]]
* [[[Códigos de função]]]
[[/collapsible]]

---

Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.

Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?

here are some Links inside the collapsible

Helmut_pdorf 01 Mar 2009 15:17

1. I insert here the sopurce code of one of nav:side bar pages ( http://pug-at.wikidot.com/nav:side )
2. I chane the shown example to have a standaard link in the foldable list

[[=]]
[[button edit text="edit" style="background-image: url(http://community.wikidot.com/local--files/nav:side/accessories-text-editor-32x32.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px;"]] [[button source text="src" style="background-image: url(http://www.wikidot.com/local--files/files/view-source.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px;"]] [[button print text="prt" style="background-image: url(http://www.wikidot.com/local--files/files/document-print.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px;"]]
[[/=]]

* [[[start | Welcome page]]]

* [[[forum:start | Forum]]]
* [[[forum:recent-posts | Recent posts]]]
* [*http://pug-at.wikidot.com/forum/c-33548/gaestebuch-offen-fuer-nichtmitglieder Guestbook]
* [[[Link-Liste]]]
* [[[contact]]]
* [[[system: join | Mitglied werden]]]

[[div class="foldable-list-container"]]
* Help 
 * [*http://handbook.wikidot.com Wikidot Handbook]
 * [[[system: join | How to join us?]]]
 * [[[What is a Wiki Site?|What is a Wiki?]]]
 * [[[How to edit pages?]]]
 * [*http://www.wikidot.com/doc Documentation]
 * [*http://www.wikidot.com/doc:wiki-syntax wiki-syntax]
 * [*http://community.wikidot.com/howto:howto-list How-To's]
 * [*http://snippets.wikidot.com Solutions]
 * [*http://www.wikidot.com wikidot]
 * [*http://community.wikidot.com/ Community]
 * [*http://community.wikidot.com/forum:start Community Forum]
[[/div]]

[[div class="foldable-list-container"]]
* Internals 
 * [[[system:members | Site members]]] 
 * [[[system: Recent changes]]]
 * [[[system: List all pages]]]
 * [[[system:page-tags-list|Page Tags]]]
 * [[[admin:manage|Site Manager]]]
 * [[[nav:side | nav:side]]]
 * [[[nav:top | nav:top]]]
[[/div]]
++ Page tags
[[module TagCloud minFontSize="80%" maxFontSize="200%"  maxColor="8,8,64" minColor="100,100,128" target="system:page-tags" limit="30"]]

++ Add a new page
[[module NewPage size="15" button="new page"]]

Hope this helps ?

---

Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.

Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?

Adding Pages

Chirag Chamoli 28 Feb 2009 14:21

Folks, I have searched a lot and not able to add page links to this list. I am really new to the platform and not very technical, can you please help me with this.

* [http://wmui.wikidot.com/editing-wmui Editing]

I want to give a fold-able list of pages in the side bar. Thanks for your time.

foldable display

wowstrategy 03 Jul 2008 22:44

this is a great tip

i have 2 problems:

1) when the page is refreshed or changes, the foldable list is displayed quickly as unfolded, this causes everything to change position for a second before it folds up again. is there any way to make this not occur? that would be sweet

2) when i look at the side-bar actual page (like, go to list all pages, and click on side bar), the list has bullets in it, but on the sidebar, it doesnt have any bullets. im guessing this is controlled through css, and have been messing around trying to fix it without any luck. any ideas?

Thanks!!

Just Can't Get This to Work

Osira 16 Jun 2008 15:50

I'm not sure what I'm doing wrong, but I just can't get this to work for me. I've checked my code over for errors and I've made sure all of my links are correct, but it's still giving me trouble. It's disappointing, as this is just what I need to put the finishing touches on my sidebar. If anyone could figure out what I might be doing wrong, that would be greatly appreciated. Here's my code:

[[div class="foldable-list-container"]]
* Help:
* [[[how-to-s|How To's]]]
* [[[templates|Templates]]]
* [[[help|Links]]]
* Site Info:
* [[[system: members |Site Members]]]
* [[[system: recent changes|Recent Changes]]]
* [[[system: list all pages|List All Pages]]]
* [[[system: page tags|List All Tags]]]
[[/div]]

Thanks!

Last edited on 16 Jun 2008 19:36 by Osira Show more

Re: Just Can't Get This to Work

RobElliott 18 Jun 2008 14:04

It doesn't look like you've indented the lines under Help: and Site Info: so put a couple of spaces before the * on those lines and see if that solves it. Without that you just get a non-folding list.

---

Rob Elliott - Strathpeffer, Scotland - Wikidot first line support & community admin team.

page 1 of 212next »