Dynamic Images Within Landing Page

We’re building a new landing page that we’d like to use for ALL of our outside rep firms. Ideally, we’d like to use ONE landing page with the same general content and contact information (using some redirecting phone numbers).

The tricky part is the logos. Each rep firm has their own logo. Each logo would need to display in approximately the same location on the page. How can we display various size logos on page load? (Yes, we’ll be including a script that will geo-located each rep firm). Based on the geo-information - we’d like to display a DIFFERENT rep logo.

The big question is how? embedded iFrame within the landing page perhaps? If so, what’s the best way to go about this - or is there an easier or more ideal way to do this?

Hey @JWCole,

If you are using a geoIP service, you can write a small JS that depending on the country/state/area displays a particular image.

In the Unbounce builder you would add and stack all of the images one on top of the other. Hide it all with CSS and use the JS to display the appropriate one.

Now, this assumes that you don’t have 1000 logos you need to display since that would really slow down the page. Something like half a dozen logos or so should be fine. (also don’t forget to use SVGs for the logos)


@Hristian much appreciation. Thanks so much for coming to the rescue. Also, we only have about 25 logos to wrestle with - so hopefully - that’s relatively tame. Thanks again!