OddsGuard Widgets
Customize and embed live odds on any website with one line of code. Choose a preset theme or create your own.
Choose a Theme
Widget Layout
Desktop layout with sidebar and full odds table
Live Preview
Loading...
Embed Code
<iframe src="https://oddsguard.com/embed/widget?theme=light&size=full&sport=basketball&league=basketball_nba" width="100%" height="500" frameborder="0" title="OddsGuard Widget"> </iframe>
<script src="https://oddsguard.com/widget-embed.js"></script> <div class="oddsguard-widget" data-theme="light" data-size="full" data-sport="basketball" data-league="basketball_nba" data-height="500px" data-width="100%"> </div>
Embedding Guide
iFrame Embedding
The easiest way to embed our widget is using an iframe:
<iframe src="https://oddsguard.com/embed/widget?theme=light&size=medium&sport=basketball&league=basketball_nba&affiliateId=YOUR_AFFILIATE_ID" width="100%" height="500" frameborder="0" title="OddsGuard Widget"> </iframe>
JavaScript Widget Embedding
For a more seamless integration with automatic sizing, use our JavaScript embedding script:
1. Add this script to your HTML:
<script src="https://oddsguard.com/widget-embed.js"></script>
2. Add a container element where you want the widget to appear:
<div class="oddsguard-widget" data-theme="dark" data-size="medium" data-sport="basketball" data-league="basketball_nba" data-affiliate-id="YOUR_AFFILIATE_ID" data-height="600px" data-width="100%"> </div>
Live example of JavaScript widget embedding:
JavaScript Widget Implementation
Note: This demo shows the final result of JavaScript widget embedding. For actual implementation on external websites, use the code above.
For the slim widget without sidebar:
<div class="oddsguard-widget" data-type="slim" data-theme="light" data-affiliate-id="YOUR_AFFILIATE_ID" data-height="500px" data-width="100%"> </div>
Customization Options
You can customize the widget by adding these parameters to the iframe URL or as data attributes:
| Parameter | Options | Description |
|---|---|---|
| theme | light, light-blue, light-warm, light-green, dark, dark-blue, dark-emerald, dark-crimson | Visual theme of the widget |
| size | full, medium, minimal | Layout size preset |
| sport | basketball, soccer, etc. | Default sport category |
| league | basketball_nba, soccer_epl, etc. | Default league/subcategory |
| oddsFormat | American, Decimal, Fractional | Format for displaying odds |
| showHeader | true, false | Show/hide the header |
| showSidebar | true, false | Show/hide the sidebar |
| type | standard, slim | Widget layout type ('slim' is mobile-optimized without sidebar) |
| bgColor | Hex color (e.g. #1f2937) | Custom card/panel background color |
| pageBgColor | Hex color (e.g. #f9fafb) | Custom page background color |
| textColor | Hex color (e.g. #f3f4f6) | Custom text color |
| primaryColor | Hex color (e.g. #6366f1) | Custom primary/accent color |
| borderColor | Hex color (e.g. #e5e7eb) | Custom border/stroke color |
| oddsColor | Hex color (e.g. #f3f4f6) | Custom odds cell background color |
| activeItemColor | Hex color (e.g. #e0e7ff) | Custom selected sport/league highlight color |
| affiliateId | UUID string | Affiliate ID for tracking clicks and earning commissions |
Affiliate Program Integration
The widgets support affiliate tracking through the affiliateId parameter. When users click on bookmaker odds through your embedded widget, you'll earn commission on any resulting signups or deposits.
How Affiliate Tracking Works
- Pass your affiliate ID using the
affiliateIdparameter - All bookmaker clicks from your widget will be tracked to your account
- Commissions are calculated based on user activity and paid monthly
- If no affiliate ID is provided, clicks default to OddsGuard direct
Getting Your Affiliate ID
To join our affiliate program and get your unique affiliate ID:
- 1. Contact our affiliate team at affiliate@oddsguard.com
- 2. Complete the affiliate application process
- 3. Receive your unique affiliate ID (UUID format)
- 4. Start embedding widgets with your affiliate ID to earn commissions
Example Affiliate Implementation:
<!-- iframe embedding with affiliate tracking --> <iframe src="https://oddsguard.com/embed/widget?theme=dark&size=medium&sport=basketball&affiliateId=YOUR_AFFILIATE_ID" width="100%" height="500" frameborder="0" title="OddsGuard Widget"> </iframe> <!-- JavaScript embedding with affiliate tracking --> <script src="https://oddsguard.com/widget-embed.js"></script> <div class="oddsguard-widget" data-theme="dark" data-size="medium" data-sport="basketball" data-affiliate-id="YOUR_AFFILIATE_ID" data-height="500px" data-width="100%"> </div>
Stop Leaving Money on the Table
Same Bets. Better Prices. Found Instantly.
The same 4-leg parlay can pay $10,000s more at a different sportsbook. OddsGuard finds the best price across 72 books in real time — replacing tools that charge $200–$600/month.
Best Pricing in Your Region