Activate third-party widget with button in header

Hi, I'm trying to get a third-party widget to activate with the BOEK NU (book now) button in the header. Unfortunately, I have only been able to link this to a separate booking page with the IN-LINE widget, which is not what I want.

The widget should 'slide-in' from the right-hand side of the page. For this, I received the code below.

Could somebody help me with this?

Regards,
Patrick

Website: somatichub.nl
Pasword: SS2024!

<button id="widget-button">Boek nu</button>

<script src="https://cdn.jsdelivr.net/npm/appybee-widget"></script>

<script>
    AppyBeeWidget.init({
        companyAPIKey: 'f3a4a372f989b69e66e4bfb0a438b0b3',
        style: 'side',
        locale: 'nl'
    });
</script>

<script>
    var button = document.getElementById("widget-button");
    button.onclick = function() {
        AppyBeeWidget.show();
    };
</script>
 

16 minutes ago, Patrickvhnederend said:

Hi, I'm trying to get a third-party widget to activate with the BOEK NU (book now) button in the header. Unfortunately, I have only been able to link this to a separate booking page with the IN-LINE widget, which is not what I want.

The widget should 'slide-in' from the right-hand side of the page. For this, I received the code below.

Could somebody help me with this?

Regards,
Patrick

Website: somatichub.nl
Pasword: SS2024!

<button id="widget-button">Boek nu</button>

<script src="https://cdn.jsdelivr.net/npm/appybee-widget"></script>

<script>
    AppyBeeWidget.init({
        companyAPIKey: 'f3a4a372f989b69e66e4bfb0a438b0b3',
        style: 'side',
        locale: 'nl'
    });
</script>

<script>
    var button = document.getElementById("widget-button");
    button.onclick = function() {
        AppyBeeWidget.show();
    };
</script>
 

Where are you put these above codes? I check on your home page but can not find them

57 minutes ago, Beyondspace said:

Where are you put these above codes? I check on your home page but can not find them

I didn't put it on the home page, as I can't put them as part of the BOEK NU button in the header.

Do you want me to make a temp button with this? As long as it is not in the header, it works.

Let me know

11 minutes ago, Beyondspace said:

Try adding to your footer code injection

Thanks. I added your code.

I slides in, but then loads the BOOK-NOW page, therefore the widget disappears again.

Is it possible to not link it to a page, so I can omit the extra booking page?

9 minutes ago, Patrickvhnederend said:

Thanks. I added your code.

I slides in, but then loads the BOOK-NOW page, therefore the widget disappears again.

 

Is it possible to not link it to a page, so I can omit the extra booking page?

I've just updated my code, try again and let me know how it works

2 minutes ago, Beyondspace said:

I've just updated my code, try again and let me know how it works

Absolute magician. Thank you so much. This made my Easter!