Month: October
September 2014
November 2014

Posted on

Responsive Countdown Test

Here are the responsive countdown styles.

carbonite-responsive

weeks
0
0
days
0
0
hours
0
0
minutes
0
3
seconds
0
0

cloud-city

weeks
0
0
days
0
0
hours
0
0
minutes
0
4
seconds
0
2
weeks
-33
-7
days
0
-4
hours
-1
-2
minutes
-5
-3
seconds
-5
0
Posted on

Collapse-O-Matic Left And Right Arrows

Normally, expand elements display the arrow on the left:
[expand title="trigger"]target[/expand]

trigger
target

However, we can move the arrow all the way to the right by assigning the the trigger the arrowright class:
[expand title="trigger" trigclass="arrowright"]target[/expand]

trigger
target

We can move the trigger closer to the text by changing the width of the trigger element using css:

CSS
.shorty {
width: 70px;
}
[expand title="trigger" trigclass="arrowright shorty"]target[/expand]

trigger
target

What if we want both left and right arrows? We first start with a roll-your-own expand element with no arrows by assigning the noarrow class to the trigger:

<div class="collapseomatic noarrow" id="my_double_arrow_01">trigger</div>
<div id="target-my_double_arrow_01" class="collapseomatic_content">target</div>
trigger
target

Then we manually upload the arrows we want to use and place them in the title:

<div class="collapseomatic noarrow" id="my_double_arrow_02"><img src="https://spacedonkey.de/wp-content/uploads/2014/10/arrow-down.png" width="12" height="14" /> trigger <img src="https://spacedonkey.de/wp-content/uploads/2014/10/arrow-down.png" width="12" height="14" /></div>
<div id="target-my_double_arrow_02" class="collapseomatic_content">target</div>
trigger
target

Finally we need to add a swap title element for the close arrows:

<div class="collapseomatic noarrow" id="my_double_arrow_03"><img src="https://spacedonkey.de/wp-content/uploads/2014/10/arrow-down.png" width="12" height="14" /> trigger <img src="https://spacedonkey.de/wp-content/uploads/2014/10/arrow-down.png" width="12" height="14" /></div>
<div id="swap-my_double_arrow_03" alt="" class="colomat-swap" style="display:none;"><img src="https://spacedonkey.de/wp-content/uploads/2014/10/arrow-up.png" width="12" height="14" /> target <img src="https://spacedonkey.de/wp-content/uploads/2014/10/arrow-up.png" width="12" height="14" /></div>
<div id="target-my_double_arrow_03" class="collapseomatic_content">target</div>
trigger
target
Posted on

New Plugin Test: Collapse Command

This is a test of the Collapse Command stystem:
[expand cid="1398"/]

Test Expand Element
This is the content of the expand element early_oculous
Third Example – No Content

Trigger Shortcode

[expand_trig cid="1403"]
Test Expand Two
[expand_trig cid="1398" id="monkey"]
Test Expand Element

Target Shortcode

[expand_targ cid="1403"]
And this is some crazy text with a "quote" and a 'single quote' and some other wacky characters!ΓΌ#;
[expand_targ cid="1398" id="monkey"]
This is the content of the expand element early_oculous
Posted on

Collapse-O-Matic: Changing Parent Element

This is the parent element with an id of ‘parent-superman’

Trigger Open

I am some awesome content that is magically visible when the trigger above is clicked. To close this amazing content, either click the Trigger Close trigger above, or the Internal Close Trigger below:
Internal Close Trigger
This is the parent element with an id of ‘parent-superman’

Trigger Open

I am some awesome content that is magically visible when the trigger above is clicked. To close this amazing content, either click the Trigger Close trigger above, or the Internal Close Trigger below:
Internal Close Trigger
Posted on

Element Wrap Test

The new elwraptag and elwrapclass attributes:

[expand title="trigger test" elwraptag="div" elwrapclass="classy"]target content[/expand]

This is the first element wrapped in a div
content to cause wonder and amazement.
This is the second element wrapped in a classy div
content to cause wonder and amazement.
This is the third element not wrapped
content to cause wonder and amazement.
Posted on

Skinny Collapse Wrap

This is the first element and it's short
content to cause wonder and amazement.
This is a bit longer second element, longer than the first element
content to cause wonder and amazement.

Ordered Lists

  1. Lorem ipsum dolor sit amet dolor sit ipsum, dolor ipsum sit amet dolor sit ipsum?
    2. Content here
  2. Lorem ipsum dolor sit amet dolor sit ipsum, dolor ipsum sit amet dolor sit ipsum?
    3. Content here
  3. Lorem ipsum dolor sit amet dolor sit ipsum, dolor ipsum sit amet dolor sit ipsum?
    4. Content here
  4. Lorem ipsum dolor sit amet dolor sit ipsum, dolor ipsum sit amet dolor sit ipsum?
    5. Content here
  5. Lorem ipsum dolor sit amet dolor sit ipsum, dolor ipsum sit amet dolor sit ipsum?
    6. Content here
Posted on

Non-Text Expand Test

Using notitle=true and tag=div

this is some content
this is some other content
here is some more content

Using no attributes, preceding text, div wrapped

This is the first line
this is some content
Here we have the second line
this is some other content
And finally line number three
here is some more content


Using tag=li, ul wrapped

  • this is some content
  • this is some other content
  • here is some more content
Posted on

entente test

Orginal

How do I purchase an item as a gift?

When you decide what item you want to purchase, right click the item and choose “touch” from the options. A blue menu will appear, choose “Gift” and follow the instructions.

Fixed

How do I purchase an item as a gift?

When you decide what item you want to purchase, right click the item and choose “touch” from the options. A blue menu will appear, choose “Gift” and follow the instructions.