Skip to content

Affiliate page improvements #2564

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ashvayka merged 2 commits into from
Feb 6, 2026
Merged

Affiliate page improvements #2564

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5050838
Affiliate page improvements
rusikv Feb 5, 2026
0f30e6e
TMMQ PAYG trial total value visual improvement
rusikv Feb 6, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions _includes/pricing/calculator.sass
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -809,6 +809,9 @@ $bg-white: #fff
display: flex
align-items: center
gap: 6px
.strikethrough-text
text-decoration: line-through
color: #9E9E9E
.tooltip
position: relative
&:hover
Expand Down
2 changes: 1 addition & 1 deletion _includes/pricing/tbmq-payg-calculator.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -394,7 +394,7 @@ <h3>Calculation summary</h3>
<div class="results-total">
<span>Total</span>
<span class="total-value">
${formatCurrency(totalPrice)}/month
${formatCurrency(totalPrice)} ${isInitialState ? `<span class="strikethrough-text">${formatCurrency(plan.basePrice)}</span>` : ''}/month
<span class="tooltip">${infoIcon}<span class="tooltip-text">${tooltipText}</span></span>
</span>
</div>
Expand Down
3 changes: 3 additions & 0 deletions images/affiliate/faq-arrow.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 5 additions & 8 deletions partners/affiliate.sass
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -168,7 +168,8 @@ $affiliate-card-shadow: -4px 15px 50px -20px rgba(37, 51, 69, 0.15), 0 0 8px rgb
align-items: center
gap: 12px
padding: 13.4px
background: rgba(255, 255, 255, 0.9)
background: rgba(255, 255, 255, 0.8)
backdrop-filter: blur(4px)
-webkit-backdrop-filter: blur(8px)
border: 1px solid rgba(255, 255, 255, 0.32)
border-radius: 16px
Expand Down Expand Up @@ -309,7 +310,7 @@ $affiliate-card-shadow: -4px 15px 50px -20px rgba(37, 51, 69, 0.15), 0 0 8px rgb
color: $affiliate-text-secondary
font-weight: 500
.profit-display
background: #F4F8FE
background: $affiliate-bg
border: 1px solid rgba(42, 125, 236, 0.24)
border-radius: 16px
padding: 40px
Expand Down Expand Up @@ -371,14 +372,11 @@ $affiliate-card-shadow: -4px 15px 50px -20px rgba(37, 51, 69, 0.15), 0 0 8px rgb
.audience-card
flex: 1
background: white
border: 1px solid rgba(42, 125, 236, 0.16)
border-radius: 24px
padding: 40px
display: flex
flex-direction: column
transition: box-shadow 0.3s ease
&:hover
box-shadow: 0 15px 50px -20px rgba(37, 51, 69, 0.15), 0 0 8px 0 rgba(37, 51, 69, 0.08)
box-shadow: $affiliate-card-shadow
.audience-icon
width: 56px
height: 56px
Expand Down Expand Up @@ -510,7 +508,6 @@ $affiliate-card-shadow: -4px 15px 50px -20px rgba(37, 51, 69, 0.15), 0 0 8px rgb
color: $affiliate-text-primary
.faq-arrow
flex-shrink: 0
color: $affiliate-text-disabled
transition: transform 0.3s ease
&[aria-expanded="true"] .faq-arrow
transform: rotate(180deg)
Expand All @@ -526,7 +523,7 @@ $affiliate-card-shadow: -4px 15px 50px -20px rgba(37, 51, 69, 0.15), 0 0 8px rgb
color: $affiliate-text-secondary
padding-bottom: 20px
.faq-item.active .faq-answer
max-height: 200px
max-height: 500px
opacity: 1
transition: max-height 0.3s ease-in, opacity 0.3s ease-in

Expand Down
42 changes: 10 additions & 32 deletions partners/affiliate/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@
---

<section id="hero">
<div class="plus-pattern-bg"></div>
<div class="affiliate-main">
<div class="hero-content">
<div class="hero-text">
Expand Down Expand Up @@ -72,7 +71,6 @@ <h1>Empower the IoT community and <span class="blue-text">monetize your expertis
</section>

