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 a8150b87140b3c38a3a9ec3c7bd9096d

Claim bonus

With Custom Text

Expand me...

dcKey e0fe7977100409477f62a8c9d400d2f7

Override translation

Container Specification

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

Expand me...

dcKey 83bb5b292a63a3c0f6934abc77aa2bd3

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

dcKey 2ddd2908e1930f3c3485550c7c6af190

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 1a8f705ffd925de3412ebba9bb40b6d8

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 930a4ae6b10ae6993aa0dc43d875479a

S'inscrire

With Custom Configuration

Expand me...
404: ctaGeoLink, cfRayID 9fedcfa47a51f8bb, 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 6ed36c3c7e6608f992b5593bf7ca267b

Ton bonus chez Betclic Sport

With Text Override and Brand Placeholder

Expand me...

dcKey 0a67e1947f456549376b6bb3d1359474

Youpi trop bien : KTO 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 e97e4616753620f6aed43049d37187b2

With Custom Text

Expand me...

dcKey 81b03164ea938e9d597dd5db5abdd159

With Advanced Configuration

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

Expand me...

dcKey 7ecd1e7171f73ce6b0495d5541d3bfee

With Right Arrow Icon

Control the display of the right arrow icon.

Expand me...

dcKey 08f32436147e00339d6f01d0741e3e7a

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 547d9298535c894d7ef6cf79ef4c1df2

With Brand Name in Text

Expand me...

dcKey c932e1098be6668345e987cf25e8db1e

With Custom Text and Brand Placeholder

Expand me...

dcKey bc22ebf62ec32d02187f69297fa6276d

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!