Support Center

How to create a Drupal Tag Cloud with Views

Last Updated: Sep 05, 2013 05:49PM EEST
You can find below all the appropriate instructions on how to create a Tag Cloud block with Views.

All screens come from our Premium Responsive Drupal theme Social Style (Red Color Scheme).

1. Create a new View with Taxonomy terms through Home » Administration » Structure » Views with the options View name: Tags Cloud, Show: Taxonomy terms, Block title: Tags Cloud, Display format: Unformatted list, Items per page: 50 and then Continue and edit

2. Add new Filter Criteria of Taxonomy vocabulary: Machine name, set it to only display terms from your Tags vocabulary to avoid pulling in Taxonomy terms from elsewhere and Apply (all displays) this filter

3. Under Advanced » Relationships, add Taxonomy term: Content with term, Apply (all displays) and finally Apply (all displays) again without any change

4. Under Advanced » OTHER, enable Use aggregation

5. Under Fields, add a new Field Content:Nid, Apply (all displays), choose the Count Aggregation type, Apply and Continue and finally Apply (all displays) with the following configuration:
  • Disable the option Create a label
  • Set Prefix "("
  • Set Suffix ")"

6. At the bottom of your current view, you should see already implemented the Tags Cloud

7. Save the Tags Cloud view

8. Add the following style rules to your stylesheet in order to display all fields inline
* Views
* Tags cloud.
.view-tags-cloud { line-height:180%; }
.view-tags-cloud .views-field-name { float:left; padding:0 2px 0 0; }
.view-tags-cloud .views-field-nid { float:left; padding:0 10px 0 0;  }

9. Place the exposed Tags Cloud view block to your First Sidebar region through Home » Administration » Structure » Blocks

10. Finally this is the result

Related articles

In case this article leaves any of your questions or concerns unanswered, please feel welcome to email us or post a public question.

​More than (just) Themes

Contact Us

[email protected]
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
Invalid characters found