nuxt-x-marketing
AffiliateDisclosure
FTC-compliant affiliate disclosure in subtle, banner, or inline variants with dismiss support.
AffiliateDisclosure
An FTC-compliant affiliate disclosure in three display modes. Persists dismiss state in-component (does not use localStorage by default). Use subtle for per-section disclosures, banner for a full-width site-level notice, and inline for inline text.
Components
<XMarkAffiliateDisclosure />
An FTC-compliant affiliate disclosure in three display modes. Persists dismiss state in-component (does not use localStorage by default). Use subtle for per-section disclosures, banner for a full-width site-level notice, and inline for inline text.
<!-- Subtle box (most common — used by ProductGrid and ComparisonTable) -->
<XMarkAffiliateDisclosure
text="This page contains affiliate links. As an Amazon Associate, we earn from qualifying purchases at no extra cost to you."
variant="subtle"
:dismissible="true"
/>
<!-- Full-width banner -->
<XMarkAffiliateDisclosure
text="Some links on this site are affiliate links."
variant="banner"
/>
<!-- Inline sentence -->
<p>
We recommend the Sony XM5
<XMarkAffiliateDisclosure
text="(affiliate link)"
variant="inline"
:dismissible="false"
/>
for most users.
</p>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
text | String | Default Amazon associate disclosure | Disclosure message text |
variant | String | 'subtle' | Display style: 'subtle', 'banner', 'inline' |
icon | String | 'i-lucide-info' | Icon shown alongside the text |
dismissible | Boolean | true | Show dismiss button |
AI Context
category: Affiliate
package: "@xenterprises/nuxt-x-marketing"
components:
- XMarkAffiliateDisclosure
use-when: >
Adding FTC-compliant affiliate disclosures to any page or section containing
affiliate links. Integrated automatically into XMarkAffiliateProductGrid,
XMarkAffiliateComparisonTable, and XMarkAffiliateProductDetail via the
disclosure prop.
typical-page-section: Top of any page or section containing affiliate links.