Ad Data Source

overview the ad data source loads ad slot definitions from ads json and makes them available as list items unlike the ad insertion property (which interleaves ads into another data source's results), this data source is used when a component is dedicated entirely to rendering ad slots — for example, a list of banner ads or a swiper of ad creatives when to use this use ad when a component's sole purpose is to display ads from ads json for inserting ads between content items in a mixed list, use the ad insertion property on the content data source instead for more details on ad insertion between content items, see todo insert link to ad insertion documentation basic example { "type" "ad", "contextkey" "banners", "idpattern" "sidebar banner" } this loads all ad slot definitions from ads json whose id matches the pattern sidebar banner , and exposes them as $context banners a child component renders the ad creative using the slot's configuration live example view /examples/datasources/ad configuration type specific properties property type default description idpattern string — optional regex pattern to filter ad slots by their id field only ads whose id matches the pattern are returned if omitted, all ads are returned common configuration (inherited) all common data source properties apply — contextkey , limit , etc for more details, see todo insert link to data sources overview advanced features filtering by pattern use idpattern to restrict which ad slots are loaded the value is a javascript regex pattern tested against each ad slot's id { "type" "ad", "contextkey" "banners", "idpattern" "^sidebar " } this loads all ad slots whose id starts with sidebar (e g , sidebar banner , sidebar promo ) per slot conditions each ad slot defined in ads json can carry an optional condition field the data source evaluates these conditions against the current view context at load time and on every context update slots whose condition evaluates to false are excluded from the result automatically — no page reload required conditional ad loading the ad data source supports a condition value to enable or disable ad loading at runtime — for example, to suppress ads for subscribed users { "type" "ad", "contextkey" "promoad", "idpattern" "promo banner", "condition" { "value" "$context user issubscriber", "operation" "equals", "comparevalue" "false" } } for more details on conditions, see todo insert link to conditions testing notes / edge cases idpattern is a regex the value is compiled with new regexp(idpattern) and tested against each ad slot's id an invalid regex logs a warning and falls back to returning all ad slots unfiltered no idpattern returns all slots if idpattern is omitted, the data source returns all ad slots defined in ads json (subject to limit and element level conditions) ad vs ad insertion this data source is for ad only components do not confuse it with the ad property on other data sources, which inserts ads between content items using both on the same component leads to duplicate ad slots condition based suppression when a data source level condition evaluates to false, the data source returns an empty list ensure the parent component handles the empty state without breaking the layout context reactive filtering the data source re evaluates element level conditions whenever the view context changes if the filtered result differs, the component updates automatically no ssr data the ad data source does not restore data from ssr — it always fetches from the store on the client related topics todo insert link to data sources overview todo insert link to ad insertion todo insert link to conditions