SwAdFloating

Ad Placement Four Essentials
Use case: fixed floating slots on the page left / right, auto-hidden on narrow screens (slotKey e.g. floating_right)
Industry form: Floating / Anchor ads (a framework-specific extension; AdSDK has no matching format, ad_type uses the extension value floating)
Visual form: vertical stack of images (items renders all entries; businesses typically configure up to ~6, each about 60×60), hidden when the window width ≤ hiddenWidth
Tracking events: adImpression (reported once for the whole group when visible) / adClick (per item); silent no-op when the tracker gate is off
Picking the wrong scenario = wrong ad_type / timing in tracking. See Ad Component Selection.

SwAdFloating is the side floating ad slot component — a "popup / floating-type" self-rendering component of the ad foundation. It sticks to the left / right viewport edge, renders all items as a vertical stack (as many as the data provides), and shows only when the window width ≥ hiddenWidth (auto-hidden on narrow screens, never crowding content). Impression / click tracking is built in.

加载中...

Props

Name	Type	Required	Default	Description
`items`	`SwAdItem[]`	✓	—	Ad creative array
`slotKey`	`string`	✓	—	Ad slot key → `ad_slot_key`
`slotName`	`string`		`undefined`	Ad slot name → `ad_slot_name`
`pageKey`	`string`		`undefined`	Page key → `page_key`
`pageName`	`string`		`undefined`	Page name → `page_name`
`position`	`'left' \| 'right'`		`'right'`	Which edge to stick to
`hiddenWidth`	`number`		`1500`	Hide when window width is below this value (px)
`ratio`	`string`		`'1/1'`	Creative aspect ratio
`radius`	`number \| string`		`8`	Corner radius (number = px, string passed to SwImage as-is, e.g. `'1.125rem'`)
`showAdLabel`	`boolean`		`undefined`	"Ad" compliance badge (inline variant, one per group, centered at the bottom); when not set it follows the global `swiftConfig.ad.showLabel` (default `true`), an explicit value always wins

CSS Variables

Variable	Default	Description
`--sw-ad-floating-width`	`3.75rem` (60px)	Per-image width (height follows `ratio`)
`--sw-ad-floating-gap`	`0.5rem`	Vertical gap between images

Events

Name	Payload	Description
`load`	—	Rendered
`empty`	—	`items` empty
`impression`	`items: SwAdItem[]`	Impression (auto tracking)
`click`	`item: SwAdItem`	Click (auto tracking)
`error`	—	Render / load error

<!-- items render as a vertical stack (count controlled by data, typically ≤6), each 60×60 by default -->
<SwAdFloating :items="sideAds" slot-key="global_side" position="right" :hidden-width="1280" show-ad-label />

<!-- Larger per-image size -->
<SwAdFloating :items="sideAds" slot-key="global_side" style="--sw-ad-floating-width: 5rem" />

Caveats

Auto-hidden on narrow screens — not rendered when the window is below hiddenWidth, avoiding occluding mobile / narrow-viewport content.
Usually mounted once in the global layout, fixed in place; tracking is built in and gated.