TicketEA Embed code and Webflow

Hi there.

I’m editing a website for the company that I work for and I’ve run into a bit of trouble with it.

We are a music company and we have several live events listed on our home page, with ticket links. The in which we usually do this is embed a code from TicketEA, that allows the customer to order the tickets directly from our website. However whenever I add more than one TicketEA code, either in a separate tab or a different pop-up window, it glitches out.

For example, we have one event on a friday night and one on a saturday. When i put in the first code for the friday night tickets in, it works fine, but as soon as i put in the second code for the saturday night tickets in, it replaces the first code and as result, there is only one link, when there should be two.

So from what I can see, webflow doesn’t allow me to have more than 1 TicketEA code on my site. Has anyone else experienced something similar?

Looking forward to any suggestions that could be of use!

Thanks!

Or is it TicketEA embed code that dopesn’t allow for more than 1 embed per page? It looks like a case where IDs are essential for scrits to work and as they are the same for each embed, things get messed up.

Can you give us a sharing link of your webflow project, as well as point us to TicketEA embed code? Also maybe read TicketEA guidelines carefuly to see if they mention this limitation somewhere.

I’m experiencing this exact same issue right now. A music agency wants to sell tickets though ticketea. The first embedded code from Ticketea works fine, but the rest is just giving a blank, almost looks like nothing gets embedded.

Here is the code you shared to me privately Rowan:

<div id="tkt-content">Buy your tickets here</div>
<script language="javascript" type="text/javascript" src="//www.ticketea.com/tickets-concert-live-industry-relaunch-temple-invisible/buy?width=600px&height=600px"></script>
<a href="//www.ticketea.com/tickets-concert-live-industry-relaunch-temple-invisible/"
alt="Live Industry showcases (Temple Invisible)" title="ticketea"><img src="//www.ticketea.com/images/powered_by.png" alt="ticketea" /></a>

If you follow the script link you’ll get this:

http://vincent.polenordstudio.fr/snap/ewwuj.jpg

Notice the getElementById(‘tkt-content’) part.

And notice in your pasted code, this part: **<div id="tkt-content">**

This program is looking for the tkt-content div and do things on it. By multiplicating the same code on the same page, you have multiple instances of the same programe trying to perform things on an elements that is also replicated several times in the page.

It can’t work as expected and it most probably produces weird bugs.

For this to work you’d need to name your elements tkt-content1 tkt-content2 etc and have different scripts calling them and performing things on them.

That’s where my understanding of Javascript stops. I’m unable to tell you if you could downloading and hosting instances of the modified script by yourself to make things work.

You two have maybe one option: create pages for each custom code and embed the pages in your main page using iframes.

In any way, you should ask the support of TicketEA about this, for advices. (I know you did already Rowan).

I hope this clarifies a bit how snippets of code + JS call work in a page… it’s always about “getting” an element by its name before performing tasks on it. So this issue with duplicated code happens all the time for everyone, unless the code has been specifically developed to work with multiple instances of things.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.