Introduction - Purpose

3D Tag Cloud (on JavaScript) for Magento creates a dimensional cloud of tags that rotates on your website. No Flash is used for it, the extension has been developed on pure JavaScript, so your tags will be indexed by search engines (which is not possible with Flash technology).

If the area for tag cloud is square – the tags will be rotated in the trajectory of a sphere. If the area of tag cloud is rectangular - the tags will be rotated in the trajectory of an ellipsoid.

Another great advantage of 3D Tag Cloud (on JavaScript) for Magento is that it allows not only to use defaults tags from your Magento Store, but also to create a custom list of items with the same dimensional rotating effect. These items can be your best products, or URLs of your websites, or anything. Moreover, you can set custom weight for each item and a custom color. With this feature you create a list of items that you want to attract attention to.

Installation and License - Installation

All our Magento extensions and templates are installed via IToris Installer.

Download IToris Installer from //www.itoris.com/itoris-magento-installer.html and un-pack to the root of your website. It will then appear in menu System –>IToris extensions –> IToris Installer.

Open it and you will see all our Magento Extensions and Templates, both installed and available. You can install, update and un-install them with one click now.

Find 3D Tag Cloud in the list of extensions and press Install button. The extension will be installed.

How to Use - Settings. Standard Configuration

Install 3D Tag Cloud and open it in admin area (System –>IToris extensions –> 3D Tag Cloud). You will see Standard Configuration settings.

You can set:

• Border color – color of border around each tag. If you do not need a border – leave it blank.
• Background color – color of tag cloud area’s background. If you want it to be transparent – leave it blank
• Font size – size of font of tags. This is the largest size of a tag (when it is closer to the viewers)
• Font – the font of tags
• Font color – the color of tags’ font
• Replace standard tag cloud – when checked, 3D Tag Cloud will replace all standard Tag Clouds around all your website

How to Use - Settings. Custom Configuration

This is a special feature of the extension. When you do not want to use your defaults tags, but rather wish to attract your users’ attention to your best products, or add websites of your partners as tags or create any other custom list – select Custom Configuration of the left.

Here you will get general settings for Tag Cloud area as well as ability to add custom tags and special settings for each tag separately.

General settings:

• Border color – color of border around each tag. If you do not need a border – leave it blank.
• Background color – color of tag cloud area’s background. If you want it to be transparent – leave it blank
• Font – the font of tags
• Font size – size of font of tags. This is the largest size of a tag (when it is closer to the viewers)

Special settings for each tag cloud:

• ID – ID of your custom tag
• Tag name of your custom tag that will be displayed
• Redirect URL URL where your users will be redirected when the tag is clicked
• Font Color – each of your custom tags can have its own color
• Priority – the more priority your tag has the larger it will be. The largest size you set in Font size
• Actions – here you can add new tags, edit and delete the existing ones.

How to Use - Add on Website

There are 3 ways how tags can be added to the website:

• Replace all Tag Clouds you have by defaults (Popular tags on the main page on the bottom left, All tags going in the middle of the page, Product tags available on product pages)
• Add your own Tag Clouds on CMS pages (content)
• Add your own Tag Clouds in custom places on the level of Website template layout

Replace all standard tag clouds automatically (for defaults tags only):

When Replace standard tag cloud checkbox is checked – all your standard tag clouds all over the website will be replaces with new Tag Clouds (for defaults tags). The width and height of the new tag cloud will correspond to the sizes of the container it is added to (in this case – the new tag cloud will be of the same size as the defaults tag clouds). The number of tags will be taken from the website’s defaults configs. I.e. if you have a page on the website that shows all tag clouds and the config has 100 tags to be displayed – with 3D Tag Cloud you will get the tag cloud area of the same size and with the same number of tags to be displayed maximum.

Add to a CMS page:

You can add Tag Cloud area to a CMS page. To do it add the tag to the page:

Where:

• <type> should be standard or custom (depending on whether you use defaults tags or a custom list of tags)
• <number of tags> - enter the number of tags to be displayed in the tag cloud area
• <width> - width of Tag Cloud area
• <height> - height of Tag Cloud area

E.g.{{block type="itoris_rcot/cloud" set="standard" count="10" height="150" width="400"}}

Add to a file layout:

You can insert tag cloud in a file layout. To do it add the tag to the page:

Where:

• <type> should be standard or custom (depending on whether you use defaults tags or a custom list of tags)
• <number of tags> - enter the number of tags to be displayed in the tag cloud area
• <width> - width of Tag Cloud area
• <height> - height of Tag Cloud area

E.g.

How to Use - Add on Website - Priority of Width and Height Defining for tag Cloud Area

When you add 3D Tag Clouds to your website – width and height for the area can be set in different places. The priority (lower to higher) is the following:

• Widths and height are set for the area in CSS
• Width and height are set for the area in layout
• Width and height are set forcibly in the parameters of the tag cloud area

N.B. When width and height are not defined at all for All Tags page – the width will be calculated automatically depending on the layout of the page. The height in this case will be equal to the width (square area).

When width and height are not defined at all for Tags area on products’ pages – the width will be calculated automatically depending on the layout of the page. The height in this case will 1/3 of the width.