Embed the PetYears calculator
Add our age calculators to your pet blog, veterinary clinic site, or any page. Pick iframe for the simplest setup, or Web Component for more flexible integration.
Options
Customize appearance via URL parameters (iframe) or attributes (Web Component).
Option 1: iframe (simplest)
Copy the snippet below and paste it into your site HTML. Works anywhere.
<iframe src="https://petyears.app/en/e/dog/"
width="100%" height="820" frameborder="0"
title="PetYears calculator" loading="lazy"
allow="clipboard-write"></iframe> Option 2: Web Component
Include our script once, then use the tag like any HTML element. Auto-responsive.
<script src="https://petyears.app/embed.js" defer></script> <petyears-calculator animal="dog" lang="en"></petyears-calculator>
Preview
Reference
Animal
- iframe:
- path segment
- Web Comp:
- animal
- Values:
- dog, cat, rabbit, hamster, guinea-pig, horse
Language
- iframe:
- path segment
- Web Comp:
- lang
- Values:
- en, de, fr, it, es, pt, pl
Primary color
- iframe:
- ?primary=2b2d5b
- Web Comp:
- primary
- Values:
- hex without #
Background color
- iframe:
- ?bg=e8f5ee
- Web Comp:
- bg
- Values:
- hex without #
Accent color
- iframe:
- ?accent=a0d4bc
- Web Comp:
- accent
- Values:
- hex without #
Text color
- iframe:
- ?text=1f1d4a
- Web Comp:
- text
- Values:
- hex without #
Hide share
- iframe:
- ?hideShare=1
- Web Comp:
- hide-share
- Values:
- boolean flag
Host URL (share target)
- iframe:
- ?host=https://yoursite.com/page
- Web Comp:
- auto (top window URL)
- Values:
- http(s) URL — falls back to referrer, then petyears.app
Height (WC only)
- iframe:
- iframe height="820"
- Web Comp:
- height
- Values:
- pixels (default 820)
| Option | iframe (URL param) | Web Component (attr) | Values |
|---|---|---|---|
| Animal | path segment | animal | dog, cat, rabbit, hamster, guinea-pig, horse |
| Language | path segment | lang | en, de, fr, it, es, pt, pl |
| Primary color | ?primary=2b2d5b | primary | hex without # |
| Background color | ?bg=e8f5ee | bg | hex without # |
| Accent color | ?accent=a0d4bc | accent | hex without # |
| Text color | ?text=1f1d4a | text | hex without # |
| Hide share | ?hideShare=1 | hide-share | boolean flag |
| Host URL (share target) | ?host=https://yoursite.com/page | auto (top window URL) | http(s) URL — falls back to referrer, then petyears.app |
| Height (WC only) | iframe height="820" | height | pixels (default 820) |