⚠️ 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 CTA (Call-to-Action) components provide flexible ways to display links and buttons with tracking capabilities. There are four main component types:
A simple call-to-action link with tracking and styling options.
You can specify whether the link should be wrapped in a span (inline, default) or div (block).
Customize font size, colors, and hover effects using the configuration attribute.
| Attribute | Type | Default | Description |
|---|---|---|---|
id |
string | required | Component identifier (ctaLink) |
cloaked-link |
string | - | The cloaked tracking link slug |
text |
string | - | Custom link text (overrides translation) |
translation |
string | "cta-claim-bonus" |
i18n translation key |
target |
string | "" |
Link target attribute (_blank, _self, etc.) |
rel |
string | "nofollow" |
Link rel attribute |
container |
string | "span" |
Container element (span or div) |
hover-color |
string | "#0E5DB9" |
Link color on hover |
tracking-target |
string | - | Additional tracking target parameter |
tracking-data |
string | - | Custom tracking data |
override-url |
string | - | Override the generated URL |
referer |
string | - | Referer parameter for tracking |
configuration |
JSON | {"fontSize": "inherit", "color": "#0F73E6"} |
Styling configuration object |
Every brand carries an “IP’s excluded” list in Vulcan (Brand details > IP Control). The widget checks that list against the country it resolves for the page: the country attribute when the tag has one, otherwise the visitor’s country. When the country is on the list, the link text stays on the page but there is no link: no href, no redirect, no tracking click. The text is rendered as a plain <span class="cta-link--blocked" aria-disabled="true" data-brand-blocked="true"> in the inherited text color, so it does not look clickable; style it through those hooks if the theme needs a different look. A brand that is switched off in Vulcan (status not active) renders nothing visible, as before.
A geo-targeted call-to-action link that automatically selects brands based on user location, product, and language.
Use ##brand_name## in your text to dynamically insert the brand name.
| Attribute | Type | Default | Description |
|---|---|---|---|
id |
string | required | Component identifier (ctaGeoLink) |
brandposition |
number | 0 |
Brand position in the geo-targeted list (0-indexed internally, use 1 for first) |
product |
string | - | Product type (e.g., “SB” for Sports Betting, “CA” for Casino) |
language |
string | - | Language code (e.g., “fr”, “en”) |
country |
string | - | Country code (e.g., “FR”, “US”) |
country-state |
string | - | State code for US/CA (e.g., “NY”, “ON”) |
selling-point-type |
string | "general" |
Type of selling point to display |
text |
string | - | Custom link text (supports ##brand_name## placeholder) |
translation |
string | "cta-claim-bonus" |
i18n translation key |
target |
string | "" |
Link target attribute |
rel |
string | "nofollow" |
Link rel attribute |
container |
string | "span" |
Container element (span or div) |
hover-color |
string | "#0E5DB9" |
Link color on hover |
tracking-target |
string | - | Additional tracking target parameter |
configuration |
JSON | {"fontSize": "inherit", "color": "#0F73E6"} |
Styling configuration object |
Blocked brands: a brand excluded for the resolved country never enters the geo-targeted list, so brandposition counts only the brands available in that country and the link always points to an available brand.
A styled button component with customizable colors, gradients, and hover effects.
Customize button appearance with gradient colors, hover effects, size, and more.
Control the display of the right arrow icon.
| Attribute | Type | Default | Description |
|---|---|---|---|
id |
string | required | Component identifier (ctaButton) |
cloaked-link |
string | - | The cloaked tracking link slug |
text |
string | - | Custom button text (overrides translation) |
translation |
string | "cta-claim-bonus" |
i18n translation key |
target |
string | "_blank" |
Link target attribute |
rel |
string | "nofollow" |
Link rel attribute |
show-right-arrow |
boolean | true |
Show/hide the right arrow icon |
tracking-target |
string | - | Additional tracking target parameter |
tracking-data |
string | - | Custom tracking data |
override-url |
string | - | Override the generated URL |
referer |
string | - | Referer parameter for tracking |
configuration |
JSON | See below | Styling configuration object |
Configuration Object:
{
"fontSize": "14px",
"buttonColors": ["#05842A", "#05842A"], // [gradient-start, gradient-end]
"buttonHover": "#096725",
"width": "300px"
}
Blocked brands: a button exists to be clicked, so when the brand is excluded for the resolved country (Vulcan “IP’s excluded”) the button is not rendered, exactly like an inactive brand. Only ctaLink keeps its text in that case.
A geo-targeted button that automatically selects brands based on user location, product, and language.
| Attribute | Type | Default | Description |
|---|---|---|---|
id |
string | required | Component identifier (ctaGeoButton) |
brandposition |
number | 0 |
Brand position in the geo-targeted list (0-indexed internally, use 1 for first) |
product |
string | - | Product type (e.g., “SB” for Sports Betting, “CA” for Casino) |
language |
string | - | Language code (e.g., “fr”, “en”) |
country |
string | - | Country code (e.g., “FR”, “US”) |
country-state |
string | - | State code for US/CA (e.g., “NY”, “ON”) |
selling-point-type |
string | "general" |
Type of selling point to display |
text |
string | - | Custom button text (supports ##brand_name## placeholder) |
translation |
string | "cta-claim-bonus" |
i18n translation key |
target |
string | "_blank" |
Link target attribute |
rel |
string | "nofollow" |
Link rel attribute |
show-right-arrow |
boolean | true |
Show/hide the right arrow icon |
tracking-target |
string | - | Additional tracking target parameter |
configuration |
JSON | See ctaButton config | Styling configuration object (same as ctaButton) |
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="ctaButton" cloaked-link="greatwin-casino" >
</nw-blocks>
<!-- Old way (still supported) -->
<bw-widget id="ctaButton" cloaked-link="greatwin-casino">
</bw-widget>
Both tags work identically and support all the same attributes and functionality.
<nw-blocks id="ctaLink" cloaked-link="your-casino" text="Play Now" ></nw-blocks>
<nw-blocks id="ctaGeoButton"
product="CA"
language="en"
text="Join ##brand_name## Today!" >
</nw-blocks>
<nw-blocks id="ctaButton"
cloaked-link="your-casino"
tracking-target="homepage"
tracking-data="promo-2024"
configuration='{"buttonColors": ["#FF6B35", "#F7931E"], "width": "200px"}' >
</nw-blocks>
Check out <nw-blocks id="ctaLink"
cloaked-link="your-casino"
text="this amazing offer"
container="span"
configuration='{"color": "#e74c3c", "fontSize": "inherit"}' ></nw-blocks> today!