Tag Cloud: Tabs Examples

This shortcode displays your tags in tag clouds where each group has its own tab. These tag clouds use the built-in theme “delta”.

Example #1: Basic Tabs

This first example uses the tabs format with a mouseover effect. Here is the shortcode:

[tag_groups_cloud order=DESC orderby=count hide_empty_tabs=1 mouseover=1]

Here is the output for the first example. Each group of tags has it’s own tab.

Example #2: Tags in Random Order

If you include more than one group, the tag clouds will be displayed next to each other. If you want to combine several groups, you will need this tag cloud (premium plugin). The border can be hidden with custom CSS.

Code

[tag_groups_cloud div_id=tag_group2 orderby=random hide_empty_tabs=1 include=1 show_tabs=0]

Output

Example #3: Collapsible, With Custom Title

The “collapsible” parameter allows you to close all tag clouds (toggle open/close).

[tag_groups_cloud div_id=tag_group3 collapsible=1 custom_title="Number of posts: {count}."]

Here is the output for this example:

Example #4. Custom Styling

The following example uses “append” with the placeholder {count} and a custom styling.((Custom styling is for advanced users and requires knowledge of CSS. The theme “tag-groups-theme-green” comes only with the premium plans but alternatively you can create similar colors with own CSS.))

[tag_groups_cloud div_class="tag-groups-theme-green" append="{count}" custom_title="We have {count} posts for this tag."]

Here is the output for this example: