Free tag cloud generator script for PHP web pages


Download tag cloud PHP script source code   


This article is a step by step guide to adding a tag cloud to your own web page without having to depend on third party tag cloud generators. Using your own tag cloud generator script becomes a must when the content of your web page is dynamic, for example database driven. So ... why would you have tag clouds on your pages? Tag cloud is very useful because it provides a visual depiction of the textual content of your web page - in other words it is a visual representation of the frequency of word usage in your content. Tag clouds use font color and size to indicate word frequency. In recent years tag clouds have been used on many blogs, social networking, and social bookmarking websites to summarize content and aid users in navigation and browsing. Properly implemented tag clouds have also a SEO (Search Engine Optimization) benefit because they make your website appear more interlinked to search engines which is likely to increase your search engine rank.

The tag cloud generator script provided in this article allows you to display a nice looking tag cloud in matter of minutes because the script was designed with easy integration in mind. The free tag cloud script object we are about to describe is written in PHP so your website's hosting must provide PHP.

For a real world working example please see PC Tools Spyware Doctor with AntiVirus on our website at the bottom of the page.

How to get started with the tag cloud script generator software?

First include the class file for the tag cloud at the the top of your page

<?php>
require(
'include/cloud.php');
?>

Define a variable which will hold the text content you want to represent in the tag cloud, for example

<?php
    $text_content 
"This is a very long text which I want to represent in " .
        
"my tag cloud. Normally this data would come from a database " .
        
"but this is irrelevant for this example. What is important is that " .
        
"the tag cloud data may come from any source you can imagine, like " .
        
"a computed variable, CSV file, database, or even another web page";
?>

Next, select a place where you want to display the tag cloud on your page and insert the code below

<?php
    $cloud 
= new PTagCloud(15);
    
$cloud->addTagsFromText($text_content);
    
$cloud->setWidth("300px");
    echo 
$cloud->emitCloud();
?>

The tag cloud will look as below.


How does this code work? The first line initializes a variable of type PTagCloud class holding the tag cloud object and sets the maximum number of tags to display to 15. The method addTagsFromText() submits our content to the tag cloud object. This function performs analysis of the text, strips html tags (if any), discards common words, removes punctuation etc. You can call addTagsFromText() multiple times to accumulate data from a variety of sources. Call to setWidth() is optional and in this example is used to set the width of the tag cloud object. Without this call the tag cloud would use all of the width available to it - probably not a very good idea for all situations. The last call in this example - emitCloud() is used to display the tag cloud object initialized in the previous lines.

How to modify the tag cloud links?

You have probably noticed that each tag in the tag cloud is a link. By default our object creates links which search Google on the words in the tag cloud. This is not always what you want, for example if your own web site provides a search capability. This website uses the following search URL:

http://www.softwaremastercenter.com/search.php?words=keywords

To make the tag cloud object search softwaremastercenter.com instead of Google you need to add this line:

<?php>
    
$cloud->setSearchURL("http://www.softwaremastercenter.com/search.php?words=");
?>

You will need to use your own search URL if you want to search your own website.

Tag cloud background options

What if you do not like the black background and want to use another color instead? Use code like this:

<?php>
    
$cloud->setBackgroundColor("olive");
?>

You can use any valid html color syntax as the parameter to setBackgroundColor(). Instead of solid color you can use a background image image, like this:

<?php>
    
$cloud->setBackgroundImage("images/clouds.jpg");
?>

Our tag cloud customized with softwaremastercenter.com search url and a background image looks as follows:


When you hover mouse pointer over the tags in the cloud you will see that link targets changed to use softwaremastercenter.com search url. This is very important for SEO purposes because it makes the site well interlinked.

Custom colors for your free tag cloud

In case you do not like the default set of colors provided by the PCloudTag class you can provide your own custom set of tag colors using the method setTextColors(). This method takes an array of ten colors as its argument. Index 0 provides the color for the least frequently used tag. You could use code like this:

<?php
    $cloud 
= new PTagCloud(15);
    
$cloud->addTagsFromText($text_content);
    
$cloud->setWidth("300px");
    
$arCustomColors[0] = "#440000";
    
$arCustomColors[1] = "#550000";
    
$arCustomColors[2] = "#660000";
    
$arCustomColors[3] = "#770000";
    
$arCustomColors[4] = "#880000";
    
$arCustomColors[5] = "#990000";
    
$arCustomColors[6] = "#aa0000";
    
$arCustomColors[7] = "#bb0000";
    
$arCustomColors[8] = "#dd0000";
    
$arCustomColors[9] = "#ff0000";
    
$cloud->setTextColors($arCustomColors);
    echo 
$cloud->emitCloud();
?>

with the following result:


Forcing a specifig tag into the tag cloud

Sometimes you may want to 'doctor' your tag cloud and increase the rank of a specific word. You may have to do it to align the contents of your tag cloud with the SEO objective of your page. The method addTag() of the PTagCloud object is created for this purpose. The call to this method looks like this:

