5 minutes reading time (1023 words)

Explore the Core: showing tagged items

Explore the Core: showing tagged items

2023---JCM-August-Tagged-Items

Joomla provides us with two Tags modules by default. These are Tags - Similar and Tags - Popular. Let’s take a look and see what these modules can do for us.

In a similar way to categories, we can use tags to organise, or filter, website content. This is especially helpful on larger sites with a lot of content where articles can be grouped together by tags where the content is similar. Luckily Joomla thinks the same way, so the first module we’ll look at deals with similar tags.

Tags - Similar

Tags Similar displays links to other articles with similar tags, simple as that. We can define how similar by using the Match Type setting which gives us Any, All or Half as options.

What does Match Type mean?

Any - like it says, any tags that match All - all tags in one article have to match all the tags of another article Half - this can produce fewer results as it’s looking for a match of greater than or equal half the tags in an article matching another article’s tags

The resulting output of this tag filter is usually a list of tags that link to other articles with similar tags. Using the Advanced tab it’s possible to amend the view of this list by changing the module title (if displayed) to a an H3, H4, etc and the module wrapper can be assigned a contextual tag such as aside, details, section, summary, etc.

image

According to the documentation it also filters optionally on Language, though my module didn’t have this option and this may be a throwback to Joomla 3.x

You might want to experiment with the settings available to see which produces the best set of tags for your content.

Also available is a module that shows us tags that are popular in a Joomla website.

Tags Popular

The module description says, it “... displays tags used on the site in a list or a cloud layout. Tags can be ordered by title or by the number of tagged items and limited to a specific time period.”

Not so long ago, with the advent of “Web 2.0” tag clouds on websites were all the rage but have declined in popularity. Also referred to as a word cloud or weighted list, a tag cloud displays tags in varying sizes depending on the popularity of the content the tag was assigned to, or the number of times the tag appeared on the site. The more popular or numerous the tag, the larger the font.

Parameters

You may not be familiar with this term, but a parameter basically refers to the options provided by a module.

Parent Tag - if you created tags using Component > Tags there’s an option to select a parent for your tags. This helps organise content, especially on larger websites Maximum Tags - literally the number of tags you want to display - this can be affected by Order and Direction Time Period - this means the most or least popular in the preceding time period ie what was popular in the past week. Handy for news sites, for example. Order Title Number of Items Random Direction - Ascending / Descending should mean ordering from lowest to highest, or vice versa, however if you limit the number of tags to display some items may disappear Display Number of Items - ie the number of times a tag appears in the content Show “No results” text - if there are no tags to display, this option shows a default message of “No Tags found”

image

How the parent item is displayed in the article editor

Tags - Popular has a tab in the module settings called “Cloud Layout” which sets the higher and lower font size. By default the Minimum Font Size is 1 and Maximum Font Size is 2. The number refers to the number of em’s.

"An em is a unit of measurement, relative to the size of the font; therefore, in a typeface set at a font-size of 16px, one em is 16px." - Google Fonts Glossary

To select a tag cloud go to the Advanced tab and select the Cloud option from the Layout dropdown. You may also have alternative layouts set, defined by using Layout Overrides, and they would also appear in this dropdown.

image

 

What We See and What We Get

If I choose the default layout I see a list of popular tags ordered by the Order setting and in an Ascending or Descending direction. As a Cloud I get a more formatted list according to how wide a range of font sizes I have selected.

image

When I click a link in my cloud / list I get a tag list and this behaves differently depending on whether I have a menu item set for that tag.

If I click “beaufort scale” I get a list of the child tags I defined earlier, but it’s formatted differently. The URL is a system link: /component/tags/tag/beaufort-scale rather than an SEO-friendly one.

We can see the difference if I select “weather” as this already had a menu item assigned and the Menu Item Type was set to “Compact List of Tagged Items” - this is useful to bear in mind when assigning tags to articles as menu items and published articles aren’t the only way that a user can access content on a Joomla website. Categories and tags are also listed in search engine results, so if you want people to see nicely formatted content then think about all the access points to your site.

Conclusion

While these two tags modules seem simple enough, they do offer powerful ways of organising and alternative routes for users to access website content.

Test Website Photo Credits:
Kayakers photo by David Boca on Unsplash
Paddle Boarders photo by Krzysztof Kowalik on Unsplash
Yacht photo by Jeremy Bishop on Unsplash

Ipsum Text:
tunaipsum.com

Random facts about Joomla

This month, we're celebrating Joomla's 18th birthday.

Did you know this fact about Joomla?

Nearly 85,000 million-dollar companies chose to use Joomla in 2022.

 

More amazing facts about Joomla

×
Stay Informed

When you subscribe to the blog, we will send you an e-mail when there are new updates on the site so you wouldn't miss them.

Joomla and the EU Cyber Resilience Act
Getting to know the team behind Joomla 4.4
 

Comments

No comments made yet. Be the first to submit a comment
Already Registered? Login Here
Guest
Tuesday, 16 April 2024

Captcha Image