What Are the Options for Embedding the Online Booking Function via iFrame on My Website?

Shore offers several options for adding the booking function to your website. Here we'll show you the different iFrame variants.

An iFrame is a small area on your website where another page is embedded — in this case, your personal Shore booking page. This lets your customers book appointments directly on your website without having to leave it.

Below you'll find three different embedding options:

Reduziertes Design:

<div style="overflow-x: hidden; width: 840px;"><iframe frameborder="0" height="750" src="https://connect.shore.com/widget/nolayout/SLUG" width="771"></iframe></div>

Complete iFrame:

<div style="overflow-x: hidden; width: 1150px;"><iframe frameborder="0" height="1250" src="https://connect.shore.com/widget/SLUG" width="771"></iframe></div>

Responsive:

<!ShoreBookingIframeStyling START→
<style>
@media only screen and (minwidth:
770px) {
iframe.shorebookingiframe
{
width: 770px;
}
}
@media only screen and (minwidth:
1100px) {
iframe.shorebookingiframe{
width: 1100px;
}
}
</style>
<!ShoreBookingIframeStyling
END→


Body Element für Root Level:

<!ShoreBookingIframe
START>
<iframe class="shorebookingiframe"
src="https://connect.shore.com/widget/SLUG?
locale=de" frameborder="1"
height="850" width="350"> </iframe>
<!ShoreBookingIframe END→#