01 · stamp
Stamp
The main variant. The date of the last passed check sits in the centre, the name runs around the edge, and the domain the seal is valid for hangs below. If the shop no longer passes, the rosette becomes an empty circle.
Choose how the seal looks in your shop and add it with one line of code. Seven variants, four ways to embed. The previews use sample data with a made-up domain. The configurator in the merchant area generates the finished code for your seal.
Each preview appears in light and dark on a matching background. With the value auto the seal follows the visitor’s colour setting. Corners can be round or square.
01 · stamp
The main variant. The date of the last passed check sits in the centre, the name runs around the edge, and the domain the seal is valid for hangs below. If the shop no longer passes, the rosette becomes an empty circle.
02 · badge
Compact display for the footer, checkout or sidebar. Size s shows the state with the check date and the domain, m adds the brand, l also states since when and how often the shop has been checked.
03 · float
A button with the mark and the state, fixed to the window edge. A click opens a card with the check data. It closes with Escape, a click outside or the close button, after which only the mark stays for the rest of the session. The distance from the bottom can be raised, for example above a cookie banner.
The preview is interactive: clicking the button opens the card, Escape closes it.
04 · bar
One line across the full width for the header or footer with state, domain, note, check count, brand and a link to the certificate. It wraps on narrow screens.
05 · card
For the checkout and product pages. It shows the domain, the company name of a verified business, the check data, up to five criteria passed in the last check, and links to the certificate and the criteria.
06 · mark
Only the mark, for tight spaces. State and domain are available as a label for screen readers and appear as a tooltip on hover and keyboard focus.
07 · text
A line with a small mark that takes over the font and colour of its surroundings. It fits into body text, footnotes and notes at the checkout.
Orders at beispiel-shop.example:
Orders at beispiel-shop.example:
In the examples YOUR-ID stands for the identifier of your seal. The configurator in the merchant area fills it in and assembles variant, size, colour and language for you.
One line at the place where the seal should appear, or before the closing body tag for the corner seal. Without attributes the linked badge appears as an image. With data-variant the script draws the element.
<script src="https://fakeshop.ai/siegel/YOUR-ID/embed.js" async
data-variant="float"
data-theme="auto"
data-lang="en"
data-position="bottom-right"></script>With data-target the seal appears inside an existing element:
<div id="siegel"></div>
<script src="https://fakeshop.ai/siegel/YOUR-ID/embed.js" async
data-variant="card"
data-theme="light"
data-lang="en"
data-target="#siegel"></script>The same settings can be passed in the address, for environments that strip data attributes from the script:
<script src="https://fakeshop.ai/siegel/YOUR-ID/embed.js?variant=float&theme=auto&lang=en&position=bottom-right" async></script>The loader appears once per page, the element as often as needed. This lets you mix variants, for example a trust box at the checkout and a mark in the footer.
<script src="https://fakeshop.ai/siegel/widget.js" async></script>
<fakeshop-seal
seal="YOUR-ID"
variant="card"
theme="auto"
lang="en"></fakeshop-seal>
<fakeshop-seal
seal="YOUR-ID"
variant="mark"
theme="auto"
size="s"
lang="en"></fakeshop-seal>To reserve the space before the loader has loaded, add:
<style>fakeshop-seal:not(:defined){display:block;min-height:470px}</style>The badge as an SVG with a link to the certificate page. Parameters: size (s, m, l), theme (light, dark), lang (de, en) and shape (square, mark). referrerpolicy="origin" is required so that the browser sends the origin of the shop. Without it a strict referrer policy makes the image show "Verify status with a click".
<a href="https://fakeshop.ai/en/seal/YOUR-ID" target="_blank" rel="nofollow noopener" referrerpolicy="origin">
<img src="https://fakeshop.ai/siegel/YOUR-ID/badge.svg?size=m&theme=light&lang=en" alt="Fakeshop AI: Daily check passed. Automated assessment, partly generated with AI. No guarantee, not legal advice."
height="68" referrerpolicy="origin" loading="lazy">
</a>For site builders that do not allow scripts. The document works without JavaScript. Suggested sizes: badge 340 × 80, bar 100% × 50 (narrow 110), trust box 340 × 480, mark 50 × 50, text line 100% × 28. The corner seal is not available in an iframe.
<iframe src="https://fakeshop.ai/siegel/YOUR-ID/frame?variant=card&theme=light&lang=en"
width="340" height="480" style="border:0" loading="lazy"
referrerpolicy="origin" title="Shop seal by Fakeshop AI"></iframe>The same names apply to the element (without prefix) and to the script (with the prefix data-). Without theme, size and lang the setting from the merchant area applies.
| Name | Values | Effect |
|---|---|---|
variant | stamp | badge | float | bar | card | mark | text | Variant |
theme | light | dark | auto | Light, dark or following the visitor’s setting |
size | s | m | l | Size of badge and mark |
lang | de | en | Language of the texts, also selects the certificate page |
radius | round | sharp | Corners, default round |
position | bottom-right | bottom-left | Corner of the corner seal |
offset | 0 to 400 | Offset of the corner seal upwards, in pixels |
target | e.g. #seal | Script only: CSS selector of an existing element |
Platforms change their interfaces. The notes therefore describe the route only.
The script of the corner seal goes into theme.liquid before </body>. For any other variant, place the element and the loader in a “Custom Liquid” section where you want it.
Use the “Custom HTML” block or widget in the footer. Output the script of the corner seal through the wp_footer hook.
In the Shopping Experiences, add the “HTML” element containing the element and the loader. Alternatively, put the script into the footer template of the theme.
Create a custom box with HTML content in the footer and paste the code there.
Use the embed or code block. If the block places the content in a frame of its own, use the iframe route: a script would see the origin of the frame instead of the shop domain.
A tag of type “Custom HTML”, useful only for the corner seal. Set the options through the address. This also works when an environment does not keep data attributes on the script.
<script src="https://fakeshop.ai/siegel/YOUR-ID/embed.js?variant=float&theme=auto&lang=en&position=bottom-right" async></script>What the code does in your visitors’ browsers, in the order shop operators usually ask about it.
The loader sets no cookies and does not use localStorage. The corner seal only remembers in sessionStorage that it was collapsed. There are no counters and no third-party services.
The seal only requests addresses on fakeshop.ai, without credentials and with the referrer policy origin. Our server therefore learns the domain of the page without the path. As with any request, the visitor’s IP address reaches our server. Details are in the privacy policy.
Whether the seal appears as valid, suspended or not applicable to the page is decided by our server from the origin of the request. No attribute and no parameter sets a state. The element only draws the finished texts of the response.
A seal is valid for the domain it was issued for and its www variant. On any other site the same embed shows that the seal does not apply to that site.
The element draws inside a shadow DOM. Styles of your shop do not reach in, ours do not reach out. The text line is the exception because it takes over the font and colour of its surroundings. Styles are applied through adoptedStyleSheets, so a strict style-src policy does not strip the seal.
Uncompressed the loader is below 12 kB and about 5 kB with gzip, including the stylesheet and without dependencies. It is cached for one day. The space for the seal is reserved before the data arrives.
Script and element need JavaScript. Where it is missing, the spot stays empty. The image and the iframe work without JavaScript.
If our server cannot be reached or your shop’s policy blocks the request, the element shows “Status unavailable” with a link to the certificate page. It never shows a valid seal in that case.
Shops with a policy of their own allow fakeshop.ai in script-src and connect-src, in frame-src for the iframe and in img-src for the image.
Every link in the seal opens in a new tab and carries rel="nofollow noopener" and referrerpolicy="origin".