I’m trying to create a custom banner on my website that only appears for visitors who come from specific pages. The banner should display a unique discount code based on the visitor’s page.
Here’s a breakdown of what I’m trying to achieve:
Trigger: The banner should appear only for visitors from specific pages.
Condition: The visitor must have a discount code associated with their page. The discount codes are in the format “AD_XXXX” where “XXXX” is a unique code for each page.
Banner Content: The banner should display a message like “You are eligible for 50% off your first 6 months. Get the deal.”
Action: Clicking the “Get the deal” button should redirect the visitor to the signup page with the appropriate discount code pre-filled.
I’m not sure how to approach this, especially the part about dynamically populating the discount code based on the visitor’s page. Any suggestions or code examples would be greatly appreciated.
Are you referring to the landing page they arrived on initially? Or do you mean the referring page on e.g. a partner’s website?
Either way this comes down to some form of referrer and cookie/session tracking and custom code. You’d need to know the exact mechanics you want in order to build it, but I’d probably recommend you store your banner details, discount codes, etc in the CMS along either referral codes or landing page paths, and then the rest is Javascript to show the right ones, capture the CTA and populate your form fields with the discount code.
Yes, so for instance, if a user is on a partner’s page, and then clicks to visit our home page, I would like to show up a banner on our homepage with a specific discount code from that partner, and then when they click on that banner, it would get them to the signup page with that partner’s specific discount code already embedded. Not sure if that’s a possible thing to do
It’s definitely possible, and there are several engineering paths but all of them will require some code.
Are you giving out special affiliate links to each partner? That would be the safest way to identify the user’s source when they click through to your site.
Here are a few notes that might help;
Inbound urls shaped like mysite.com?aff_id=92183jsdll , you create and give these to partners, and store them in the CMS. The affiliate ID can be the slug.
Script on your homepage ( probably every page checks for the ?aff_id querystring param. If it sees it, I usually store this in webStorage or in a cookie and then remove it from the displayed URL to make it pretty. You now know where they originated from, and can tag e.g. new user accounts sign-ups, ecom purchases, and form submits.
You can then check to see if you’ve shown the pop-up, if not show it. The content will be adjusted to show the affiliate’s name, your discount code, etc. If you will have a lot of affiliates, this would be in the CMS, you can emit it hidden on the page, and invoke the correct partner popup.
On your signup page, regardless of how they arrived, you then already initialize the discount field. This piece, I’d probably show the partner code and the discount, being given, but not put them in visible form input fields. I’d put them in hidden fields to pass with the enrolment, and still want to check them server-side to ensure they haven’t been tampered with. Not to hard to change that 5% discount to a 25% if you know programming.
For your popup, two approaches I can suggest-
Build them as standard Webflow interactions-based modals, within a collection list so that you have easily up to 100 affiliates. Invoke the pop-up with a button. Have your script click the appropriate partner’s button to display that pop-up, when you want it to appear ( ID them e.g. popup-(partner code) to make it easy.
Here’s a demo of CMS-driven modals;
Or, use SA5’s modals, which are attributed based and don’t require any interactions work. These handle things like the suppression automatically;
In terms of the partner-specific content, you can either embed it directly in the page from the CMS, using a hidden collection list and access it via script - if you have > 100 partners, I’d probably put that content in Airtable, and have a simple API to retrieve a specific partner’s info by partner code.
That’s a bit nicer as none of your partners are in the page HTML, which adds a layer of security in case you have any snooping competitors.
