In writing an article on our mortgage broker website we defaulted to our 'Related Posts' feature to add a number of related posts in an accordion format towards the bottom of the page. However, in creating our 'Related' panels we quickly realised that we were simply including all articles assigned to the same category, so rather than go through the process of creating each individual panel in Yabber, we created a Category Posts Accordion to the Yabber website plugin. This article details how to use the shortcode or Elementor Widget to return grouped articles.
This Module is Updated: The accordion feature described on this page has undergone significant updates since it was first written. Please refer to the applicable Post Accordion FAQ - the FAQ module is updated regularly. Results returned to this page may now show as expected or intended.
The Result
The result shown below is returned via an Elementor Widget (introduced shortly) or via standard WordPress shortcode. In our case we've used the shortcode of [bm_category_posts categories="lender-bank-data"]
. The result, as the category slug passed in the shortcode as the categories
attribute implies, is a panel of lender data 'related' articles:
■ ■ ■
Since we've used shortcode, a number of attributes apply to alter the format of results, with the most basic and essential being categories
, tags
, and number
. The style applied to the accordion is based of those made available via the FAQ module, and these styles may be referenced with the profile
attribute. Individual styles may be altered via shortcode but this is a messy endeavour that'll only end up in brain-pain.
Categories & Tags: An example panel returned with multiple categories and tag filtering applied might be [bm_category_posts categories="lender-bank-data,elementor" tags="something,something-else"]
. Note that we accept category and tag slug - not ID. To return article associated with just a tag, and limiting the number of results is as follows: [bm_category_posts tags="something,something-else" number="10"]
. More details on usage is available in Yabber.
Pending Features: Detailed shortly, the result shown is more of a skeleton than a polished product. The format itself will be altered to include results in boxes, and the standard accordion format will soon include the featured image in addition to other relevant post meta data.
Once the single category or a comma separated list of categories is supplied to the shortcode, the tags attribute may be used to 'filter' the results further by post tag. There are a large number of shortcode attributes but those you will use most often are categories
, tags
, orderby
, order
amd words
(the length of your content, as opposed to truncate
which truncates your title), and number
(the number of results that are returned). Your 'default' FAQ style will be applied to result unless specifically overridden with a specific profile value.
Elementor Widget
The easiest way of including the accordion panel is by way of the 'Category Posts Accordion' widget. Drag the widget into your page, select the applicable categories, and the accordion will be returned to your page. If tags are applied while categories are selected, the result will filter on the tags (so only those posts tagged with the applicable terms in the categories are returned). If no category is selected the accordion returns only those tags selected. Options are presented to limit the number of results, return posts of a particular status (published, future etc.), the display format, and ordering.
Pictured: Elementor Post Category Widget. Drag the widget into your page, select the applicable categories, and the accordion will be returned. Various options apply for the purpose of altering the returned data. The style applied is inherited from those profiles created for FAQ panels.
Once data is returned once it is cached until the attributes are altered. Basic UTM tracking data may apply.
Conclusion
The Elementor Widget shows a value called 'Display Format', and this is because we'll update the Widget shortly to return box-style content rather than the default accordion. We'll add more features as feedback is provided by those that use the tool.
The panel is very similar to the 'Related Posts' module in Yabber which is also optionally rendered with shortcode or an Elementor widget. The primary difference between the two systems is that the Yabber system caters for 'crafted' lists, while the widget we've just introduced is based purely on categories and tags, and it is not connected to Yabber in any way (precluding usage in Yabber such system as Contentus).