Collapse-O-Matic Nested SwapTitles

[expand title="Fiction" rel="fiction" swaptitle="Is like non-non-fiction"]
[expandsub1 title="Star Wars" rel="submenu-highlander" swaptitle="Hyperspeed"]Target Content[/expandsub1]
[expandsub1 title="Star Trek" rel="submenu-highlander" swaptitle="Warpspeed"]Target Content[/expandsub1]
[/expand]
Fiction
Star Wars
Target Content
Star Trek
Target Content

Collapse-O-Matic Grey Bar Style

Here is an example of how to pimp the collapse-o-matic expand to use a grey bar style using CSS.
Be sure you are using the div ad your default tag in the plugin settings.

The CSS:

.greybar {
   border: 1px dotted #aaaaaa;
   padding: 7px;
   background-position: 98% center;
   background-color: #cccccc;
}

The Code:

[expand trigclass="arrowright greybar" title="Monkeys Are Fast"]...[/expand]
Monkeys Are Fast

To give the target content a border, use the targclass attribute:

The CSS:

.blueborder {
   border: 1px dotted blue;
   border-top: none;
   margin-left: 0;
  padding: 5px;
}

The Code:

[expand trigclass="arrowright greybar" targclass="blueborder" title="Monkeys Are Fast"]...[/expand]
Monkeys Are Fast

To add a graphic to the background, simply create a new class and add the appropriate css:

.de_flag {
    background-image: url(https://lipis.github.io/flag-icon-css/flags/4x3/de.svg);
    background-size: 64px 16px;
    background-repeat: no-repeat;
    background-position: -10px center;
    padding: 7px 7px 7px 42px;
}

then add the new class to the trigclass attribute:

[expand trigclass="arrowright greybar de_flag" title="Deutschland"]...[/expand]
Deutschland

Tidal Chart for Leith

How to caculate a countdown to the next high and low tide.

First, there is a nice plugin called Tides Today UK and Ireland tide times that allows tidal charts to be displayed using a Sidebar Widget or a shortcode. For example:

[tide_times days=1 title="Tide times for Leith" location="leith"]These are today's tides for Leith[/tide_times]

That outputs a tidy forecast like so:

Tide times for Leith

These are today’s tides for Leith

map

26 September 2017

Time Type Height
07:12 High 4.9m
12:21 Low 1.6m
19:27 High 4.8m

Copyright 2017 © Tides Today. By using this data, you are agreeing to the Terms and Conditions


The shortcode references the authors own web-service api that returns a JSON encoded dataset. Here is the dataset for Leith. However, the plugin author clearly (if not threateningly) states:

You may not use the data provided by the API for anything other than displaying tide information on your website by the
means provided by this plugin.

…Failure to comply with any of the conditions outlined here or as outlined in the Tides Today Terms and conditions will result in legal action being taken.

In the words of Al Swearengen:

Not a tone to get a deal done.

Even though the datasource provide is from the UK Hydrographic Office:

All data is provided by the UK Hydrographic Office and is provided under license. Crown Copyright 2016.

https://tides.today/about/

So we might need to find our own, tax-funded, public, non-threatening api to get our tidal info from, for example:
https://data.gov.uk/publisher/united-kingdom-hydrographic-office
https://www.tidetimes.org.uk/leith-tide-times
even better:
RSS: https://www.tidetimes.org.uk/leith-tide-times.rss
Twitter: https://twitter.com/LeithTideTimes
http://www.ntslf.org/
https://tidesandcurrents.noaa.gov/api/
https://www.worldtides.info/
https://www.wunderground.com/

The NOAA api looks quite promising… but it’s only for North America. So we move on to Worworldtides api which provides 1000 free calls per month. So far that is a winner. Now let’s take a look at The National Tidal and Sea Level Facility. It seems it only serves the UK and Ireland. Here is Leith.

Leith
http://www.ukho.gov.uk/easytide/EasyTide/ShowPrediction.aspx?PortID=0225&PredictionLength=1

Holy Island
http://www.ukho.gov.uk/easytide/EasyTide/ShowPrediction.aspx?PortID=0208&PredictionLength=1

Archive Pro Matic Highlight Class

Introducing a new attribute for Archive-Pro-Matic: highlight
highlight will accepts the following values:

  • current-year
  • active-year

Demos

We have added a bit of css to highlight each of the classes:

.current-year {
border-left: 2px solid red;
}

.active-year {
border-left: 2px solid blue;
}

current-year

Assigning ‘current-year’ as the value of the highlight attribute will add a current-year class to the current year in the list:
[archives type="yearly" cat_id="4" limit="5" highlight="current-year"/]

active-year

Assigning ‘active-year’ would only be used on the archive page itself. To see this in action, first visit the an archive page, say 2014 and on that page place an archive list using the sidebar widget or following shortcode.

[archives type="yearly" cat_id="4" limit="5" highlight="active-year"/]

Print-O-Matic and WordPress Charts

Here is an example of using Print-O-Matic to print a WordPress Chart using wp-charts

First, the chart:
[wp_charts title=”mypie” type=”pie” animation=”false” align=”alignright” margin=”5px 20px” data=”10,32,50,25,5″]

Now we make a print button:

It seems we need to wrap the chart shortcode in a div so we can target that div and include it’s related javascript.
Still not. maybe we also need to include the chart js on the page?
Nope. It seems the HTML Canvas element is not cloning it’s content that was generated by the javascript… hmmm.

Archive-Pro-Matic Alpha List Subheadings

Archive-Pro-Matic version 1.0.4 introduces two new attributes: alpha_headings and alpha_tag

[archives type="alpha" cat_id="4" limit="10" alpha_headings="true"/]

[archives type="alpha" cat_id="4" limit="10" alpha_headings="true" alpha_tag="strong"/]