Colorful Tag Cloud Plugin For jQuery - prettyTag

File Size: 9.24 KB
Views Total: 4623
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Colorful Tag Cloud Plugin For jQuery - prettyTag

prettyTag is a jQuery plugin mainly designed for creating a colorful tag cloud that dynamically applies random colors to tags.

In addition, this plugin also supports input mode that allows the user to add/remove tags similar to the tagging system.

How to use it:

1. Include the stylesheet prettytag.css in the <head> section of your page and the JavaScript file prettytag.js before the closing </body> tag.

<link rel="stylesheet" href="css/prertytag.css">
<script src="" 
<script src="js/jquery.prettytag.js"></script>

2. Create a tag cloud from an HTML unordered list as follows:

<ul class="cloud-tags">
    <a href="#1"> Tag 1 </a> 
    <a href="#2"> Tag 2 </a> 
    <a href="#3"> Tag 3 </a> 

3. Call the function on the HTML list and done.




4. Create a tag input where the users are able to input multiple tags separate with the comma.

<input class="codehim-input-tags" name="tags" type="text" />

<section class="show-input-tags">

  <ul class="tags cloud-tags"></ul>


5. Enable/disable the tag icon (Requires Font Awesome Iconic Font).

  tagicon: false

6. Decide whether or not to use random colors.

  randomColor: false

7. Set the tag URL for the tags input. URL parameters are supported as well.

  tagURL: "#"

About Author:

Authod: Asif Mughal


This awesome jQuery plugin is developed by CodeHimBlog. For more Advanced Usages, please check the demo page or visit the official website.