Tag Migration Notice: This widget uses the legacy bw-widget tag. For new implementations, please use <nw-blocks> tags instead. The bw-widget tag remains supported for backward compatibility.
The SingleBrandBanner widget displays a horizontal promotional banner featuring a single brand with logo, bonus information, product image, and call-to-action button. Designed for in-content placement with support for multiple product types across gaming, finance, and trading verticals.
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
ctatext="Get Bonus"
product="CA"
language="en"
country="US" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="betway-sports"
product="SB"
language="fr"
country="FR"
ctakey="cta-claim-bonus"
trackinglinktarget="banner-click" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="bingo-brand"
ctatext="Play Bingo"
product="BI"
language="en"
country="UK"
ctacolors='["#ff6b35", "#f7931e"]'
ctahovercolors='["#e85a2a", "#de8419"]' \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="poker-room"
product="PO"
language="de"
country="DE"
ctakey="cta-claim-bonus"
trackinglinktarget="poker-banner"
referer="top-poker-sites" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="crypto-casino"
ctatext="Get Crypto Bonus"
product="CR"
language="en"
country="US"
target="_self"
rel="sponsored" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
ctatext="Get Bonus"
product="CA"
language="fr"
country="ZZ" \>
</nw-blocks>
Use Case: Online casino brands with slots, table games
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
product="SB"
language="fr"
country="ZZ"
ctakey="cta-claim-bonus" \>
</nw-blocks>
Use Case: Sports betting platforms
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
ctatext="Get Bonus"
product="BI"
language="fr"
country="ZZ" \>
</nw-blocks>
Use Case: Bingo sites and networks
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
product="PO"
language="fr"
country="ZZ"
ctakey="cta-claim-bonus" \>
</nw-blocks>
Use Case: Online poker rooms
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
ctatext="Get Bonus"
product="LO"
language="fr"
country="ZZ" \>
</nw-blocks>
Use Case: Online lottery and scratch card sites
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
product="LI"
language="fr"
country="ZZ"
ctakey="cta-claim-bonus" \>
</nw-blocks>
Use Case: Live dealer casino platforms
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
product="ES"
language="fr"
country="ZZ"
ctakey="cta-claim-bonus" \>
</nw-blocks>
Use Case: ESports betting platforms
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
ctatext="Get Bonus"
product="FN"
language="fr"
country="ZZ" \>
</nw-blocks>
Use Case: Financial services and platforms
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
ctatext="Get Bonus"
product="CR"
language="fr"
country="ZZ" \>
</nw-blocks>
Use Case: Cryptocurrency trading platforms
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
product="CF"
language="fr"
country="ZZ"
ctakey="cta-claim-bonus" \>
</nw-blocks>
Use Case: Contracts for Difference trading
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
product="ST"
language="fr"
country="ZZ"
ctakey="cta-claim-bonus" \>
</nw-blocks>
Use Case: Stock and ETF trading platforms
| Attribute | Type | Required | Default | Description |
|---|---|---|---|---|
id |
string | Yes | - | Unique widget identifier |
cloakedlink |
string | Yes | - | Brand identifier for tracking and data lookup |
product |
string | Yes | - | Product code (CA/SB/BI/PO/LO/LI/FN/ES/CR/CF/ST) |
language |
string | No | "en" |
Language code (ISO 639-1) |
country |
string | No | "" |
Country code (ISO 3166-1) |
ctatext |
string | No | - | Override CTA button text (bypasses translation) |
ctakey |
string | No | "cta-claim-bonus" |
Translation key for CTA button text |
trackinglinktarget |
string | No | "" |
Tracking link target path segment |
target |
string | No | "_blank" |
Link target attribute |
rel |
string | No | "nofollow" |
Link relationship attribute |
referer |
string | No | - | Referrer identifier for attribution |
ctacolors |
string/JSON | No | Gold gradient | CTA button color (solid or array for gradient) |
ctahovercolors |
string/JSON | No | Gold gradient hover | CTA button hover color |
<LogoColumn><BonusSection>bonusTextadditionalBonusText<NoBonusCase> component when no bonus datahideBonusText: true<ImageSection>data-new="true"<GoldCTA>ctatext or ctakey translation#CE7114 → #ECB22B → #F5C655 → #D47E1A → #C6740B#CE7114 → #C6740B → #F5C655 → #F5C655 → #C6740B<DisclaimerSection>hasTrackingLink)<VisualSeperator>Normal State:
background: linear-gradient(270deg,
#CE7114 0%,
#ECB22B 22.62%,
#F5C655 52.17%,
#D47E1A 84.37%,
#C6740B 101.9%
);
Hover State:
background: linear-gradient(270deg,
#CE7114 0%,
#C6740B 22.62%,
#F5C655 52.17%,
#F5C655 84.37%,
#C6740B 101.9%
);
Solid Color:
<nw-blocks id="singlebrandbanner"
cloakedlink="casino-brand"
product="CA"
ctacolors="#05842A"
ctahovercolors="#096725" \>
</nw-blocks>
Custom Gradient:
<nw-blocks id="singlebrandbanner"
cloakedlink="casino-brand"
product="CA"
ctacolors='["#667eea", "#764ba2"]'
ctahovercolors='["#5568d3", "#63408b"]' \>
</nw-blocks>
CA - CasinoSB - SportsbookBI - BingoPO - PokerLO - LotteryLI - Live CasinoFN - FinanceES - ESportsCR - Crypto CurrenciesCF - CFD TradingST - Stocks & ETFsWhen an invalid product code is used:
<nw-blocks id="singlebrandbanner"
cloakedlink="greatwin-casino"
product="Casino"
language="fr"
country="ZZ" \>
</nw-blocks>
Result: Error message displayed:
Brand Banner Error: Code check failed for brandName: {brandName}, brandId: {brandId}.
Please make sure that the Product code added is Correct!
When product attribute is empty or missing:
Result: Hidden widget with JavaScript error:
Brand Banner Error: No product defined on the shortcode for brandName: {brandName}, brandId: {brandId}
All clickable elements use the following tracking URL:
/go/{cloakedlink}/{trackinglinktarget}?cta={cta}&wid={id}&trackingData={trackingData}&referer={referer}
Example:
/go/greatwin-casino/banner-click?cta=claim-bonus&wid=singlebrandbanner&trackingData=header&referer=review-page
<nw-blocks id="singlebrandbanner"
cloakedlink="betway-casino"
product="CA"
language="en"
country="US"
ctatext="Claim 100% Bonus"
trackinglinktarget="blog-banner" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="draftkings-sports"
product="SB"
language="en"
country="US"
ctakey="cta-bet-now"
trackinglinktarget="sports-banner"
referer="betting-guide-2024" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="pokerstars"
product="PO"
language="es"
country="ES"
ctatext="Jugar Ahora"
ctacolors='["#ff6b35", "#f7931e"]' \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="crypto-exchange"
product="CR"
language="en"
country="US"
ctatext="Start Trading Crypto"
trackinglinktarget="crypto-banner" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="evolution-casino"
product="LI"
language="en"
country="US"
ctatext="Play Live Casino"
referer="live-casino-reviews" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="esports-betting"
product="ES"
language="en"
country="UK"
ctakey="cta-bet-esports"
ctacolors='["#4a90e2", "#357abd"]'
ctahovercolors='["#357abd", "#2a5f8f"]' \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="trading-platform"
product="ST"
language="de"
country="DE"
ctatext="Jetzt Handeln"
trackinglinktarget="trading-banner"
referer="best-brokers-2024" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="bingo-hall"
product="BI"
language="en"
country="UK"
ctatext="Play Bingo Now"
trackinglinktarget="bingo-banner"
referer="email-campaign-jan" \>
</nw-blocks>
rel="nofollow" for affiliate links<nw-blocks id="singlebrandbanner"
cloakedlink="premium-casino"
product="CA"
language="en"
country="US"
ctatext="Join Premium Club"
ctacolors='["#d4af37", "#ffd700", "#d4af37"]'
ctahovercolors='["#c9a22b", "#f5c655", "#c9a22b"]' \>
</nw-blocks>
<!-- Casino Banner -->
<nw-blocks id="banner-casino"
cloakedlink="casino-brand"
product="CA"
language="en"
country="US"
ctatext="Play Casino" \>
</nw-blocks>
<!-- Sportsbook Banner -->
<nw-blocks id="banner-sports"
cloakedlink="sports-brand"
product="SB"
language="en"
country="US"
ctatext="Bet on Sports" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="tracked-casino"
product="CA"
language="en"
country="US"
ctatext="Claim Bonus"
trackinglinktarget="comparison-table"
referer="best-casinos-2024-article" \>
</nw-blocks>
<nw-blocks id="singlebrandbanner"
cloakedlink="regional-casino"
product="CA"
language="en"
country="US"
ctatext="Play in Your State"
target="_self"
rel="sponsored nofollow" \>
</nw-blocks>
{
brandId: string; // Unique brand identifier
brandName: string; // Brand display name
imgUrl: string; // Logo image URL (204×82px)
trackingLink: string; // Base tracking link
bonusText: string; // Main bonus text
additionalBonusText?: string; // Extra bonus details
productImage: string; // Product-specific image URL (192×96px)
product: string; // Product code (CA/SB/BI/etc.)
isActive: boolean; // Brand availability status
codeCheck: boolean; // Product code validation flag
complianceDisclaimer?: {
disclaimer: string | null; // HTML disclaimer content
};
hasTrackingLink: boolean; // Whether to show T&C link
minimumAge?: string; // Age requirement
widgetCacheKey?: string; // Cache key for debugging
}
| Key | Default Text | Purpose |
|---|---|---|
cta-claim-bonus |
“Claim Bonus” | Default CTA button |
cta-bet-now |
“Bet Now” | Sportsbook CTA |
cta-play-now |
“Play Now” | Generic gaming CTA |
cta-bet-esports |
“Bet on ESports” | ESports CTA |
wgt-toplist-terms |
“Terms&ConditionsLink.com” | T&C link text |
If isActive === false, displays:
<p id="inactive-brand" style="display: none;">
The brand with name {brandName} is currently inactive or not allowed in this country!
</p>
If product is empty or missing:
<div id="{id}" style="display: none;">
<script type="text/javascript">
document.querySelector('#{id}').innerHTML =
'Brand Banner Error: No product defined on the shortcode for brandName: {brandName}, brandId: {brandId}';
</script>
</div>
If codeCheck === false:
<div id="wrong-code" style="display: block;">
Brand Banner Error: Code check failed for brandName: {brandName}, brandId: {brandId}.
Please make sure that the Product code added is Correct!
</div>
<NoBonusCase> componenthideBonusText: true: Bonus section hidden entirely| Feature | SingleBrandBanner | ReviewPageHeader | Hero |
|---|---|---|---|
| Layout | Horizontal banner | Header section | Single-row toplist |
| Product Support | ✅ 11 product types | Casino/Sports only | Casino/Sports only |
| Product Images | ✅ Dynamic product images | No | No |
| Use Case | In-content banners | Review page headers | Homepage hero section |
| CTA Style | Gold gradient | Configurable | Configurable |
| Size | Compact horizontal | Large header | Medium toplist row |
| Rating Display | No | ✅ Star rating | ✅ Star rating |
| Social Proof | No | ✅ Ribbons | ✅ Pills |
| Best For | Blog posts, articles | Dedicated review pages | Homepage/landing pages |
All examples using <bw-widget> remain fully functional:
<bw-widget id="singlebrandbanner"
cloakedlink="greatwin-casino"
product="CA"
ctatext="Get Bonus"
language="fr"
country="ZZ">
</bw-widget>
Migration Path: Replace <bw-widget> with <nw-blocks> - all attributes compatible.
Supports both camelCase and lowercase:
cloakedLink / cloakedlink ✅ctaText / ctatext ✅ctaKey / ctakey ✅trackingLinkTarget / trackinglinktarget ✅ctaColors / ctacolors ✅ctaHoverColors / ctahovercolors ✅