Month: January
December 2015
February 2016

Posted on

Roll-Your-Own Nested Expands

Alternat Text be I

Here is a simple example of how you can create nested expand elements using the shortcode:

[expand title="state1" id="state1"]
   [expandsub1 title="city1" id="city1"]bar1
bar2[/expandsub1]
   [expandsub1 title="city2" id="city2"]bar3
bar4[/expandsub1]
[/expand]
state1
city1
bar1
bar2
city2
bar3
bar4

Roll-Your-Own

Here is a similar example of nested expand elements using the Roll-Your-Own method:

<div class="collapseomatic" id="state2" title="state2">state2</div>
<div id="target-state2" class="collapseomatic_content " style="display: none;">
   <div class="collapseomatic" id="city3" title="city3">city3</div><div id="target-city3" class="collapseomatic_content " style="display: none;">bar5<br>
bar6</div>
   <div class="collapseomatic" id="city4" title="city4">city4</div><div id="target-city4" class="collapseomatic_content " style="display: none;">bar7<br>
bar8</div>
</div>
state2

~~~

Here is a four level deep nested test using shortcodes:

+ Coaching (Team Services)

+ Coaching Engagements

Agile Team Accelerator

Expandsub4

this is the fourth estate

Embedded Agile Coaching

Technical Agile Coaching

Executive Session for Agile

Coaching Workshops

Sandbox

Posted on

Grouping Collapse-Pro-Matic Setall Subexpands

Introducing ‘togglegroup’ a new attribute that can be used instead of rel and highlander grouping for collapseall/expandall/setall toggles.
Here is a list of expand elements with nested expansub elements:

[expand title="main 1" rel="main-highlander" togglegroup="group_1"] This is the first main section and it has multiple sub sections:
[expandsub1 title="sub a" rel="sub-highlander" togglegroup="group_1"]sub section a[/expandsub1]
[expandsub1 title="sub b" rel="sub-highlander" togglegroup="group_1"]sub section b[/expandsub1]
[expandsub1 title="sub c" rel="sub-highlander" togglegroup="group_1"]sub section b[/expandsub1]
[/expand]
[expand title="main 2" rel="main-highlander" togglegroup="group_1"] This is the second main section and it has multiple sub sections:
[expandsub1 title="sub d" rel="sub-highlander" togglegroup="group_1"]sub section d[/expandsub1]
[expandsub1 title="sub e" rel="sub-highlander" togglegroup="group_1"]sub section e[/expandsub1]
[expandsub1 title="sub f" rel="sub-highlander" togglegroup="group_1"]sub section f[/expandsub1]
[/expand]

And here is a list of the different types of expandall/collapseall and toggle triggers that may be used.

Shortcode

[expand title="Expand All" swaptitle="Collapse All" trigclass="setall"/]
[expand title="Expand Main" swaptitle="Collapse Main" trigclass="setall" rel="main-highlander"/]
[expand title="Expand Sub" swaptitle="Collapse Sub" trigclass="setall" rel="sub-highlander"/]
[expand title="Expand Group 1" swaptitle="Collapse Group 1" trigclass="setall" togglegroup="group_1" /]

Roll-Your-Own

<span class="expandall">Expand All</span>

<span class="collapseall">Collapse All</span>

<span class="collapseomatic setall noarrow" id="my_toggle_id" title="Expand All">Expand All Toggle</span>
<span id="swap-my_toggle_id" class="colomat-swap" style="display:none;">Collapse All Toggle</span>

<span class="collapseomatic setall noarrow" id="my_other_toggle_id" title="Expand Group 1" data-togglegroup="group_1">Expand Group 1 Toggle</span>
<span id="swap-my_other_toggle_id" class="colomat-swap" style="display:none;">Collapse Group 1 Toggle</span>

Demo

Expand Elements

main 1
This is the first main section and it has multiple sub sections:
sub a
sub section a
sub b
sub section b
sub c
sub section b
main 2
This is the second main section and it has multiple sub sections:
sub d
sub section d
sub e
sub section e
sub f
sub section f

Shortcode Triggers

Expand All
Expand Main
Expand Sub
Expand Group 1

Roll-Your-Own Triggers

Expand All
Collapse All
Expand All Toggle
Expand Group 1 Toggle

Orphan Element

This is an expand element is not grouped with anything.

Pee Wee The Loaner
I am a loaner, Dotty. There are things about you me wouldn’t understand…. you shouldn’t understand
Posted on

Alt Attribute Removed

the alt attribute is causing the html to not validate properly. Here is a test to ensure it does not show up anymore:

[expand title="Expand all" swaptitle="Swap all" trigclass="setall" rel="main" notitle="true"]this is a test[/expand]
Expand all
this is a test

With SwapAlt:

[expand title="Monkey" alt="click for donkey" swaptitle="Donkey" swapalt="click for monkey" notitle="true"]this is a test[/expand]
Monkey
this is a test
Posted on

