<div dir="ltr">This is brilliant thanks.<div><br></div><div>I'll go for the plain (:details:) markup, but I can see a use for ToggleNext in the future.</div><div><br></div><div>thanks again<br><br></div></div><br><div class="gmail_quote"><div dir="ltr" class="gmail_attr">On Sun, 7 Jun 2020 at 08:13, Petko Yotov <<a href="mailto:5ko@5ko.fr">5ko@5ko.fr</a>> wrote:<br></div><blockquote class="gmail_quote" style="margin:0px 0px 0px 0.8ex;border-left:1px solid rgb(204,204,204);padding-left:1ex">You may simply need the new details+summary block markup:<br>
<br>
   <a href="https://www.pmwiki.org/wiki/PmWiki/BlockMarkup" rel="noreferrer" target="_blank">https://www.pmwiki.org/wiki/PmWiki/BlockMarkup</a><br>
<br>
   (:details summary="Show alert...":)<br>
   Alert 1 text<br>
   Alert 2 text<br>
   (:detailsend:)<br>
<br>
It shows an arrow that changes direction when the element is toggled. It <br>
doesn't require JavaScript to work. The elements can be styled with CSS.<br>
<br>
This would be the easiest, and most future-proof way to do it.<br>
<br>
If the arrow is not enough for you to show that the element can be open <br>
and closed, you can add the Show and Hide words with CSS:<br>
<br>
   (:details class=showhide summary="alert":)<br>
<br>
pub/local.css:<br>
   details.showhide summary::before { content: "Show "; }<br>
   details.showhide[open] summary::before { content: "Hide "; }<br>
<br>
Note: the summary="..." attribute will be better left without any inline <br>
markup (future-proof).<br>
<br>
<br>
<br>
<br>
If you must have one link to open several blocks, I'd see the ToggleNext <br>
core feature:<br>
<br>
   <a href="https://www.pmwiki.org/wiki/Cookbook/ToggleNext" rel="noreferrer" target="_blank">https://www.pmwiki.org/wiki/Cookbook/ToggleNext</a><br>
<br>
It requires JavaScript to be enabled. On the talk page I explained how I <br>
have a "toggle all" link that opens all sections:<br>
<br>
   <a href="https://www.pmwiki.org/wiki/Cookbook/ToggleNext-Talk" rel="noreferrer" target="_blank">https://www.pmwiki.org/wiki/Cookbook/ToggleNext-Talk</a><br>
<br>
It is can be seen in action here: <a href="https://virtour.fr/faq/" rel="noreferrer" target="_blank">https://virtour.fr/faq/</a> .<br>
<br>
The show/hide words are indeed shown and hidden by CSS when appropriate.<br>
<br>
Untoggle can do the "toggle next" part but not the "toggle all" part.<br>
<br>
Petko<br>
<br>
On 06/06/2020 01:58, Simon wrote:<br>
> I'm writing a recipe where I wish to toggle content,<br>
> and rather than implement another toggle or upload another javascript <br>
> I'd<br>
> like to utilise something already built in, or available in PmWiki<br>
> <br>
> For example I've looked at <br>
> <a href="https://www.pmwiki.org/wiki/Cookbook/UnToggle" rel="noreferrer" target="_blank">https://www.pmwiki.org/wiki/Cookbook/UnToggle</a><br>
> <br>
> My requirements are along the lines of:<br>
> <br>
> <p class="alerthead"><span class="hideme">Hide</span><span<br>
> class="showme">Show</span> alert</p><br>
> <br>
> <p class="alertbody showme">Alert 1 text</p><br>
> <br>
> <p class="alertbody showme">Alert 2 text</p><br>
> <br>
> When I click on the alert head I'd like to toggle the display of the <br>
> alerts<br>
> on and off<br>
</blockquote></div>