The Atlas card
A small, free care card for any fish in the atlas. Shops can drop it into a product listing, clubs into a species-of-the-month post, and breeders onto a stock page. It shows the species’ size, temperature, pH and hardness, IUCN Red List and CARES status, and it keeps itself current: when the atlas corrects a figure or a name, every card picks up the change.
What it looks like
These are live cards, built by the same script your page would load:
Get the snippet
Every species page has an Add this species card to your site box near the bottom with the snippet ready to copy. It looks like this one for the frontosa:
<div data-atlas="species/cyphotilapia-frontosa"><a href="https://www.aquaristatlas.com/species/cyphotilapia-frontosa/">Frontosa (Cyphotilapia frontosa) on Aquarist Atlas</a></div>
<script src="https://www.aquaristatlas.com/embed/v1/card.js" async referrerpolicy="no-referrer"></script>The general shape: SLUG is the last part of the species page’s address (for https://www.aquaristatlas.com/plecos/hypancistrus-zebra/ it is hypancistrus-zebra), and the link points at that page.
<div data-atlas="species/SLUG"><a href="https://www.aquaristatlas.com/PAGE-PATH/">Common name (Scientific name) on Aquarist Atlas</a></div>
<script src="https://www.aquaristatlas.com/embed/v1/card.js" async referrerpolicy="no-referrer"></script>Several cards on one page are fine. The script tag can appear once or with every card; it only runs once.
What we ask: keep the link
The card is free, with no key and no sign-up, and every site gets it on the same terms. The one thing we ask is attribution: keep the link inside the div, pointing at the species page. It is also what visitors see if scripts are blocked or the atlas can’t be reached, so the snippet never leaves a blank space on your page. Please don’t edit the figures the card shows. If you need different numbers, write them in your own words beside it.
The snippet ships as a plain link. Whether your site marks outbound links is your call: if you add rel="nofollow" (or ugc or sponsored) to it, the card’s own links carry the same attribute. The card belongs on the page for the species it describes, not in a site-wide header, footer or template.
Options
- data-units="metric" or data-units="imperial" on the div shows one system only. By default the card shows both, metric first: 24–27 °C (75–81 °F).
- data-theme="light" or data-theme="dark" fixes the colours. By default the card follows the visitor’s light or dark setting.
- Adding cards after the page has loaded (quick-view pop-ups, infinite scroll)? Call window.AquaristAtlasCards.scan() once the new snippet is in the page.
The card is drawn inside its own shadow DOM, so your site’s styles won’t change it and it won’t change your site.
What the card shows, and what it leaves out
Each card reads that species’ record from the atlas’s public facts API. A row appears only when the atlas has a sourced value for it. Where a figure is unknown, the row is left out rather than filled with a guess. Temperature, pH and hardness are the ranges the species is kept in; hardness is general hardness (GH) in °dH, with ppm CaCO₃ alongside (1 °dH = 17.85 ppm). The IUCN line appears only for a published Red List category, and the CARES line only for species on the CARES conservation-priority list. Names are checked against the Catalog of Fishes, and every figure is cited on the full species page the card links to.
Privacy
The script talks only to www.aquaristatlas.com. It sets no cookies, stores nothing in the visitor’s browser, loads no third-party code and sends no analytics. The snippet loads the script and its data without a referrer, so the address of the page a card sits on is never sent. (Browsers do name the embedding site’s domain on any cross-site data request; the atlas doesn’t collect or analyse it.) If your site sends a Content-Security-Policy, allow https://www.aquaristatlas.com in script-src and connect-src. More in the privacy notice.
Matching a whole catalogue
For a shop with hundreds of listings, the name index at /api/v1/names.json has one row per scientific name, common name and synonym: n is the scientific name, c a common name, and h the page path, whose last segment is the card’s SLUG. Skip rows whose s is Genera, since those are genus pages and have no card. Match on the scientific name in your stock list wherever you can. Trade names are ambiguous (several different fish are sold as a “jewel cichlid”), and the card can only be as right as the name you match it to.
Stability
A snippet pasted today keeps working. The /embed/v1/ script and its data-atlas, data-units and data-theme attributes won’t change in ways that break a pasted card. Anything incompatible would ship as a separate /embed/v2/. Questions, or a card showing something wrong? Email contact@aquaristatlas.com.