Use multiple buttons for each service

Brow tidy and tint (Brugge)

35,00 €
Manicure (Ixelles)

30,00 €
Pedicure (Anderlecht)

20,00 €

Minimal button markup

Add data-attributes to action buttons on your website

<button data-ew-location="{location_id}" data-ew-service="{service_id}">
   Custom text or service name here...
</button>

Warning! please change location_id and service_id to your values (you can find it in URL of service page in EasyWeek widget).

Widget Code

Copy and paste this code as the first item into the <HEAD> of every web page that you want to connect widget.

<script src="https://widget.easyweek.io/widget.js"></script>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        var widget = new EasyWeekWidget({
            url: 'https://widget.easyweek.io/company-slug',
            button: false
        })

        function onServiceClick($event) {
            var button = $event.target.matches('data-ew-service')
                ? $event.target
                : $event.target.closest('[data-ew-service]')

            if (!button) return

            widget.setProduct(
                button.getAttribute('data-ew-service'),
                button.getAttribute('data-ew-location')
            )
        }

        document.addEventListener('click', onServiceClick)
    })
</script>

Warning! please change company-slug to your company slug on EasyWeek (you can find it in EasyWeek website config).