Tags are used to classify and identify items based on their various attributes. A Tag Cloud is a visual depiction of tags, typically used to describe the content of web sites in a format that is easy to understand and browse. Tags in a tag cloud are normally listed alphabetically, and the importance of a tag is shown with font size or color. Thus, both finding a tag by alphabet and by popularity is possible. Tagging has been popularized by websites associated with Web 2.0 and is an important feature of many Web 2.0 services.
Product Tags Module by Plugables allows you to make use of tags in your Ablecommerce store. You can associate multiple tags to a product and you can have multiple products associated to a tag. Tags can be searched and sorted based on their name and creation date.
You can add and assign tags to products from product edit page in merchant admin. After installation of the Product Tags module, the sidebar menu on edit product page will have a new Product Tags link. When you click on this link you will be able to see the tags associated with the product. You will be able to add, assign or un-assign the tags here.
On the store side you can display the Tag Cloud, tags associated to a particular product, products associated to a particular tag, and Search products by tags.
Get Product Tags Module Now.
Using Product Tags Module
On your store you can make use of the features made available by Product Tags module by using the ConLib controls provided by the Product Tags.
Tag Cloud
To display tag cloud you can use the [[ConLib:ProductTags\TagCloud]] control in your scriptlets. For example;
1 | [[ConLib:ProductTags\TagCloud Caption="Tag Cloud" MaxTags="100" Sorting="DESC"]] |
- Caption property is used to show the caption header for Tag Cloud. The default caption is ‘Tag Cloud’.
- MaxTags property controls the maximum number of tags displayed in tag Cloud. The default value is 50.
- Sorting property is used to sort the tags in Tag Cloud. By default the tags in Tag Cloud are shown in ascending order. You can set its property to DESC to show tags in Descending order. The default value is ASC.
Note: Tags are shown only in tag cloud if they are assigned to at least one Product.
Product Tags
To display tags associated with a particular product use the [[ConLib:ProductTags\ProductTags]] control in your scriptlets.
1 | [[ConLib:ProductTags\ProductTags]] |
Note: This control can be displayed on any page where ProductId is available.
Search Tags
You can use SearchTags control to display a search box for searching products via tags. [[ConLib:ProductTags\SearchTags]].
1 | [[ConLib:ProductTags\SearchTags Caption="Search Tags"]] |
- Caption property is used to show the caption header for search tags section. The default caption is ‘Search Tags’.
Screen Shots
Image 1 shows the product tags screen for a product. Here you can see the tags associated with the product and tags tags that are not associated to it. You can create as well as assign product tags here. Highlighted in the left menu bar is the “Product Tags” menu item that will be available once Product Tags module is installed.
Image 2 shows the main product tags page where all the product tags that are defined in the store are available. You can add product tags from here by clicking on the “Add Tags” Button.
When you click on “Add Tags” Button a pop-up is displayed as shown in image 3. Here you can add a single tag or a comma separated list of product tags.
Image 4 shows the products that are associated to Tag named “Computer”. You can also search more products to associate with it. Search option in available on this page to search products that are not associated with this tag.
The above Image shows the tag cloud. Note that the tags that are associated with more products are big relative to others. When you click on a particular tag, you will be able to see all products associated with the tag.
Image 6 shows the associated product of tag named “Computer”. As you can see, the tag cloud also contains shows the number of products associated with the tag.
The above image shows a product named “All-in-one Printer” and the tags that are associated with it.
The above image shows a tags search box as displayed in the sidebar.
The above image shows the searched products that are associated with the tag named “Computer”.