Tooltips  

Contents [hide]

Tooltips

It is now possible to provide mouseovers (tooltips) for items on ZAM's sites for:

To do so, simply add the following html to your site:

<script type="text/javascript" src="http://zam.zamimg.com/j/tooltips.js"></script>

The best placement for this is right before the </body> tag. Anywhere inside <body></body> will work, though.

Check the installation instructions if you want a detailed walkthrough.

Who would use this?

Fansites and guild/linkshell/kinship sites and forums as well as other sites who provide news for the games that the tooltips support but don't have a database. It isn't limited to that, though. Anyone is welcome to link to our items and have have our tooltips displayed as a mouseover.

Examples

Check out How to use for an in-depth walkthrough.

How it Works

By adding the script tag above, each page with the tag added will check the HTML in the page it is displaying. When it detects a link to a ZAM item that we display mouseovers for, your site will automatically display them.

Installation Instructions

Not all possible ways are documented here but the list will grow over time, if you wish to add installation instructions for a website platform, add the instructions to the Feedback Forum.

Mediawiki

Confirmed it can work in Mediawiki 1.15 & 1.16 but you'll need access to the raw files.
  • Works in Firefox and Chrome Browsers.
  1. Open up the file manager / FTP client you prefer using.
  2. Open the "Skins" folder.
  3. Open in Code Edit/a html editor the file with the name of your skin "Vector.php / Monobook.php e.t.c" thats housed in the "Skins" folder.
  4. Find the line with "</body>" ''Aprox Line 500 - 600 depending on your previous customisations.
  5. Add before this line <script type="text/javascript" src="http://zam.zamimg.com/j/tooltips.js"></script>
  6. Save changes onto your website.
  7. You now have ZAM Tooltips enabled.

Joomla 1.5

Confirmed
  • Works in Firefox and Chrome Browsers.
  1. Login to Administrator Section
  2. Go to Extension > Module Manager
  3. Click "New"
  4. Click "Custom HTML" then "Next"
  5. Fill out these Fields
    1. Title: ZAM Tooltip
    2. Show Title: Click No
    3. Posistion: Footer
    4. Order: 2:: Footer
    5. Custom Output: Click the little icon "html" that opens a new window to edit html source
    6. Custom Output: add <script type="text/javascript" src="http://zam.zamimg.com/j/tooltips.js"></script>
    7. Click Save
  6. You now have ZAM Tooltips enabled.

Wordpress

Confirmed for Version 3.0.1 (instructions are in default view and may be graphically slightly different in a custom theme.
  • Works in Firefox and Chrome Browsers.
  1. Login and Access Admin Panel
  2. Click "Appearance" then "Editor" in sidebar
  3. Click on "Footer.php" on the right side
  4. In The text edit box find "</body>"
  5. Before this line make a new line with <script type="text/javascript" src="http://zam.zamimg.com/j/tooltips.js"></script>
  6. Click "Update File"
  7. You should now have ZAM tooltips functioning after you clear your cache.

Drupal

Confirmed for Version 6.19
  • Works in Firefox and Chrome Browsers.
  1. Admin Login
  2. Click Administer > Site Site Building > Blocks
  3. Click "Add Block" and:
    1. Block description: ZAM Tooltip
    2. Block body: add <script type="text/javascript" src="http://zam.zamimg.com/j/tooltips.js"></script> to the text area.
    3. Click "Input format" and click the button for "Full HTML"
    4. Click "Users cannot control whether or not they see this block."
    5. Click Save Block
  4. Now move your ZAM Tooltip block to under the Footer Heading and make sure the drop down menu says "Footer"
  5. Click "Save Blocks"
  6. You should now have ZAM tooltips functioning on all pages after you clear your cache.

phpBB

Confirmed 3.0.7
  • Works in Firefox and Chrome Browsers.
  1. Open up the files via FTP
  2. go to "styles/themename/template/overall_footer.html
  3. find the line with </body> should be one of the last lines of code.
  4. before this line add <script type="text/javascript" src="http://zam.zamimg.com/j/tooltips.js"></script>
  5. Save file
  6. You should now have ZAM tooltips functioning on all pages after you clear your cache.

Static Website

On the .html page you wish to have the ZAM tooltips
  • Works in Firefox and Chrome Browsers.
  1. Find </body>
  2. Before this line, in its own line add <script type="text/javascript" src="http://zam.zamimg.com/j/tooltips.js"></script>
  3. You now have ZAM tooltips enabled for this html page
You must do this to every static html page you wish to have ZAM tooltips on

How to Use

Below will be how you can create links that work with the tooltip system, feel free to copy the text below and use it on your site as a guide for your users to use as a reference.

Mediawiki

Raw Link Code: [http://war.allakhazam.com/db/item.html?waritem=402307 Purloined Gown]
Creates: Purloined Gown

Joomla 1.5

  1. Open the article in edit view
  2. select or create the text you want the tooltip link to be.
  3. Click the Url link button.
  4. Add into the "Link URL" text box the full url, in this case it is: http://war.allakhazam.com/db/item.html?waritem=402307
  5. Save the article.
You should now have a functioning ZAM Tooltip when you hover over the link.

Joomla Forums

Raw Link Code: [url=http://war.allakhazam.com/db/item.html?waritem=402307]Purloined Gown[/url]
Creates: Purloined Gown

Wordpress

You can use the Raw HTML code below, but make sure raw html option is chosen.

vBulletin

Raw Link Code: [URL="http://war.allakhazam.com/db/item.html?waritem=402307"]Purloined Gown[/URL]
Creates: Purloined Gown

Drupal

You can use the Raw HTML code below, but make sure raw html option is chosen.

phpBB

phpBB 2.0 & 3.0
Raw Link Code: [url=http://war.allakhazam.com/db/item.html?waritem=402307]Purloined Gown[/url]
Creates: Purloined Gown
  • You can use the Raw HTML format if you can "untick" the option called "Disable HTML in this Post"

Raw HTML

Applicable to all web platforms have have raw html enabled.
Raw Link Code: <a href="http://war.allakhazam.com/db/item.html?waritem=402307" title="">Purloined Gown</a>
Creates: Purloined Gown

Feedback and Comments

Please direct any feedback or comments to the thread in our Feedback Forum

ZAM Network
Wikibase™
Guides

Categories: Guides (ZAM) | ZAM Network
This page last modified 2020-12-22 00:49:18.
© 2024 Fanbyte LLC