TCGpedia Labs

Installation and configuration

Installing the plugin is very simple! You just need to add the following script anywhere in your document:

  <script type="text/javascript" src="https://api.tcgpedia.org/tooltip/v1/js?a=ACCESS TOKEN"></script>

You must replace the ACCESS TOKEN with a valid token assigned to you by the TCGpedia staff. To request an access token please fill in the form and we will contact you.

In the form, you will be asked for the following information:

• The URL of the site on which it will be used
• Average hits/day your website receives
• Your email address

How to use the service

Basic use of the plugin

The simplest way to use the plugin is to wrap the card name in the following tag:

  <a href="#" class="tcg-card">Phyrexian Negator</a>

The plugin will scan your page looking for tags like <a href...>, note that the class attribute must include the value tcg-card, the card name must be the text content of the link.

Using the title attribute to specify the card name

If, for some reasons, you want to display the popup on a text different from the card name, you can specif the exact card name in the title attribute as in the following example:

  <a href="#" class="tcg-card" title="Fireball">This is a cool card</a>

Specifying the size of the displayed image

You can choose between three different sizes of the popup image which are small, medium, and large, default is large. To specify it, use the href part of the link as in the following example:

  <ul>
    <li><a href="#small" class="tcg-card">Serra Angel</a> (small)</li>
    <li><a href="#medium" class="tcg-card">Serra Angel</a> (medium)</li>
    <li><a href="#large" class="tcg-card">Serra Angel</a> (large)</li>
  </ul>

Converting deck lists

You can automagically convert a full decklist using the special class tcg-cardlist, it supports the quantity prefixes "Nx" and "N" (where N is any number).

  <div class="tcg-cardlist">
    Generic Label: (10)<br />
    ; comments can be introduced 4 Fireball<br />
    # with various characters 42 Fireball<br />
    // and will never be translated 42 Fireball<br />
    Creatures (10):<br />
    4x Phyrexian Negator<br />
    10 Fireball<br />
    2X Tarmogoyf<br />
    SB: 2 Sta Minchia<br />
  </div>

Additional information and caveats

Double cards, flip cards, etc.

Multi cards are identified by concatenating all the part names with the “//” separator. You can also reference only one part of the card, the tooltip will try to show only the specified part if available, otherwise it will display the whole card or a composite image for double sided cards. Example:

  <a href="#" class="tcg-card">Delver of Secrets // Insectile Aberration</a><br />
  <a href="#" class="tcg-card">Delver of Secrets</a><br />
  <a href="#" class="tcg-card">Insectile Aberration</a><br />
  <a href="#" class="tcg-card">Release</a>
    (from <a href="#" class="tcg-card">Catch // Release</a>)<br />