				
					<script>
var synxisControllerInstance = null;
function initSynxisController() {
SynxisUIController.init({
environment: 'p1',
apiKey: 'MDAxMjF+dVNKZlBxNkNpazBlb2Q5SkEwL0xmVi9XTlJqbkh4V2t6ZjRONjllRDdKajlhYmtsYSt1RkFucUhwZXZDakJ5aklLNFlBQ3o0YW8zdXpVczBqaENhZ2c9PQ==',
 locale: 'en-US',
 chainId: '5445',
 hotelId: '12117',
 currency: 'GBP',
bookingEngineMode: 'in-context',
sbeLinkAdapter: true,
components: ['book-now', 'search-bar', 'in-context', 'cart','best-price', 'calendar']
}).then(function(controller) {
synxisControllerInstance = controller;
console.log('SynXis UI Controller initializedsuccessfully');
}).catch(function(error) {
console.error('Failed to initialize controller:', error);
});
}
</script>
 
<script src="https://be.synxis.com/sbem/web/ui-controller/1.x/shs-sbem-ui-controller.umd.js" onload="initSynxisController()"></script>

In-context component – can be placed anywhere on the page

This is the booking engine and will appear as an overlay when triggered

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

Cart component

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

Book now component

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

The Spires Apartments Edinburgh

The Spires Apartments Glasgow

The Spires Apartments Birmingham

The Spires Apartments Cardiff

The Spires Apartments Aberdeen

Book now component with promo code and additional CSS (applies to component only)

				
					<shs-sbem-book-now
 promo="MEMBER"
 css="
 :host {
--font-sans: lato, sans-serif;
    --font-serif: lato, sans-serif;
 }
 ">
</shs-sbem-book-now>

Book now component filtered by room

				
					<shs-sbem-book-now
 room="GLA2">
</shs-sbem-book-now>

Search bar component

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

Calendar component

				
					<shs-sbem-calendar
number-of-months="1"
hide-legend="true"
    ></shs-sbem-calendar>

In-Context BE Hotel Spires Apartments Glasgow P1