<section id="calculator">
<div class="plus-pattern-bg"></div>
<div class="affiliate-main">
<div class="calculator-card">
<div class="calculator-header">
Expand Down Expand Up @@ -199,9 +197,7 @@ <h2>Frequently asked questions</h2>
<div class="faq-item">
<button class="faq-question" aria-expanded="false">
<span>Who can become a ThingsBoard affiliate?</span>
<svg class="faq-arrow" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<img src="/images/affiliate/faq-arrow.svg" class="faq-arrow" alt="" width="24" height="24">
</button>
<div class="faq-answer">
<p>We welcome anyone with a relevant audience or professional network in the IoT space. This includes tech bloggers, YouTubers, IoT consultants, system integrators, and hardware manufacturers. If you create content or provide solutions that help businesses connect and manage their devices, you are a perfect fit for our program.</p>
Expand All @@ -210,9 +206,7 @@ <h2>Frequently asked questions</h2>
<div class="faq-item">
<button class="faq-question" aria-expanded="false">
<span>How is the commission calculated?</span>
<svg class="faq-arrow" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<img src="/images/affiliate/faq-arrow.svg" class="faq-arrow" alt="" width="24" height="24">
</button>
<div class="faq-answer">
<p>Commission is calculated as a percentage of the actual payment made by the customer. You receive:<br><b>30%</b> for Public Cloud and Self-managed subscriptions(recurring for 12 months);<br><b>15%</b> for Private Cloud subscriptions (recurring for 12 months);<br><b>10%</b> for Perpetual Licenses and Enterprise contracts (one-time). Earnings are credited to your FirstPromoter account immediately after the client's payment is confirmed.<br><br> <i>Example: For a client referred to the "Pilot" plan on the Public Cloud, you will receive a commission of $44.70 per month. This equates to a total annual commission of $536.40 from a single client.</i></p>
Expand All @@ -221,9 +215,7 @@ <h2>Frequently asked questions</h2>
<div class="faq-item">
<button class="faq-question" aria-expanded="false">
<span>Can I earn rewards for referring free users?</span>
<svg class="faq-arrow" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<img src="/images/affiliate/faq-arrow.svg" class="faq-arrow" alt="" width="24" height="24">
</button>
<div class="faq-answer">
<p>Yes! We value community growth. You can earn a $100 bonus for every 100 verified users who sign up for our Public Cloud Free Subscription plan through your unique affiliate link. This allows you to monetize your reach even if your audience isn't ready for a paid plan yet.</p>
Expand All @@ -232,9 +224,7 @@ <h2>Frequently asked questions</h2>
<div class="faq-item">
<button class="faq-question" aria-expanded="false">
<span>What is the payout schedule?</span>
<svg class="faq-arrow" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<img src="/images/affiliate/faq-arrow.svg" class="faq-arrow" alt="" width="24" height="24">
</button>
<div class="faq-answer">
<p>Commissions are paid monthly. We pay out all earned commissions once a month, regardless of the amount, ensuring you receive your rewards consistently.</p>
Expand All @@ -243,9 +233,7 @@ <h2>Frequently asked questions</h2>
<div class="faq-item">
<button class="faq-question" aria-expanded="false">
<span>How does tracking and attribution work technically?</span>
<svg class="faq-arrow" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<img src="/images/affiliate/faq-arrow.svg" class="faq-arrow" alt="" width="24" height="24">
</button>
<div class="faq-answer">
<p>When a user clicks your link, your Promoter ID is automatically linked to their profile as soon as they sign up for our Cloud/License Portal or submit a "Contact Us" request. We use FirstPromoter to accurately track commissions and process payouts via PayPal or Wise. Most importantly, we protect your leads with a first-touch attribution model: the partner who originally introduced the user earns the commission, not the one whose link was clicked last before the purchase.</p>
Expand All @@ -254,9 +242,7 @@ <h2>Frequently asked questions</h2>
<div class="faq-item">
<button class="faq-question" aria-expanded="false">
<span>What is the recommended roadmap for success?</span>
<svg class="faq-arrow" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<img src="/images/affiliate/faq-arrow.svg" class="faq-arrow" alt="" width="24" height="24">
</button>
<div class="faq-answer">
<p>1. Join: Sign up to get your unique affiliate link.<br>2. Learn: Download the 'Playbook' from our Partner Toolkit to master the value proposition.<br>3. Create: Publish a tutorial, case study, or comparison article featuring ThingsBoard.<br>4. Distribute: Share it with your audience on LinkedIn, YouTube, or your blog.<br>5. Earn: Track your clicks in FirstPromoter and receive monthly payouts.</p>
Expand All @@ -265,9 +251,7 @@ <h2>Frequently asked questions</h2>
<div class="faq-item">
<button class="faq-question" aria-expanded="false">
<span>What are the key program concepts I should know?</span>
<svg class="faq-arrow" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<img src="/images/affiliate/faq-arrow.svg" class="faq-arrow" alt="" width="24" height="24">
</button>
<div class="faq-answer">
<p><b>First-Touch Attribution:</b> You get the credit if you are the first to refer a user, protecting your leads regardless of future clicks.<br>
Expand All @@ -278,9 +262,7 @@ <h2>Frequently asked questions</h2>
<div class="faq-item">
<button class="faq-question" aria-expanded="false">
<span>What marketing methods are prohibited?</span>
<svg class="faq-arrow" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<img src="/images/affiliate/faq-arrow.svg" class="faq-arrow" alt="" width="24" height="24">
</button>
<div class="faq-answer">
<p>To protect our brand, we prohibit 'Brand Bidding' (running ads on keywords like 'ThingsBoard') and unsolicited spam. We highly encourage organic content, case studies, and direct consulting.</p>
Expand All @@ -289,9 +271,7 @@ <h2>Frequently asked questions</h2>
<div class="faq-item">
<button class="faq-question" aria-expanded="false">
<span>What is the difference between the subscription plans?</span>
<svg class="faq-arrow" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<img src="/images/affiliate/faq-arrow.svg" class="faq-arrow" alt="" width="24" height="24">
</button>
<div class="faq-answer">
<p><a href="/products/paas/">Public Cloud</a> is a ready-to-use SaaS solution hosted by us. <a href="/products/thingsboard-pe/">Self-managed (Professional Edition)</a> allows customers to install the platform on their own servers or cloud for full control. <a href="/pricing/?product=thingsboard-private-cloud">Private Cloud</a> is a dedicated instance managed by our team for high-load enterprise projects. <a href="/pricing/?product=thingsboard-pe&solution=pe-perpetual">Perpetual Licenses</a> are a one-time purchase option for self-hosted deployments.</p>
Expand All @@ -300,9 +280,7 @@ <h2>Frequently asked questions</h2>
<div class="faq-item">
<button class="faq-question" aria-expanded="false">
<span>I have more questions. Who should I contact?</span>
<svg class="faq-arrow" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<img src="/images/affiliate/faq-arrow.svg" class="faq-arrow" alt="" width="24" height="24">
</button>
<div class="faq-answer">
<p>If you have specific questions or need assistance, please contact our partner team directly at <a href="mailto:affiliates@thingsboard.io">affiliates@thingsboard.io</a>. We are here to help you succeed!</p>
Expand Down