CTA Components

⚠️ 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.

Overview

The CTA (Call-to-Action) components provide flexible ways to display links and buttons with tracking capabilities. There are four main component types:

  • ctaLink: Renders a simple styled hyperlink
  • ctaGeoLink: Geo-targeted link based on user location and product
  • ctaButton: Renders a styled button with customizable colors
  • ctaGeoButton: Geo-targeted button based on user location and product

A simple call-to-action link with tracking and styling options.

Basic Usage

Expand me...

dcKey 1c1030e2897917520f88156cf1dd9abd

Claim bonus

With Custom Text

Expand me...

dcKey 130c60597fd9e43fb897b0bf321fc669

Override translation

Container Specification

You can specify whether the link should be wrapped in a span (inline, default) or div (block).

Expand me...

dcKey db11ad2cd3948960750ff4314e01d958

Container is div
  it is not inlined with text
Expand me...

dcKey 5ea8fd208c9ef498af08cbeea9d356fc

Container is span by default   it is inlined with text (default is span)

Advanced Configuration

Customize font size, colors, and hover effects using the configuration attribute.

Expand me...

dcKey ba5201ff9ca3c9899637affea0d7a6d1

Claim bonus

Attributes Reference

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

A geo-targeted call-to-action link that automatically selects brands based on user location, product, and language.

Basic Usage

Expand me...

dcKey b9f55a6d47ec871166d6ffaaad0d4bdd

S'inscrire

With Custom Configuration

Expand me...
404: ctaGeoLink, cfRayID a13f4464de9f122e, short: undefined, product: undefined, country: US, language: , currency: undefined

With Brand Name Placeholder

Use ##brand_name## in your text to dynamically insert the brand name.

Expand me...

dcKey 47ba720a0fd49b9fc1cdf731a3540d8e

Ton bonus chez Robocat

With Text Override and Brand Placeholder

Expand me...

dcKey 808ff682237629b7ca7336555c9906ac

Youpi trop bien : DirectionBet Sport !

Attributes Reference

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

ctaButton

A styled button component with customizable colors, gradients, and hover effects.

Basic Usage

Expand me...

dcKey b887448458b5f2e4a54cf091453ce241

With Custom Text

Expand me...

dcKey 9cfa1041b034c7b5f3910c851629d9d4

With Advanced Configuration

Customize button appearance with gradient colors, hover effects, size, and more.

Expand me...

dcKey a9f3820ac417054f77d11e4b539d1a56

With Right Arrow Icon

Control the display of the right arrow icon.

Expand me...

dcKey 8f99b408e201de3d44efcd93a721b8b9

Attributes Reference

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"
}

ctaGeoButton

A geo-targeted button that automatically selects brands based on user location, product, and language.

Basic Usage

Expand me...

dcKey b1f18bd3428b106e90e4073c6cd66c35

With Brand Name in Text

Expand me...

dcKey 535d888754a737d6894ba349715e4e46

With Custom Text and Brand Placeholder

Expand me...

dcKey 9e0358ee2df3f14c6ece96481c4d0311

Attributes Reference

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)

Backward Compatibility

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.

Common Use Cases

<nw-blocks id="ctaLink" cloaked-link="your-casino" text="Play Now"></nw-blocks>

2. Geo-Targeted Button for Multiple Markets

<nw-blocks id="ctaGeoButton" 
    product="CA" 
    language="en" 
    text="Join ##brand_name## Today!">
</nw-blocks>

3. Custom Styled Button with Tracking

<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!