A Pluginoven Test Site
This is an example of a collapse element with an inline link.
[expand title="this is a test with a <a href='https://plugins.twinpictures.de'>link</a>"]here is some hidden content[/expand]the key is to use double quotes to wrap the title attribute and single quotes for the html inside the double quotes.
This is a test Collapse-Pro-Matic’s ability to use external triggers to auto expand and scroll to other expands on the same page.
First we need quite a bit of text. Here is some from the Wiki entry for Star Wars:
Star Wars is an American epic space opera media franchise, centered on a film series created by George Lucas. It depicts the adventures of characters “a long time ago in a galaxy far, far away”.
The franchise began in 1977 with the release of the film Star Wars (later subtitled Episode IV: A New Hope in 1981[2][3]), which became a worldwide pop culture phenomenon. It was followed by the successful sequels The Empire Strikes Back (1980) and Return of the Jedi (1983); these three films constitute the original Star Wars trilogy. A prequel trilogy was released between 1999 and 2005, which received mixed reactions from both critics and fans. A sequel trilogy began in 2015 with the release of Star Wars: The Force Awakens and continued with the release of Star Wars: The Last Jedi (2017). The first eight films were nominated for Academy Awards (with wins going to the first two films released) and have been commercial successes, with a combined box office revenue of over US$8.5 billion,[4] making Star Wars the second highest-grossing film series.[5] Spin-off cinematic films include Rogue One (2016) and Solo: A Star Wars Story (2018).
Now we place a little expand element for R2D2 that we will reference below:
[expand title="R2D2" id="droid2d2"]...[/expand]Now we have another expand element that includes in it’s content a link to R2D2 above using:
<a class="expandanchor" href="#droid2d2">R2-D2</a>Here are two other examples of external triggers, one with and one without the expandachor class assigned, using the following code:
<a class="expandanchor" href="#droid2d2">test link one</a>
<a href="#droid2d2">test link one</a>As of version 1.1.2, multiple categories can be selected using the cat_id attribute. Simply provide a comma separated string of the category ID’s to include. Use a negative ID to omit multiple categories.
For example to include a yearly archive of posts with both the categories of ‘Archive-Pro-Matic’ (ID 55) and ‘collapse-pro-matic’ (ID 43) the shortcode would be:
[archives type="yearly" cat_id="55,43"/][archives type="monthly" cat_id="55,43" limit="10" /]monkeythis is a monkeyThis is some text
<ul class="numbers">
<li data-pos="2">one</li>
<li data-pos="2">two
<ul>
<li data-pos="2">two.one</li>
<li data-pos="2">two.two</li>
<li data-pos="2">two.three</li>
</ul>
</li>
</ul>
ul.numbers {
counter-reset: levelone;
list-style: none;
}
ul.numbers > li {
counter-increment: levelone;
}
ul.numbers > li[data-pos]:before {
content: attr(data-pos) "." counters(levelone, ".") ". ";
}
ul.numbers ul {
counter-reset: leveltwo;
list-style: none;
}
ul.numbers ul > li {
counter-increment: leveltwo;
}
ul.numbers ul > li[data-pos]:before {
content: attr(data-pos) "." counters(levelone, ".") "." counters(leveltwo, ".") ". ";
}
ul.numbers ul ul {
counter-reset: levelthree;
list-style: none;
}
ul.numbers ul ul > li {
counter-increment: levelthree;
}
ul.numbers ul ul > li[data-pos]:before {
content: attr(data-pos) "." counters(levelone, ".") "." counters(leveltwo, ".") "." counters(levelthree, ".") ". ";
}