⚠️ Important Notice: We are transitioning from
<bw-widget>to<nw-blocks>tags. While<bw-widget>is still supported for backward compatibility, all new implementations should use<nw-blocks>. Please update your existing widgets when possible.
The Brand Bonus Widget displays a comprehensive brand card featuring the brand logo, bonus information, and a customizable call-to-action button. This widget is ideal for showcasing casino or sports betting promotions with bonus details and compliance information.
Key Features:
| Attribute | Type | Default | Description |
|---|---|---|---|
id |
string | required | Component identifier (brandbonus) |
cloakedlink |
string | "" |
The cloaked tracking link slug for the brand |
language |
string | "en" |
Language code (e.g., “fr”, “en”, “es”) |
country |
string | "ZZ" |
Country code (e.g., “FR”, “US”, “DE”, “ZZ” for generic) |
countryState |
string | - | State code for US/CA (e.g., “NY”, “ON”) |
ctakey |
string | "wgt-reviewpage-cta-getbonus" |
i18n translation key for button text |
ctatext |
string | "" |
Custom button text (overrides ctakey translation) |
target |
string | "_blank" |
Link target attribute |
rel |
string | "nofollow" |
Link rel attribute |
trackinglinktarget |
string | "" |
Additional tracking target parameter |
referer |
string | - | Referer parameter for tracking |
ctacolors |
string/array | "#05842A" |
Button gradient colors (single color or array: ['start', 'end']) |
ctahovercolors |
string/array | "#096725" |
Button hover gradient colors (single color or array) |
The Brand Bonus Widget is structured with three main sections:
The widget supports flexible color configuration for the CTA button:
ctacolors="#05842A"
ctahovercolors="#096725"
ctacolors="['#05842A', '#04691E']"
ctahovercolors="['#096725', '#065520']"
The button will create a gradient from the first color to the second color.
The widget can be configured to span the full width of its container (controlled via backend configuration).
Automatically displays compliance disclaimers when configured for specific brands, products, countries, and languages.
When social proof data is available, a ribbon displays ratings or vote counts.
When bonus information is hidden or unavailable, the widget adapts its layout accordingly.
The widget includes comprehensive tracking capabilities:
wid)Generated URL Format:
https://{websiteId}/go/{cloakedLink}/{trackingTarget}?wid={id}&trackingData={data}&referer={referer}
All examples above use the new <nw-blocks> tag. If you need to use the legacy <bw-widget> tag for backward compatibility, simply replace <nw-blocks> with <bw-widget> in any example:
<!-- New way (recommended) -->
<nw-blocks id="brandbonus" cloakedlink="greatwin-casino" language="en">
</nw-blocks>
<!-- Old way (still supported) -->
<bw-widget id="brandbonus" cloakedlink="greatwin-casino" language="en">
</bw-widget>
Both tags work identically and support all the same attributes and functionality.
<nw-blocks id="brandbonus"
cloakedlink="your-casino"
language="en"
country="US"
ctakey="cta-claim-bonus"
ctacolors="['#05842A', '#04691E']">
</nw-blocks>
<nw-blocks id="brandbonus"
cloakedlink="your-sportsbook"
language="en"
country="UK"
ctatext="Bet Now"
trackinglinktarget="homepage"
ctacolors="['#1E90FF', '#0066CC']">
</nw-blocks>
<nw-blocks id="brandbonus"
cloakedlink="french-casino"
language="fr"
country="FR"
ctakey="cta-claim-bonus"
trackinglinktarget="welcome-bonus">
</nw-blocks>
<nw-blocks id="brandbonus"
cloakedlink="your-casino"
language="en"
country="CA"
ctatext="Join Now"
ctacolors="['#FF6B35', '#F7931E']"
ctahovercolors="['#E85A2B', '#E07A0A']"
referer="campaign-2024">
</nw-blocks>
The widget includes several CSS classes for customization:
.umbrella-widget: Main widget container.no-disclaimer: Applied when no compliance disclaimer is present.is-fw: Applied for full-width layouts.has-label-rated: Applied when social proof ribbon is present.no-bonuses: Applied when bonus information is hiddenThese classes can be targeted with custom CSS for additional styling.