Displaying Graphic Counters with Custom Fonts

Example

Displaying holiday counter graphics on your home page.

MGI Tags

  • mgiCounter

Steps

  1. Create counter graphics.
  2. Open your home page in a text editor.
  3. Insert the mgiCounter tag, name parameter and fontFolderLocation parameter.
  4. Save your home page.
  5. FTP the counter graphics and home page to the web server running MGI.
  6. View your home page in a web browser.

Step 1: Create counter graphics.

Create a counter graphic for the numbers 0 through 9. Save each graphic in GIF format and name the graphics as follows:
  • zero.gif
  • one.gif
  • two.gif
  • three.gif
  • four.gif
  • five.gif
  • six.gif
  • seven.gif
  • eight.gif
  • nine.gif

Step 2: Open your home page in a text editor.

Open your home page in a text editing program that allows you to view and modify the HTML of your page.

Step 3: Insert the mgiCounter tag, name parameter and fontFolderLocation parameter.

Insert your cursor in the HTML of your home page where you want the mgiCounter tag to display. Enter the mgiCounter tag, name parameter and fontFolderLocation parameter. In the name parameter, enter a unique counter name. Counter names are case-sensitive. In the fontFolderLocation parameter, enter the folder name that contains the counter images. 
<mgiCounter name="index" fontFolderLocation="Graphics/Clover/">

Step 4: Save your home page.

Save the changes you have made to your home page.

Step 5: FTP the counter graphics and home page to the web server running MGI.

Using an FTP program, upload the 10 counter graphics to the "Clover" folder within the "Graphics" folder and upload your home page from your local computer to the web server.

Step 6: View your home page in a web browser.

View your home page in a web browser. The counter value is displayed using your custom graphics.

[Return to the Displaying Page Counters Menu]

[User Guide Main Menu] [Understanding MGI Menu] [Using MGI Menu] [Referencing MGI Menu]