Streaming live at 10am (PST)

Issue with Click Events


#1

Dear Forum,
i currently struggle with the embed of onclick events.

The case is, that I am relaunching the page smilike.me and currently they use some sort of events to open up the appointment tool.

As I am not linking to a physical page here but instead opening some sort of overlay that appears on the top corner of the website, i am struggeling on how to achieve that in Webflow?

Many thanks for your help!

Best,
Martin


Here is my site Read-Only: https://preview.webflow.com/preview/smilike?utm_source=smilike&preview=5f567681f7c55df977f1416f1864cf1a
(how to share your site Read-Only link)


#2

Hello @martinfoerster

You want to have some kind of popup? Am I understanding you right?

Piter :webflow_heart:


#3

Dear Piter,
yes check the old site www.smilike.me please - if you want to click on a button to book an appointment, it opens a java script layover.


#4

Creating a popup is very easy. I can show you the basics and you can take it from there.


#5

that would be great!

the “linktarget” of the links is “toggleDrFlexAppointments(21054)”

i am refering to this site:
https://smilike.me/smilike_wp/wp-content/themes/smilike/fp-termin.php

check what happens when you click on the buttons, it opens a third party java script application and i am wondering on how to achieve that with webflow? Where can i specify these kind of link targets?


#6

I think that the popup comes from the https://dr-flex.de/ service. You can create popups in Webflow, but if you want to use https://dr-flex.de/ I think they are the ones who give the script for the widget.


#7

Next to embedding a script in the head (easy task)

you need to include these kind of links: <a href=“javascript:toggleDrFlexAppointments(21054)” class=“standort-link standort-link-links”>Berlin</a>

instead of a normal sitelink, do I just use “javascript:toggleDrFlexAppointments(21054)” instead of for example "booking.html?

How to attach a class to a link?


#8

I can’t find information about the embedding options on their site. Do you have the script they are providing or some documentation they have?

If you want to add a .standort-link standort-link-links class you just give the button this class name.

I’m not sure because I can’t find information on their site.