Collapse-O-Matic Lists

One of the more common support issues with Collapse-O-Matic are related to unwanted spacing between collapse elements. While there are a number of reasons why this happens, the most common issues are extra ‘p’ or ‘br’ tags being added due to the strange way the wpautop filter. Often the spacing issue can be resolved by wrapping the expand elements in a div, removing any extra spacing or hard-returns between the expand elements, adjusting css, using different expand html elements (such as the ‘li’ element), or using the Collapse Commander add-on.

Example of a simple list using Collapse-O-Matic:

[expand title="Item One"]
This is some special text to display about item one
[/expand]
[expand title="Item Two"]
This is some special text about item two to display
[/expand]
[expand title="Item Three"]
Item three also has some special text to be displayed
[/expand]
Item One
This is some special text to display about item one
Item Two
This is some special text about item two to display
Item Three
Item three also has some special text to be displayed

Example using UL and LI elements:

<ul>
[expand title="Item One" tag="li"]
This is some special text to display about item one
[/expand]
[expand title="Item Two" tag="li"]
This is some special text about item two to display
[/expand]
[expand title="Item Three" tag="li"]
Item three also has some special text to be displayed
[/expand]
</ul>
  • Item One
    • This is some special text to display about item one
  • Item Two
    • This is some special text about item two to display
  • Item Three
    • Item three also has some special text to be displayed

Example of a list using Collapse-Commander

[expand cid="1765"/]
[expand cid="1766"/]
[expand cid="1767"/]
Item One
This is some special text to display about item one
Item Two
This is some special text about item two to display with some html
Item Three
Item three also has some special text to be displayed

example of internal content list without using filter attribute:

[expand title="Standard"]
This is some text on the first line
This is some text on the second line
This is some text on the third line
[/expand]
Standard
This is some text on the first line
This is some text on the second line
This is some text on the third line

example of internal content list using filter attribute:

[expand title="Filtered" filter="true"]
This is some text on the first line
This is some text on the second line
This is some text on the third line
[/expand]
Filtered

This is some text on the first line
This is some text on the second line
This is some text on the third line

Posted on

Collapse-O-Matic Force Collapse Test

Wild Billd
Gun Slinger
James Butler Hickok (May 27, 1837 – August 2, 1876), better known as “Wild Bill” Hickok, was a folk character of the American Old West. Although some of his exploits as reported at the time were fictionalized, his skills as a gunfighter and gambler, along with his reputation as a lawman, provided the basis for his enduring fame. Born and raised on a farm in rural Illinois, Hickok went west at age 18 as a fugitive from justice, first working as a stagecoach driver, then as a lawman in the frontier territories of Kansas and Nebraska. He fought (and spied) for the Union Army during the American Civil War, and gained publicity after the war as a scout, marksman, actor, and professional gambler. Hickok was involved in several notable shootouts. He was shot from behind and killed while playing poker in a saloon in Deadwood, Dakota Territory (now South Dakota) by an unsuccessful gambler. The card hand he held at the time of his death has come to be known today as poker’s “Dead Man’s Hand”.
wild bill
ames Butler Hickok (May 27, 1837 – August 2, 1876), better known as “Wild Bill” Hickok, was a folk character of the American Old West. Although some of his exploits as reported at the time were fictionalized, his skills as a gunfighter and gambler, along with his reputation as a lawman, provided the basis for his enduring fame. Born and raised on a farm in rural Illinois, Hickok went west at age 18 as a fugitive from justice, first working as a stagecoach driver, then as a lawman in the frontier territories of Kansas and Nebraska. He fought (and spied) for the Union Army during the American Civil War, and gained publicity after the war as a scout, marksman, actor, and professional gambler. Hickok was involved in several notable shootouts. He was shot from behind and killed while playing poker in a saloon in Deadwood, Dakota Territory (now South Dakota) by an unsuccessful gambler. The card hand he held at the time of his death has come to be known today as poker’s “Dead Man’s Hand”.

expand all

Posted on

Collapse-Pro-Matic Global Cookies

As of Collapse-Pro-Matic version 1.0.4 there is a new Global Cookie setting based on this thread by Grant Pax.

Setup

  1. Provide a unique name under Dashboard > Settings > Collapse-Pro-Matic > Global Cookie Name. For this example we will use monkeybucket
  2. provide ONE collapse element that will be used to set the global cookie value. This master trigger element must have the following attributes:
    • cookiename="your_global_cookie_name"
    • trigclass="setall"

    Example:
    [expand title="Expand All" swaptitle="Collapse All" cookiename="monkeybucket" trigclass="setall"/]

Demo

Expand All
expand 1
this is the first expand item
expand 2
this is the second expand item
expand 3
this is the third expand item
expand 4
this is the forth expand item