Difference between revisions of "Template:FAQList"

From Bose Portable PA Encyclopedia
Jump to: navigation, search
m
m
 
(15 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<noinclude>
 
<noinclude>
−
This template wraps multiple FAQItem entries and provides a pure‑CSS
+
<big>FAQList usage</big>
−
Expand All / Collapse All toggle using the checkbox hack.
 
  
−
Usage:
+
# Wrap multiple FAQItem entries inside this template
 +
# Put all FAQItem calls after | content =
 +
# Each FAQItem will appear inside a single FAQ list with Expand/Collapse All controls
  
−
<nowiki>{{FAQList|
+
----
−
  content =
+
 
−
     {{FAQItem|question=...|answer=...}}
+
<nowiki>{{</nowiki>'''FAQList'''
−
     {{FAQItem|question=...|answer=...}}
+
 
−
}}</nowiki>
+
| content =  
−
</noinclude>
+
     <nowiki>{{</nowiki>FAQItem
 +
    |question = question 1
 +
    |answer   = answer 1
 +
    <nowiki>}}</nowiki>
 +
 
 +
     <nowiki>{{</nowiki>FAQItem
 +
    |question = question 2
 +
    |answer   = answer 2
 +
    <nowiki>}}</nowiki>
 +
 
 +
<nowiki>}}</nowiki>
 +
 
 +
The FAQList will render as it appears below this line.
 +
----
 +
{{FAQList
 +
 
 +
| content =
 +
    {{FAQItem
 +
    |question = question 1
 +
    |answer  = answer 1
 +
    }}
  
−
<html>
+
    {{FAQItem
−
<style>
+
    |question = question 2
−
.faq-toggle { display:none; }
+
    |answer   = answer 2
−
.faq-toggle + label {
+
    }}
−
  cursor:pointer;
 
−
  font-weight:bold;
 
−
   display:inline-block;
 
−
  margin:0.5em 0;
 
−
}
 
−
.faq-collapsed,
 
−
.faq-expanded { display:none; }
 
−
.faq-toggle:not(:checked) ~ .faq-collapsed { display:block; }
 
−
.faq-toggle:checked ~ .faq-expanded { display:block; }
 
−
</style>
 
  
−
<!-- Hidden checkbox controls which block is visible -->
+
}}
−
<input type="checkbox" id="faq-toggle" class="faq-toggle" />
 
  
−
<!-- Toggle label -->
+
This template wraps multiple FAQItem entries and provides Expand All / Collapse All
−
<label for="faq-toggle">
+
using site-level JavaScript in MediaWiki:Common.js.
−
  <span class="expand-text">Expand all</span>
+
</noinclude>
−
  <span class="collapse-text">Collapse all</span>
 
−
</label>
 
  
−
<!-- Collapsed version (normal FAQItems) -->
+
<div class="faq-list" >
−
<div class="faq-collapsed">
+
<div class="faq-controls">
−
</html>{{{content}}}<html>
+
  <span class="faq-expand-all" style="cursor:pointer; font-weight:bold;">Expand all</span>&nbsp;|&nbsp;<span class="faq-collapse-all" style="cursor:pointer; font-weight:bold;">Collapse all</span>
 
</div>
 
</div>
−
 
+
{{{content}}}
−
<!-- Expanded version (all items forced open) -->
 
−
<div class="faq-expanded">
 
−
<details open>
 
−
</html>{{{content}}}<html>
 
−
</details>
 
 
</div>
 
</div>
−
</html>
 

Latest revision as of 15:30, 10 February 2026

FAQList usage

  1. Wrap multiple FAQItem entries inside this template
  2. Put all FAQItem calls after | content =
  3. Each FAQItem will appear inside a single FAQ list with Expand/Collapse All controls

{{FAQList

| content = 

   {{FAQItem
   |question = question 1
   |answer   = answer 1
   }}

   {{FAQItem
   |question = question 2
   |answer   = answer 2
   }}

}}

The FAQList will render as it appears below this line. 


 Expand all | Collapse all

question 1
answer 1


question 2
answer 2

This template wraps multiple FAQItem entries and provides Expand All / Collapse All using site-level JavaScript in MediaWiki:Common.js. 


 Expand all | Collapse all

{{{content}}}

Retrieved from "https://toonz.ca/bose/wiki/index.php?title=Template:FAQList&oldid=25330"