<?php>
    
$cloud->addTag("myphrase"15);
?>

The first argument specifies the phrase, the second one is the number of (faked) occurrences of the phrase.

International character support

How about adding words with international characters? This can be done by configuring the PTagCloud object to use UTF-8 character set during text parsing. Use the setUTF8() method and pass boolean true as the parameter. This enables international character support in the tag cloud generator. This can be coded as follows:

<?php
    $text_content 
"This is a very long text which I want to represent in " .
            
"my tag cloud. Normally this data would come from a database " .
            
"but this is irrelevant for this example. What is important is that " .
            
"the tag cloud data may come from any source you can imagine, like " .
            
"a computed variable, CSV file, database, or even another web page. " .
            
"Just make sure the tags are relevant so your tag cloud is useful." .
            
"Now some russian words человек человек человек человек человек. " .
            
"And some spanish words Niño Niño Niño Niño Niño";
    
$cloud = new PTagCloud(15);
    
$cloud->setUTF8(true);
    
$cloud->addTagsFromText($text_content);
    
$cloud->setWidth("300px");
    echo 
$cloud->emitCloud();
?>        

with this result:


Note: UTF8 mode is not enabled by default and for a reason. Implementation of this feature requires PCRE support in PHP which is not always available. In addition to this we have found the following issues/requirements:

  • Firefox would not display this page correctly unless

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    was present in the PHP response. Makes sense, even though IE8 displayed fine without it.

  • This file had to be saved as UTF-8. Again, makes sense, just one of the things one needs to remember.

  • The code did not work when using Windows with Apache web server and PHP5. This may be a configuration issue but ... still a problem because the default settings could not be used. Probably not a frequently used configuration.

Custom tag cloud visualization support

This section deals with advanced use of our PTagCloud class in situations when you want to perform your own styling instead of using built-in styling capability. In rare situations you will want to use the object we provide only to parse content text and calculate word frequencies. In this case you will not use any styling parameters and call emitCloud() as follows

<?php>
    
$arTopTags $cloud->emitCloud(false);
?>

In this case emitCloud() returns an associative array holding tag frequency grades in the range of 0 through 9 indexed by tag names. Your code needs to provide presentation of this data. The code below shows an example of how you can access the data directly.

<?php
    $cloud 
= new PTagCloud(15);
    
$cloud->addTagsFromText($text_content);
    
$arTopTags $cloud->emitCloud(false);
    echo 
"<ul style=\"list-style-type:none;background:black;padding:5px\">";
    foreach (
$arTopTags as $tag => $grade)
        echo 
"<li style=\"color:Lime\">tag=".$tag." grade=".$grade."</li>";
    echo 
"</ul>";
?>

The result is here

  • tag=csv grade=4
  • tag=variable grade=4
  • tag=useful grade=4
  • tag=tags grade=4
  • tag=make grade=4
  • tag=file grade=4
  • tag=tag grade=9
  • tag=even grade=4
  • tag=cloud grade=9
  • tag=web grade=4
  • tag=data grade=7
  • tag=another grade=4
  • tag=come grade=7
  • tag=database grade=7
  • tag=page grade=4

Final note and our no-nonsense free license to use the software

Congratulations! You have made it to the very end of this article. Please contact us through our Contact Form if you have any ideas how to improve the code described here.

PTagCloud PHP object described in this article is completely free as described in this simple license info

    PTagCloud - free tag cloud generator script class for PHP
    Copyright (C) 2009 Jeannette Global Enterprises LLC.

    Permission is hereby granted, free of charge, to any person
    obtaining a copy of this software and associated documentation files
    (the "Software"), to deal in the Software without restriction,
    including without limitation the rights to use, copy, modify, merge,
    publish, distribute, sublicense, and/or sell copies of the Software,
    and to permit persons to whom the Software is furnished to do so,
    subject to the following conditions:

    The above copyright notice and this permission notice shall be
    included in all copies or substantial portions of the Software.

    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
    EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
    MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
    NONINFRINGEMENT.  IN NO EVENT SHALL THE COPYRIGHT HOLDERS BE LIABLE
    FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
    CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
    WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
    
Share this article!    Bookmark Free tag cloud generator script for your PHP pages at Delicious Digg Free tag cloud generator script for your PHP pages Share Free tag cloud generator script for your PHP pages with your Twitter followers Share Free tag cloud generator script for your PHP pages at StumbleUpon Add Free tag cloud generator script for your PHP pages to your Technorati favorites Share Free tag cloud generator script for your PHP pages on Facebook Share Free tag cloud generator script for your PHP pages on Blinklist Share Free tag cloud generator script for your PHP pages on Diigo Share Free tag cloud generator script for your PHP pages on Reddit Share Free tag cloud generator script for your PHP pages on Linked In Seed the vine with Free tag cloud generator script for your PHP pages Share Free tag cloud generator script for your PHP pages on Mixx Share Free tag cloud generator script for your PHP pages on DZone