Quick test to demonstrate how to use the tag and css to control the look of a trigger.
The Shortcode
[expand title="trigger" tag="h4"]hidden target content[/expand]
The CSS
h4.collapseomatic {
color: blue;
}
A Pluginoven Test Site
Quick test to demonstrate how to use the tag and css to control the look of a trigger.
[expand title="trigger" tag="h4"]hidden target content[/expand]
h4.collapseomatic {
color: blue;
}
The trick to keeping the excerpt in line with the trigger text, is simply to use the excerpttag attribute to have the excerpt use a span tag like so:
[expand title="trigger text" tag="span" excerpt="excerpt" excerpttag="span"]target text[/expand]
trigger textexcerpt[expand title="Fiction" rel="fiction" swaptitle="Is like non-non-fiction"]
[expandsub1 title="Star Wars" rel="submenu-highlander" swaptitle="Hyperspeed" expanded="true"]Target Content[/expandsub1]
[expandsub1 title="Star Trek" rel="submenu-highlander" swaptitle="Warpspeed"]Target Content[/expandsub1]
[/expand]
Test of a new system of recalculating the remaining time to make sure timers stay in sync.
Normally a countdown groups the units of time (weeks, days, hours, minutes and seconds) into a single countdown unit. But what if you wanted to break out these units and have them displayed on different parts of the page?
Step One. We will need to add a new attribute that tells the countdown NOT to display any of the digits. This way all the countdown scripts and details are still loaded, but the countdown is not displayed. Something like:
[tminus cid="123" hidden="true" style="cloud-city"/]
Step Two. A new shortcode will need to be created for displaying the time unit. We will need to know the countdown id (cid) the time unit to be displayed, and the style to be used, if other than the default style set up on the plugin settings. If a custom style is used it must be defined in both the countdown and the units like so:
[[tminus_digit cid="123" unit="hours" style="cloud-city"/]]
The final set will be to modify the countdown script to locate the time units, even if they are not wrapped in a countdown dashboard.
Let’s get started.
Here is a hidden countdown:
Now we add all the digits, starting with weeks:
[tminus_digit cid=”281″ id=”explode” unit=”weeks” style=”cloud-city” omitweeks=”false”/]
Days:
[tminus_digit cid=”281″ id=”explode” unit=”days” style=”cloud-city”/]
Hours:
[tminus_digit cid=”281″ id=”explode” unit=”hours” style=”cloud-city”/]
Minutes:
[tminus_digit cid=”281″ id=”explode” unit=”minutes” style=”cloud-city”/]
Seconds:
[tminus_digit cid=”281″ id=”explode” unit=”seconds” style=”cloud-city”/]
The following is an example of how to add a pdf document to be printed along with a target using the new add_print_url attribute.
First, we need a simple target to print:
<div id="print_target">This is the simple print target for the page</div>
Now, we simply add our print-me shortcode and use the add_pdf_url attribute to include a pdf document to be printed:
[print-me target="#print_target" add_pdf_url="https://spacedonkey.de/wp-content/uploads/2012/06/RomeSweetRome1-8v22.pdf" pause_time="3000"/]
As of version 1.2.6 we have introduced a new shortcode to print-pro-matic, just for printing PDFs.Note: the ability to print pdf files from javascript is currently not supported in FireFox. Therefore the PDF will open in a new tab and the user can print from there.
[[print-pdf pdf_url="https://spacedonkey.de/wp-content/uploads/2012/06/RomeSweetRome1-8v22.pdf"/]]
This will produce a simple button that will print the pdf:
[print-pdf pdf_url=”https://spacedonkey.de/wp-content/uploads/2012/06/RomeSweetRome1-8v22.pdf” /]
The optional attirbutes for the print-pdf shortcode are as follows:
id
The ID attribute will assign a custom ID to the button. If no ID is assigned a random id will be assigned.
title
The title attribute will assign the text of the print button. If no title is assigned, the button will have the tex of: ‘Print PDF’
class
The class attribute will assign the button a custom class.
tag
The tag attribute will change the trigger element from the default button to, say a div. For example:
[[print-pdf pdf_url="url_to_pdf" tag="div"/]]
img_url
The img_url attribute is used to define the image URL to use as a trigger. Using a trigger image will override standard print trigger, replacing it with the chosen image.
[[print-pdf img_url="url_to_trigger_image"/]]
width
Use the width attribute along with the img_url to define the image width.
height
Use the height attribute along with the img_url to define the image height.
alt
Use the alt attribute along with the img_url to define the image alt value.
Demo of Trigger Image:
[[print-pdf img_url="https://spacedonkey.de/wp-content/uploads/2012/09/ninja_turtles.jpg" alt="" width="600" height="447" pdf_url="https://spacedonkey.de/wp-content/uploads/2012/06/RomeSweetRome1-8v22.pdf"]]
[print-pdf img_url=”https://spacedonkey.de/wp-content/uploads/2012/09/ninja_turtles.jpg” alt=”” width=”600″ height=”447″ pdf_url=”https://spacedonkey.de/wp-content/uploads/2012/06/RomeSweetRome1-8v22.pdf”]
redirect_url
Full url to redirect the user to after either a) the print dialogue closes or b) the pdf is loaded into a new tab (depending on which browser is being used)
[[print-pdf pdf_url="url_to_pdf" redirect_url="http://starwars.wikia.com/wiki/Main_Page"/]]
[print-pdf pdf_url=”https://spacedonkey.de/wp-content/uploads/2012/06/RomeSweetRome1-8v22.pdf” redirect_url=”http://starwars.wikia.com/wiki/Main_Page” title=”Print & Redirect”/]
Here we will have a trigger image that redirects on print close:
[[print-pdf img_url="https://spacedonkey.de/wp-content/uploads/2012/09/ninja_turtles.jpg" alt="" width="600" height="447" pdf_url="https://spacedonkey.de/wp-content/uploads/2012/06/RomeSweetRome1-8v22.pdf" redirect_url="http://starwars.wikia.com/wiki/Main_Page" title="Ninja Power"]]
[print-pdf img_url=”https://spacedonkey.de/wp-content/uploads/2012/09/ninja_turtles.jpg” alt=”” width=”600″ height=”447″ pdf_url=”https://spacedonkey.de/wp-content/uploads/2012/06/RomeSweetRome1-8v22.pdf” redirect_url=”http://starwars.wikia.com/wiki/Main_Page” title=”Ninja Power”]
Here is a nested expand to test this issue.
[expand title="Level 1" id="q1" rel="top-highlander" trigclass="must-be-one" expanded="true"]
[expandsub1 title="Nested Level a1" id="a1" rel="a-highlander"]answer a1[/expandsub1]
[expandsub1 title="Nested Level a2" id="a2" rel="a-highlander"]answer a2[/expandsub1]
[/expand]
[expand title="Level 2" id="q2" rel="top-highlander" trigclass="must-be-one"]
[expandsub1 title="Nested Level b1" id="b1" rel="b-highlander"]answer b1[/expandsub1]
[expandsub1 title="Nested Level b2" id="b2" rel="b-highlander"]answer b2[/expandsub1]
[/expand]
Here are some external triggers:
<a class="expandanchor" href="#q1">Level 1</a>
<a class="expandanchor" href="#a1">Level 1a</a>
<a class="expandanchor" href="#a2">Level 1b</a>
<a class="expandanchor" href="#q2">Level 2</a>
<a class="expandanchor" href="#b1">Level 2a</a>
<a class="expandanchor" href="#b2">Level 2b</a>
Using the new %this year% and %this_easter% placeholders introduced with T(-) Countdown Control version 1.8.0, it’s easy to calculate holidays such as labor day like so:
Launch Strtotime: september %this_year% first monday
As of version 1.8.2, using these shortcodes will automatically recalculate for next year’s date after the holiday has past. Holidays should be set as recurring ‘Yearly’ and they will automatically be rescheduled for next year.
Other Holidays can be calculated in the same manner:
november %this_year% fourth thursday + 14 hours 30 minutes – 8 days
printme_trigger
class that turns anything into a print triggerexternal_trigger
shortcode element to enter the id or ids of the element(s) that should be used as an external triggerAnd this is how it works:
First we need an element that has a unique id. There must also be the ability to add the printme_trigger
class to it.
<button id="my_button" class="printme_trigger">Print</button>
Next we add the print-me shortcode like normal… but also add the external_trigger attribute like so:
[print-me target="#intro_text" external_trigger="my_button"/]
And that’s it! Note: The external_trigger attribute can accept a comma separated list of multiple id’s. Also: When an external_trigger attribute is assigned, no standard print-pro-matic icon or text will be displayed, as the external trigger will be used instead.