Archive-Pro-Matic Advanced Category Archives

Building on the new block-style archive described in the last post, we now try with categories:

All Categories:

[archives type="monthly" taxonomy="category" sub_options="block" tag="div" sub_ul_class="my_slim_ul" li_class="block_archive_item" limit="10"/]

Single Category

[archives type="monthly" taxonomy="category" term="archive-pro-matic" sub_options="block" tag="div" sub_ul_class="my_slim_ul" li_class="block_archive_item" limit="10"/]

or use the cat attribute:

[archives type="monthly" cat="special1-posts" sub_options="block" tag="div" sub_ul_class="my_slim_ul" li_class="block_archive_item" limit="10"/]

or use the category attribute (alias for cat):

[archives type="monthly" category="special1-posts" sub_options="block" tag="div" sub_ul_class="my_slim_ul" li_class="block_archive_item" limit="10"/]

Multiple Categories

For an archive of multiple categories, the cat_id attribute must be used:

[archives type="monthly" cat_id="55,43" sub_options="block" tag="div" sub_ul_class="my_slim_ul" li_class="block_archive_item" limit="10"/]

Archive-Pro-Matic – Advanced Monthly Sub Archives

This is a test to create a category archive in the following format:

  • July 2021
  • March 2021
  • February 2021
  • January 2021
  • December 2020
  • November 2020
  • September 2020
  • August 2020
  • July 2020
  • June 2020
  • May 2020
  • April 2020
  • March 2020
  • February 2020
  • December 2019
  • August 2019
  • July 2019
  • June 2019
  • May 2019
  • April 2019
  • October 2018
  • September 2018
  • August 2018
  • July 2018
  • March 2018
  • February 2018
  • January 2018
  • December 2017
  • October 2017
  • September 2017
  • July 2017
  • June 2017
  • May 2017
  • February 2017
  • January 2017
  • December 2016
  • November 2016
  • September 2016
  • August 2016
  • July 2016
  • June 2016
  • May 2016
  • April 2016
  • March 2016
  • February 2016
  • January 2016
  • December 2015
  • November 2015
  • October 2015
  • September 2015
  • August 2015
  • July 2015
  • June 2015
  • May 2015
  • April 2015
  • March 2015
  • February 2015
  • January 2015
  • December 2014
  • November 2014
  • October 2014
  • September 2014
  • August 2014
  • July 2014
  • June 2014
  • May 2014
  • April 2014
  • January 2014
  • December 2013
  • November 2013
  • October 2013
  • August 2013
  • June 2013
  • April 2013
  • March 2013
  • February 2013
  • January 2013
  • December 2012
  • November 2012
  • October 2012
  • September 2012
  • August 2012
  • June 2010

  • Step one: allow the sub_options attribute to work with standard monthly archives.

    [archives type="monthly" sub_options="true" limit="10" /]

    Step two: add new feature to allow sub_options to be sorted ASC (1 – 12) or DESC (default: 12 – 1). New attribute: sub_order

    [archives type="monthly" sub_options="true" sub_order="ASC" limit="10" /]


    Step three: add the ability show empty months as placeholders. New attribute: show_empty

    [archives type="monthly" sub_options="true" show_empty="true" limit="10" /]

    Step four: allow month date to be formatted: January becomes Jan. New attribute: month_format just use the date_format attribute

    [archives type="monthly" sub_options="true" month_format="M" sub_order="ASC" show_empty="true" limit="10" /]

    Step five: test that this works with category filters. Here we use cat_id to only show archives for category id 55:

    [archives type="monthly" cat_id="55" sub_options="true" sub_order="ASC" show_empty="true" limit="10" month_format="M"/]

    A single category archive can be shown using the category slug with the cat attribute:

    [archives type="monthly" cat="collapse-pro-matic" sub_options="true" sub_order="ASC" show_empty="true" month_format="m" limit="10" /]

    Step six: adjust format so year and months are displayed in a single line. The following attributes have been added to add classnames to the archive elements for styling:

    • class – classname for the archive element
    • li_class – classname for a LI element
    • sub_ul_class – classname for a sub ul element
    • sub_li_class – classname for a sub LI element
    • empty_class – classname for an empty LI element

    To test this we first need to define some simple classes:

    .my_clean_achive {
       border: 1px dotted black;
    }
    .my_sub_achive {
       border: 1px dotted red;
    }
    .red a {
       color: red;
       font-weight: bold;
    }
    .green a {
       color: green;
    }
    .grey {
       color: #999999;
    }

    Now we just need to assign the classes to the archive elements:

    [archives type="monthly" cat="collapse-pro-matic" sub_options="true" sub_order="ASC" show_empty="true" month_format="M" limit="10" class="my_clean_achive" sub_ul_class="my_sub_achive" li_class="red" sub_li_class="green" empty_class="grey"/]

    Now that we can control the CSS of every element we can finally create a block style archive using the following css:

    .block_archive_item {
        display:inline;
        margin-left: 5px;
        white-space: nowrap;
    }
    .block_archive_item a {
       color: red;
    }
    
    [archives type="monthly" cat="collapse-pro-matic" sub_options="true" sub_order="ASC" show_empty="true" month_format="M" limit="10" li_class="block_archive_item" empty_class="grey"/]

    Nearly there:

  • July 2021
  • March 2021
  • February 2021
  • January 2021
  • December 2020
  • November 2020
  • September 2020
  • August 2020
  • July 2020
  • June 2020
  • Now if we do not want the sub_options (months in this case) to be in a separate element (ul) we need a way let the system know: new accepted value ‘block’ for the sub_options attribute: sub_options=”block”.

    [archives type="monthly" sub_options="block" limit="10" /]

    We also no longer need to wrap the entire archive in a UL element, so we use tag=”div”. Finally we need to assign a sub_ul_class to slim down the sub_ul elements:

    .my_slim_ul {
       margin: 0;
    }
    
    [archives type="monthly" cat="collapse-pro-matic" sub_options="block" sub_order="ASC" show_empty="true" date_format="M" limit="10" 
    tag="div" sub_ul_class="my_slim_ul" li_class="block_archive_item" empty_class="grey"/]

    The final result:

  • July 2021
  • March 2021
  • February 2021
  • January 2021
  • December 2020
  • November 2020
  • September 2020
  • August 2020
  • July 2020
  • June 2020
  • May 2020
  • April 2020
  • March 2020
  • February 2020
  • December 2019
  • August 2019
  • July 2019
  • June 2019
  • May 2019
  • April 2019
  • October 2018
  • September 2018
  • August 2018
  • July 2018
  • March 2018
  • February 2018
  • January 2018
  • December 2017
  • October 2017
  • September 2017
  • July 2017
  • June 2017
  • May 2017
  • February 2017
  • January 2017
  • December 2016
  • November 2016
  • September 2016
  • August 2016
  • July 2016
  • June 2016
  • May 2016
  • April 2016
  • March 2016
  • February 2016
  • January 2016
  • December 2015
  • November 2015
  • October 2015
  • September 2015
  • August 2015
  • July 2015
  • June 2015
  • May 2015
  • April 2015
  • March 2015
  • February 2015
  • January 2015
  • December 2014
  • November 2014
  • October 2014
  • September 2014
  • August 2014
  • July 2014
  • June 2014
  • May 2014
  • April 2014
  • January 2014
  • December 2013
  • November 2013
  • October 2013
  • August 2013
  • June 2013
  • April 2013
  • March 2013
  • February 2013
  • January 2013
  • December 2012
  • November 2012
  • October 2012
  • September 2012
  • August 2012
  • June 2010
  • Done!

    Here is a test using the new link_atts attribute:

    [archives type="monthly" cat="collapse-pro-matic" sub_options="block" sub_order="ASC" show_empty="true" date_format="M" limit="10" 
    tag="div" sub_ul_class="my_slim_ul" li_class="block_archive_item" empty_class="grey" link_atts="target='_blank'"/]
  • July 2021
  • March 2021
  • February 2021
  • January 2021
  • December 2020
  • November 2020
  • September 2020
  • August 2020
  • July 2020
  • June 2020
  • May 2020
  • April 2020
  • March 2020
  • February 2020
  • December 2019
  • August 2019
  • July 2019
  • June 2019
  • May 2019
  • April 2019
  • October 2018
  • September 2018
  • August 2018
  • July 2018
  • March 2018
  • February 2018
  • January 2018
  • December 2017
  • October 2017
  • September 2017
  • July 2017
  • June 2017
  • May 2017
  • February 2017
  • January 2017
  • December 2016
  • November 2016
  • September 2016
  • August 2016
  • July 2016
  • June 2016
  • May 2016
  • April 2016
  • March 2016
  • February 2016
  • January 2016
  • December 2015
  • November 2015
  • October 2015
  • September 2015
  • August 2015
  • July 2015
  • June 2015
  • May 2015
  • April 2015
  • March 2015
  • February 2015
  • January 2015
  • December 2014
  • November 2014
  • October 2014
  • September 2014
  • August 2014
  • July 2014
  • June 2014
  • May 2014
  • April 2014
  • January 2014
  • December 2013
  • November 2013
  • October 2013
  • August 2013
  • June 2013
  • April 2013
  • March 2013
  • February 2013
  • January 2013
  • December 2012
  • November 2012
  • October 2012
  • September 2012
  • August 2012
  • June 2010
  • Grouping with Rel vs Togglegroup Attbitues

    Rel Attribute

    Here is an example of using the rel attribute. Notice how selecting a member of one group will auto-collapse members of all other groups.

    [expand title="Star Wars" rel="fiction" swaptitle="Not Star Trek"]Target Content[/expand]
    [expand title="Star Trek" rel="fiction"]Target Content[/expand]
    [expand title="Battlestar Galactica" rel="fiction"]Target Content[/expand]
    [expand title="Space Race" rel="history"]Target Content[/expand]
    [expand title="Ansari X Prize" rel="history"]Target Content[/expand]
    Star Wars
    Target Content
    Star Trek
    Target Content
    Battlestar Galactica
    Target Content
    Space Race
    Target Content
    Ansari X Prize
    Target Content

    Togglegroup Attribute

    Here is an example using the togglegroup attribute. Members of multiple togglegroups may be open at the same time.

    [expand title="Star Wars" togglegroup="togfiction"]Target Content[/expand]
    [expand title="Star Trek" togglegroup="togfiction"]Target Content[/expand]
    [expand title="Battlestar Galactica" togglegroup="togfiction"]Target Content[/expand]
    [expand title="Space Race" togglegroup="toghistory"]Target Content[/expand]
    [expand title="Ansari X Prize" togglegroup="toghistory"]Target Content[/expand]
    Star Wars
    Target Content
    Star Trek
    Target Content
    Battlestar Galactica
    Target Content
    Space Race
    Target Content
    Ansari X Prize
    Target Content

    Rel Highlander Grouping

    Here is an example using the rel attribute with highlander grouping:

    [expand title="Star Wars" rel="fiction-highlander" swaptitle="Not Star Trek"]Target Content[/expand]
    [expand title="Star Trek" rel="fiction-highlander"]Target Content[/expand]
    [expand title="Battlestar Galactica" rel="fiction-highlander"]Target Content[/expand]
    [expand title="Space Race" rel="history-highlander"]Target Content[/expand]
    [expand title="Ansari X Prize" rel="history-highlander"]Target Content[/expand]
    Star Wars
    Target Content
    Star Trek
    Target Content
    Battlestar Galactica
    Target Content
    Space Race
    Target Content
    Ansari X Prize
    Target Content

    Highlander Grouping using Togglegroup Attribute

    [expand title="Monkeys" togglegroup="animal-highlander"]Target Content[/expand]
    [expand title="Donkeys" togglegroup="animal-highlander"]Target Content[/expand]
    [expand title="Tigers" togglegroup="animal-highlander"]Target Content[/expand]
    [expand title="Bears" togglegroup="animal-highlander"]Target Content[/expand]
    [expand title="Porsche" togglegroup="car-highlander"]Target Content[/expand]
    [expand title="Volvo" togglegroup="car-highlander"]Target Content[/expand]
    [expand title="Mercedes" togglegroup="car-highlander"]Target Content[/expand]
    Monkeys
    Target Content
    Donkeys
    Target Content
    Tigers
    Target Content
    Bears
    Target Content
    Porsche
    Target Content
    Volvo
    Target Content
    Mercedes
    Target Content

    Group Attribute

    This is a test of the group attribute which is being considered to replace rel, will be used as an alias for now:

    [expand title="Star Wars" group="gfic" swaptitle="Not Star Trek"]Target Content[/expand]
    [expand title="Star Trek" group="gfic"]Target Content[/expand]
    [expand title="Battlestar Galactica" group="gfic"]Target Content[/expand]
    [expand title="Space Race" group="ghis"]Target Content[/expand]
    [expand title="Ansari X Prize" group="ghis"]Target Content[/expand]
    Star Wars
    Target Content
    Star Trek
    Target Content
    Battlestar Galactica
    Target Content
    Space Race
    Target Content
    Ansari X Prize
    Target Content

    Quick test to make to see if our ‘number’ issue has been fixed:

    [expand title="123" rel="123"]this is a number group[/expand]
    [expand title="456" rel="456"]this is also a number group[/expand]
    123
    this is a number group
    456
    this is also a number group