Embedding Event in a Web Page Iframe
We fully support embedding your event URL into another web page using iframes.
Your pages display differently based on screen size. This would typically be enabled to permit functionality with smaller tablets and mobile devices. However, when using an iframe this too changes the screen size and may change the display.
That being said, consider the following important size thresholds:
- The bare minimum size recommended is
374px
x627px
. This displays the mobile view and is tall enough to show the entire calendar. - Widths less than
768px
show 3 days at a time while larger widths show a full 7 days.
We also expose two important parameters so you can control how the embedded page looks:
- embed - Set this as
embed=true
in your iframe src to remove all headers and footers from your pages. - bgcolor - Set this as
bgcolor=white
orbgcolor=#FFFFFF
to change the default light gray background color. Note that font colors will not change so experiment with different background colors for optimal readability.
Here is an example min-sized iframe definition. Note there is no styling but for setting the sizing:
<iframe src="http://appointment.one/{URL}?embed=true" frameborder="1" style="width:374px; height: 627px;"></iframe>
And below here is the actual iframe as defined
Here is an example min-sized iframe definition. Note there is no styling but for setting the sizing:
<iframe src="http://appointment.one/{URL}?embed=true" frameborder="1" style="width:768px; height: 627px;"></iframe>
And below here is the actual iframe as defined
We're doing amazing things at Appointment.one. Experience simple scheduling without email tag or double booking.