Schaltfläche „Bestehende Website“ – hat die ID #book-now-bt

getElementById – Die ID der Schaltfläche „Hier klicken“
				
					<script>

      document.getElementById('book-now-bt')
   
</script>
				
			
				
					<script>
(function() {
  document.addEventListener('DOMContentLoaded', function() {
    // CHANGE: Add your book now button selectors here
    var buttons = [
      document.getElementById('book-now-bt'),// CHANGE: Main book now button ID
      //document.querySelector('.book-now-button-footer')  // CHANGE: if using class 
    ];
    buttons.forEach(function(btn) {
      if (!btn) return;
      btn.addEventListener('click', function(e) {
        e.preventDefault();
        var fallbackUrl = this.href;
        var timeout = 2000;  // Wait up to 2 seconds for controller to load
        var start = Date.now();
        
        (function checkAndOpen() {
          if (synxisControllerInstance?.openOverlay) {
            try {
              synxisControllerInstance.openOverlay({ route: '/' });
            } catch (err) {
              console.error('Overlay error:', err);
              window.location.href = fallbackUrl;
            }
          } else if (Date.now() - start < timeout) {
            setTimeout(checkAndOpen, 100);
          } else {
            window.location.href = fallbackUrl;
          }
        })();
      });
    });
  });
})();
</script>
				
			

Kontextbezogene Komponente – kann an beliebiger Stelle auf der Seite platziert werden

Dies ist die Buchungsmaschine, die bei Auslösung als Overlay angezeigt wird.

				
					<shs-sbem-in-context></shs-sbem-in-context>
				
			

Warenkorb-Komponente

				
					<shs-sbem-cart></shs-sbem-cart>
				
			

Jetzt buchen-Komponente

 

				
					<shs-sbem-book-now></shs-sbem-book-now>
				
			

Komponente „Jetzt buchen“ mit Promo-Code und zusätzlichem CSS (gilt nur für die Komponente)

				
					<shs-sbem-book-now
 promo="BREAKFAST"
   css=".bg-primary-button:hover{background-color:#f5f1e8!important;color:#000!important;}
 :host {--font-sans: 'Open Sans', sans-serif;}">
</shs-sbem-book-now>
				
			

Bester Preis für eine Übernachtung im Standard-Doppelzimmer

				
					<shs-sbem-best-price
    room="DBL"
    length-of-stay="1"
    ></shs-sbem-best-price>	
				
			

Suchleiste-Komponente

				
					 <shs-sbem-search-bar
 sections='["dates", "occupancy", "codes", "submit"]'
	 >
 </shs-sbem-search-bar>
				
			

Kalenderkomponente

				
					<shs-sbem-calendar
number-of-months="1"
hide-legend="true"
css=" :host {--color-primary: oklch(0 0 0)}"
    ></shs-sbem-calendar>