Print-Pro-Matic Placeholder Attribute

The placeholder attribute is used to add the print-me data to the page when print trigger and target will be added dynamically, for example: via AJAX or a Modal Window.

[print-me target="#print_me" placeholder="true"/]

This will not add the trigger to the page, just the targeting info for when the trigger is later displayed.

collapse-o-matic with inline link

This is an example of a collapse element with an inline link.

[expand title="this is a test with a <a href=''>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 with a link
here is some hidden content

Collapse-Pro-Matic External Link with Find-Me Scrolling

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

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]
R2-D2 (/ˌɑːrtuːˈdiːtuː/), or Artoo-Detoo[citation needed], is a fictional robot character in the Star Wars franchise created by George Lucas. A small astromech droid, R2-D2 is a major character and appears in nine out of the ten Star Wars films to date. Throughout the course of the films, R2 is a friend to Padmé Amidala, Anakin Skywalker, Leia Organa, Luke Skywalker, and Obi-Wan Kenobi in various points in the saga.
English actor Kenny Baker played R2-D2 in all three original Star Wars films, and received billing credit for the character in the prequel trilogy, where Baker’s role was reduced, as R2-D2 was portrayed mainly by radio controlled props and CGI models. In the sequel trilogy, Baker was credited as consultant for The Force Awakens; however, Jimmy Vee also co-performed the character in some scenes. Vee later took over the role beginning in The Last Jedi.[1] R2-D2’s sounds and vocal effects were created by Ben Burtt. R2-D2 was designed in artwork by Ralph McQuarrie, co-developed by John Stears and built by Tony Dyson.

Now we have another expand element with a link to R2D2 above using:

<a class="expandanchor" href="#droid2d2">R2-D2</a>
Astromech droid
An astromech droid is one of a series of “versatile utility robots generally used for the maintenance and repair of starships and related technology”. These small droids usually possess “a variety of tool-tipped appendages that are stowed in recessed compartments”. R2-D2 is an astromech droid introduced in 1977’s Star Wars and featured in all subsequent films.[14] The malfunctioning droid R5-D4 also makes a brief appearance in Star Wars.[15] U9-C4 is a timid droid sent on a mission with D-Squad, an all-droid special unit in Star Wars: The Clone Wars,[16] C1-10P is an oft-repaired, “outmoded” astromech who is one of the Star Wars Rebels regular characters,[17] and BB-8 is the astromech droid of X-wing fighter pilot Poe Dameron in The Force Awakens.

Custom Print Templates for Print-Pro-Matic

Note: This post assumes a basic understanding of WordPress templates and that a child-theme is being used.

To create a custom print template we first need to define a query var to trigger the template.
Add the following to the child-theme’s function.php file:

function printpromatic_query_var( $vars ) {
	$vars[] = 'print_view';
	return $vars;
add_filter( 'query_vars', 'printpromatic_query_var' );

Now WordPress will look for something like /?print_view=true at the end of any url.

Next step is to tell print-pro-matic to use the current page with the print_view query variable tacked on the back as the target url. Simply set the url attribute using the %print_view% placeholder as its value:

[print-me url="%print_view%"/]

Finally we need to check for this print_view query var and either a) use a custom print-only template file or b) modify the current page template to switch to a print-only view.

Redirect to Print-Only Template

If a print-only template exists simply redirect to this template file by adding the following code to the child-theme’s function.php file:

function printpromatic_print_template($original_template) {
    if ( get_query_var( 'print_view' ) ) {
		$new_template = locate_template( array( 'print-template.php' ) );
        return $new_template;
	return $original_template;
add_filter( 'template_include', 'printpromatic_print_template' );

Modify the Existing Template

This method involves modifying the current page template to change what it displays based on the presence of the print_view query var.

In the page template being used, we need to check if the query_var is present:

$print_view = get_query_var( 'print_view' );

Now we need to simply wrap the existing template elements in an if statement:

if( empty($print_view) ){
//print only

Archive-Pro-Matic Display Multiple Categories

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"]

Note: Currently the title of the archive page will display only the first category. A solution to display multiple titles is in the works. Multiple category titles will now display on the archive page.

Countdown Test – Local Computer Time

This is a test of a countdown that will launch at a specific time.
The time should not affected on the visitors local computer time.



Collapse-Pro-Matic Spacing

This is some text

Here is a headline

100-1 First thing
100-2 Second Thing
a. First Sub thing
b. Second sub thing
100-3 Third Thing
100-4 Forth Thing
100-5 Fifth Thing
I am bold.
Some info:
Here is some info that explains more about thing five.
100-6 Sixth Thing
100-7 Seventh Thing

Numbered List Items

<ul class="numbers">
    <li data-pos="2">one</li>
    <li data-pos="2">two
            <li data-pos="2"></li>
            <li data-pos="2">two.two</li>
            <li data-pos="2">two.three</li>
  • one
  • two
    • two.two
    • two.three
  • three
    • three.two
      • – this is a much longer piece of text that will wrap around and should display how the padding and offset of the numbering works with a longer text.
      • three.two.two
  • four


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, ".") ". ";