Year: 2015

February 2015

April 2015

select your year…
Select Year 2010 2012 2013 2014 2015 2016 2017 2018 2019 2020 2021 2022 2023

This is how you modify the print-icon to have it show up in a simple menu. If we start with a simple right-aligned menu:

<p style="text-align: right;"><span class="expandall">Expand All</span> | <span class="collapseall">Collapse All</span> | [print-me]</p>

See how the icon jumps to it’s own line?

Expand All | Collapse All |

Let’s fix that.

Step one, assign a some new CSS rules for an id element:

#my_print_id {
    display: inline-block;
}
#my_print_id:before,  #my_print_id:after{
    content: none;
}

Step two, insert a roll-your-own* version of the shortcode like so:

<p style="text-align: right;"><span class="expandall">Expand All</span> | <span class="collapseall">Collapse All</span> | <span class="printomatic pom-small" id="my_print_id"><input type="hidden" id="target-my_print_id" value="article"></span></p>

BAM, it’s working*:

Expand All | Collapse All |

*Note: the roll-your-own method shown above only works for print-o-matic versions 1.5.7 and older. This will not work with print-pro-matic or versions 1.6.0 or newer.

Now lets’s try something new. We have added tag and class attributes to version 1.6.0 so we can now do something like:

The Jedi Way

.my_print_class {
    display: inline-block;
}
.my_print_id:before, .my_print_id:after{
    content: none;
}

And we add our shortcode with the new tag and class attributes:

<p style="text-align: right;"><span class="expandall">Expand All</span> | <span class="collapseall">Collapse All</span> | [print-me printstyle="pom-small" class="my_print_class" tag="span"]</p>

Expand All | Collapse All |