http://co-reception.com/wiki/index.php?action=history&feed=atom&title=Make_Your_Own_Booking_Widget
Make Your Own Booking Widget - Revision history
2026-04-23T21:24:48Z
Revision history for this page on the wiki
MediaWiki 1.32.0
http://co-reception.com/wiki/index.php?title=Make_Your_Own_Booking_Widget&diff=16000&oldid=prev
Weins: 1 revision imported
2021-05-19T01:32:57Z
<p>1 revision imported</p>
<table class="diff diff-contentalign-left" data-mw="interface">
<tr class="diff-title" lang="en">
<td colspan="1" style="background-color: #fff; color: #222; text-align: center;">← Older revision</td>
<td colspan="1" style="background-color: #fff; color: #222; text-align: center;">Revision as of 01:32, 19 May 2021</td>
</tr><tr><td colspan="2" class="diff-notice" lang="en"><div class="mw-diff-empty">(No difference)</div>
</td></tr></table>
Weins
http://co-reception.com/wiki/index.php?title=Make_Your_Own_Booking_Widget&diff=15999&oldid=prev
Beds24>Annette at 11:24, 9 September 2020
2020-09-09T11:24:08Z
<p></p>
<table class="diff diff-contentalign-left" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="en">
<td colspan="2" style="background-color: #fff; color: #222; text-align: center;">← Older revision</td>
<td colspan="2" style="background-color: #fff; color: #222; text-align: center;">Revision as of 11:24, 9 September 2020</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l4" >Line 4:</td>
<td colspan="2" class="diff-lineno">Line 4:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>[[Category:Developers]]</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>[[Category:Developers]]</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>[[Category:Widgets]]</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>[[Category:Widgets]]</div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"><div class="heading">Create a custom booking widget</div></ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"> This page explains how to create your own booking widget</ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"></ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"><div class="warning">{{#fas:exclamation-triangle}} Check the options the widget designer {{#fas:cog}} (SETTINGS) BOOKING ENGINE > BOOKING WIDGETS first. </div> </ins></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>__TOC__</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>__TOC__</div></td></tr>
<tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;"> ''This page explains how to create your own booking widget''</del></div></td><td colspan="2"> </td></tr>
<tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;">'''Requires:''' Basic understanding of HTML</del></div></td><td colspan="2"> </td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"><span style="color: #f3e504; font-size: 250%;" >{{#fas:lightbulb}} </span> '''Required Skills''': Basic understanding of HTML</ins></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Introduction ==</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Introduction ==</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Making your own booking widget is not hard. It only involves opening the booking page and optionally passing some information to it. </div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Making your own booking widget is not hard. It only involves opening the booking page and optionally passing some information to it. </div></td></tr>
<tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l13" >Line 13:</td>
<td colspan="2" class="diff-lineno">Line 16:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Common ways to open the booking page are using an HTML <A> link or using a <FORM> with selectors and inputs.</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Common ways to open the booking page are using an HTML <A> link or using a <FORM> with selectors and inputs.</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>We will only focus on the technical aspects of getting the form to submit information, we will not show any styling, labels, <del class="diffchange diffchange-inline">javascript </del>and CSS, that is completely up to you to create any style you need.</div></td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>We will only focus on the technical aspects of getting the form to submit information, we will not show any styling, labels, <ins class="diffchange diffchange-inline">Javascript </ins>and CSS, that is completely up to you to create any style you need.</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Modify to suit and paste the samples into your web page.</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Modify to suit and paste the samples into your web page.</div></td></tr>
<tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l23" >Line 23:</td>
<td colspan="2" class="diff-lineno">Line 26:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>A basic HTML FORM can be created like this</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>A basic HTML FORM can be created like this</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div> <FORM METHOD="POST" ACTION="https://<del class="diffchange diffchange-inline">www.</del>beds24.com/booking2.php"></div></td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> <FORM METHOD="POST" ACTION="https://beds24.com/booking2.php"></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <input type="hidden" name="propid" value="2035"></div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <input type="hidden" name="propid" value="2035"></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <input type="submit" value="Book Now"></div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <input type="submit" value="Book Now"></div></td></tr>
<tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l41" >Line 41:</td>
<td colspan="2" class="diff-lineno">Line 44:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>It is possible using jQuery or javascript to keep the select options up-to-date with the current month/year but that is beyond the scope of this How To.</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>It is possible using jQuery or javascript to keep the select options up-to-date with the current month/year but that is beyond the scope of this How To.</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div> <FORM METHOD="POST" ACTION="https://<del class="diffchange diffchange-inline">www.</del>beds24.com/booking2.php"></div></td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> <FORM METHOD="POST" ACTION="https://beds24.com/booking2.php"></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <select name='fdate_date'></div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <select name='fdate_date'></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <option value='1'>1</option></div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <option value='1'>1</option></div></td></tr>
<tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l110" >Line 110:</td>
<td colspan="2" class="diff-lineno">Line 113:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>We can add selectors for the length of stay and number of guests as follows</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>We can add selectors for the length of stay and number of guests as follows</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div> <FORM METHOD="POST" ACTION="https://<del class="diffchange diffchange-inline">www.</del>beds24.com/booking2.php"></div></td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> <FORM METHOD="POST" ACTION="https://beds24.com/booking2.php"></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <select name='fdate_date'></div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <select name='fdate_date'></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <option value='1'>1</option></div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <option value='1'>1</option></div></td></tr>
<tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l242" >Line 242:</td>
<td colspan="2" class="diff-lineno">Line 245:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>4. Paste the code into the source code of your web site</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>4. Paste the code into the source code of your web site</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div> <nowiki><div style="color: #2f2f2f; font-size:14px; width: 100%; padding-top: 5px; padding-bottom: 5px; text-align: center; background: #339900; background: -moz-linear-gradient(top, #66cc00, #339900); background: -webkit-gradient(linear, left top, left bottom, from(#66cc00), to(#339900)); background: -webkit-linear-gradient(top, #66cc00, #339900); background: -o-linear-gradient(top, #66cc00, #339900); background: linear-gradient(top, #66cc00, #339900); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#66cc00', endColorstr='#339900');" class="b24bookingstrip"><form method='GET' target='_blank' action='https://<del class="diffchange diffchange-inline">www.</del>beds24.com/booking.php' style='margin:0; padding:0;'><span style='padding-right: 10px; display: inline-block;'><a style='color: #2f2f2f;text-decoration:none;' target='_blank' href='https://<del class="diffchange diffchange-inline">www.</del>beds24.com/booking.php?propid=3103&page=getdates&type=0&referer=BookingStrip'></a></span><span style='display: inline-block; padding-right: 10px;'></div></td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> <nowiki><div style="color: #2f2f2f; font-size:14px; width: 100%; padding-top: 5px; padding-bottom: 5px; text-align: center; background: #339900; background: -moz-linear-gradient(top, #66cc00, #339900); background: -webkit-gradient(linear, left top, left bottom, from(#66cc00), to(#339900)); background: -webkit-linear-gradient(top, #66cc00, #339900); background: -o-linear-gradient(top, #66cc00, #339900); background: linear-gradient(top, #66cc00, #339900); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#66cc00', endColorstr='#339900');" class="b24bookingstrip"><form method='GET' target='_blank' action='https://beds24.com/booking.php' style='margin:0; padding:0;'><span style='padding-right: 10px; display: inline-block;'><a style='color: #2f2f2f;text-decoration:none;' target='_blank' href='https://beds24.com/booking.php?propid=3103&page=getdates&type=0&referer=BookingStrip'></a></span><span style='display: inline-block; padding-right: 10px;'></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <select id='fdate550775_date_propid3103' name='fdate_date' style='font-size:inherit; margin:0; padding:0;color: #2f2f2f'<option value='1'>1</option><br></select></div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <select id='fdate550775_date_propid3103' name='fdate_date' style='font-size:inherit; margin:0; padding:0;color: #2f2f2f'<option value='1'>1</option><br></select></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <select id='fdate550775_monthyear_propid3103' name='fdate_monthyear' style='font-size:inherit; margin:0; padding:0;color: #2f2f2f;'></div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> <select id='fdate550775_monthyear_propid3103' name='fdate_monthyear' style='font-size:inherit; margin:0; padding:0;color: #2f2f2f;'></div></td></tr>
<tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l261" >Line 261:</td>
<td colspan="2" class="diff-lineno">Line 264:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Create a URL like this:</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Create a URL like this:</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>https://<del class="diffchange diffchange-inline">www.</del>beds24.com/booking2.php?propid=13434&checkin_hide=2016-11-24&numnight=2&numadult=1&br1-32906=Book</div></td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>https://beds24.com/booking2.php?propid=13434&checkin_hide=2016-11-24&numnight=2&numadult=1&br1-32906=Book</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>You need to define:</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>You need to define:</div></td></tr>
<tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l277" >Line 277:</td>
<td colspan="2" class="diff-lineno">Line 280:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Redirect to your own property landing page ==</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Redirect to your own property landing page ==</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>You can do this with the menu <del class="diffchange diffchange-inline">Settings </del>> <del class="diffchange diffchange-inline"> Properties </del>> <del class="diffchange diffchange-inline">Link </del></div></td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>You can do this with the menu <ins class="diffchange diffchange-inline">SETTINGS-</ins>><ins class="diffchange diffchange-inline">BOOKING ENGINE-</ins>><ins class="diffchange diffchange-inline">BEHAVIOUR.</ins></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Set "Booking Redirect" = Immediately</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Set "Booking Redirect" = Immediately</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Set "Booking Redirect Url" = your landing page for the property. The landing page can contain can iframe with the property booking page. If you do have an Iframe embedded make sure you do not set the number of nights or people in the URL.</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Set "Booking Redirect Url" = your landing page for the property. The landing page can contain can iframe with the property booking page. If you do have an Iframe embedded make sure you do not set the number of nights or people in the URL.</div></td></tr>
</table>
Beds24>Annette
http://co-reception.com/wiki/index.php?title=Make_Your_Own_Booking_Widget&diff=11486&oldid=prev
Weins: 1版 をインポートしました
2019-03-12T02:19:21Z
<p>1版 をインポートしました</p>
<table class="diff diff-contentalign-left" data-mw="interface">
<tr class="diff-title" lang="en">
<td colspan="1" style="background-color: #fff; color: #222; text-align: center;">← Older revision</td>
<td colspan="1" style="background-color: #fff; color: #222; text-align: center;">Revision as of 02:19, 12 March 2019</td>
</tr><tr><td colspan="2" class="diff-notice" lang="en"><div class="mw-diff-empty">(No difference)</div>
</td></tr></table>
Weins
http://co-reception.com/wiki/index.php?title=Make_Your_Own_Booking_Widget&diff=11485&oldid=prev
Beds24>Annette: /* Redirect to your own property landing page */
2017-08-30T16:13:41Z
<p><span dir="auto"><span class="autocomment">Redirect to your own property landing page</span></span></p>
<p><b>New page</b></p><div>[[Category:Widgets]]<br />
[[Category:Booking Page]]<br />
[[Category:How to]]<br />
[[Category:Developers]]<br />
[[Category:Widgets]]<br />
__TOC__<br />
''This page explains how to create your own booking widget''<br />
'''Requires:''' Basic understanding of HTML<br />
<br />
== Introduction ==<br />
Making your own booking widget is not hard. It only involves opening the booking page and optionally passing some information to it. <br />
<br />
Common ways to open the booking page are using an HTML <A> link or using a <FORM> with selectors and inputs.<br />
<br />
We will only focus on the technical aspects of getting the form to submit information, we will not show any styling, labels, javascript and CSS, that is completely up to you to create any style you need.<br />
<br />
Modify to suit and paste the samples into your web page.<br />
<br />
== Create a Widget ==<br />
<br />
'''Create a Form'''<br />
<br />
A basic HTML FORM can be created like this<br />
<br />
<FORM METHOD="POST" ACTION="https://www.beds24.com/booking2.php"><br />
<input type="hidden" name="propid" value="2035"><br />
<input type="submit" value="Book Now"><br />
</FORM><br />
<br />
It is very simple and will show a "Book Now" button and open the property with the specified propid.<br />
<br />
You could alternatively use ownerid to show all properties in an account or roomid to show only one room.<br />
<br />
<br />
'''Collect Check-in Date'''<br />
<br />
The Check-in date can be sent to the booking page using any of the paramentes at [[Developers|Developers]]<br />
<br />
There are some very nice jQuery ways to collect a date but this example will use a standard HTML selector for the day and a selector for the month and year.<br />
<br />
It is possible using jQuery or javascript to keep the select options up-to-date with the current month/year but that is beyond the scope of this How To.<br />
<br />
<FORM METHOD="POST" ACTION="https://www.beds24.com/booking2.php"><br />
<select name='fdate_date'><br />
<option value='1'>1</option><br />
<option value='2'>2</option><br />
<option value='3'>3</option><br />
<option value='4'>4</option><br />
<option value='5'>5</option><br />
<option value='6'>6</option><br />
<option value='7'>7</option><br />
<option value='8'>8</option><br />
<option value='9'>9</option><br />
<option value='10'>10</option><br />
<option value='11'>11</option><br />
<option value='12'>12</option><br />
<option value='13'>13</option><br />
<option value='14'>14</option><br />
<option value='15'>15</option><br />
<option value='16'>16</option><br />
<option value='17'>17</option><br />
<option value='18'>18</option><br />
<option value='19'>19</option><br />
<option value='20'>20</option><br />
<option value='21'>21</option> <br />
<option value='22'>22</option><br />
<option value='23'>23</option><br />
<option value='24'>24</option><br />
<option value='25'>25</option><br />
<option value='26'>26</option><br />
<option value='27'>27</option><br />
<option value='28'>28</option><br />
<option value='29'>29</option><br />
<option value='30'>30</option><br />
<option value='31'>31</option><br />
</select><br />
<select name='fdate_monthyear'><br />
<option value='2014-08'>Aug 2014</option><br />
<option value='2014-09'>Sep 2014</option><br />
<option value='2014-10'>Oct 2014</option><br />
<option value='2014-11'>Nov 2014</option><br />
<option value='2014-12'>Dec 2014</option><br />
<option value='2015-01'>Jan 2015</option><br />
<option value='2015-02'>Feb 2015</option><br />
<option value='2015-03'>Mar 2015</option><br />
<option value='2015-04'>Apr 2015</option><br />
<option value='2015-05'>May 2015</option><br />
<option value='2015-06'>Jun 2015</option><br />
<option value='2015-07'>Jul 2015</option><br />
<option value='2015-08'>Aug 2015</option><br />
<option value='2015-09'>Sep 2015</option><br />
<option value='2015-10'>Oct 2015</option><br />
<option value='2015-11'>Nov 2015</option><br />
<option value='2015-12'>Dec 2015</option><br />
<option value='2016-01'>Jan 2016</option><br />
<option value='2016-02'>Feb 2016</option><br />
<option value='2016-03'>Mar 2016</option><br />
<option value='2016-04'>Apr 2016</option><br />
<option value='2016-05'>May 2016</option><br />
<option value='2016-06'>Jun 2016</option><br />
<option value='2016-07'>Jul 2016</option><br />
</select><br />
<input type="hidden" name="propid" value="2035"><br />
<input type="submit" value="Book Now"><br />
</FORM><br />
<br />
<br />
'''Collect Number of nights and guests'''<br />
<br />
We can add selectors for the length of stay and number of guests as follows<br />
<br />
<FORM METHOD="POST" ACTION="https://www.beds24.com/booking2.php"><br />
<select name='fdate_date'><br />
<option value='1'>1</option><br />
<option value='2'>2</option><br />
<option value='3'>3</option><br />
<option value='4'>4</option><br />
<option value='5'>5</option><br />
<option value='6'>6</option><br />
<option value='7'>7</option><br />
<option value='8'>8</option><br />
<option value='9'>9</option><br />
<option value='10'>10</option><br />
<option value='11'>11</option><br />
<option value='12'>12</option><br />
<option value='13'>13</option><br />
<option value='14'>14</option><br />
<option value='15'>15</option><br />
<option value='16'>16</option><br />
<option value='17'>17</option><br />
<option value='18'>18</option><br />
<option value='19'>19</option><br />
<option value='20'>20</option><br />
<option value='21'>21</option> <br />
<option value='22'>22</option><br />
<option value='23'>23</option><br />
<option value='24'>24</option><br />
<option value='25'>25</option><br />
<option value='26'>26</option><br />
<option value='27'>27</option><br />
<option value='28'>28</option><br />
<option value='29'>29</option><br />
<option value='30'>30</option><br />
<option value='31'>31</option><br />
</select><br />
<select name='fdate_monthyear'><br />
<option value='2014-08'>Aug 2014</option><br />
<option value='2014-09'>Sep 2014</option><br />
<option value='2014-10'>Oct 2014</option><br />
<option value='2014-11'>Nov 2014</option><br />
<option value='2014-12'>Dec 2014</option><br />
<option value='2015-01'>Jan 2015</option><br />
<option value='2015-02'>Feb 2015</option><br />
<option value='2015-03'>Mar 2015</option><br />
<option value='2015-04'>Apr 2015</option><br />
<option value='2015-05'>May 2015</option><br />
<option value='2015-06'>Jun 2015</option><br />
<option value='2015-07'>Jul 2015</option><br />
<option value='2015-08'>Aug 2015</option><br />
<option value='2015-09'>Sep 2015</option><br />
<option value='2015-10'>Oct 2015</option><br />
<option value='2015-11'>Nov 2015</option><br />
<option value='2015-12'>Dec 2015</option><br />
<option value='2016-01'>Jan 2016</option><br />
<option value='2016-02'>Feb 2016</option><br />
<option value='2016-03'>Mar 2016</option><br />
<option value='2016-04'>Apr 2016</option><br />
<option value='2016-05'>May 2016</option><br />
<option value='2016-06'>Jun 2016</option><br />
<option value='2016-07'>Jul 2016</option><br />
</select><br />
<select name='numnight'><br />
<option value='1' selected>1</option><br />
<option value='2'>2</option><br />
<option value='3'>3</option><br />
<option value='4'>4</option><br />
<option value='5'>5</option><br />
<option value='6'>6</option><br />
<option value='7'>7</option><br />
<option value='8'>8</option><br />
<option value='9'>9</option><br />
<option value='10'>10</option><br />
<option value='11'>11</option><br />
<option value='12'>12</option><br />
<option value='13'>13</option><br />
<option value='14'>14</option><br />
<option value='15'>15</option><br />
<option value='16'>16</option><br />
<option value='17'>17</option><br />
<option value='18'>18</option><br />
<option value='19'>19</option><br />
<option value='20'>20</option><br />
<option value='21'>21</option><br />
<option value='22'>22</option><br />
<option value='23'>23</option><br />
<option value='24'>24</option><br />
<option value='25'>25</option><br />
<option value='26'>26</option><br />
<option value='27'>27</option><br />
<option value='28'>28</option><br />
<option value='29'>29</option><br />
<option value='30'>30</option><br />
<option value='31'>31</option><br />
</select><br />
<select name='numadult'><br />
<option value='1'>1</option><br />
<option value='2' selected>2</option><br />
<option value='3'>3</option><br />
<option value='4'>4</option><br />
<option value='5'>5</option><br />
<option value='6'>6</option><br />
<option value='7'>7</option><br />
<option value='8'>8</option><br />
</select><br />
<input type="hidden" name="propid" value="2035"><br />
<input type="submit" value="Book Now"><br />
</FORM><br />
<br />
<br />
== Widget for specific dates ==<br />
1. Customise widget, then generate code.<br />
<br />
[[Image:Custom-Widget1.png|600px|link=]]<br />
[[Media:Custom-Widget1.png|view large]]<br />
<br />
[[Image:Custom-Widget3.png|600px|link=]]<br />
[[Media:Custom-Widget3.png|view large]]<br />
<br />
<br />
2. The code consists of three parts. Identify the <script></script> and delete it.<br />
<br />
[[Image:Custom-Widget4.png|600px|link=]]<br />
[[Media:Custom-Widget4.png|view large]]<br />
<br />
3. Customise the content of the selects to only contain the dates you want to offer. In this example is for a booking strip for December 1st 2015 3 nights.<br />
You can also use a the [[Special_Rate_for_Agents_or_Referer|referer functions]] to apply special prices. Look for the referer in the widget code (in this example referer=BookingStrip) and replace it with your custom [[Special_Rate_for_Agents_or_Referer|referer code]].<br />
<br />
[[Image:Custom-Widget2.png|600px|link=]]<br />
[[Media:Custom-Widget2.png|view large]]<br />
<br />
<br />
4. Paste the code into the source code of your web site<br />
<br />
<nowiki><div style="color: #2f2f2f; font-size:14px; width: 100%; padding-top: 5px; padding-bottom: 5px; text-align: center; background: #339900; background: -moz-linear-gradient(top, #66cc00, #339900); background: -webkit-gradient(linear, left top, left bottom, from(#66cc00), to(#339900)); background: -webkit-linear-gradient(top, #66cc00, #339900); background: -o-linear-gradient(top, #66cc00, #339900); background: linear-gradient(top, #66cc00, #339900); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#66cc00', endColorstr='#339900');" class="b24bookingstrip"><form method='GET' target='_blank' action='https://www.beds24.com/booking.php' style='margin:0; padding:0;'><span style='padding-right: 10px; display: inline-block;'><a style='color: #2f2f2f;text-decoration:none;' target='_blank' href='https://www.beds24.com/booking.php?propid=3103&page=getdates&type=0&referer=BookingStrip'></a></span><span style='display: inline-block; padding-right: 10px;'><br />
<select id='fdate550775_date_propid3103' name='fdate_date' style='font-size:inherit; margin:0; padding:0;color: #2f2f2f'<option value='1'>1</option><br></select><br />
<select id='fdate550775_monthyear_propid3103' name='fdate_monthyear' style='font-size:inherit; margin:0; padding:0;color: #2f2f2f;'><br />
<option value='2016-12'>Dec 2016</option><br />
</select></span><br />
<div style='display:inline;'><span style='display: inline-block; padding-right: 10px;'><select name='numnight' style='font-size:inherit; margin:0; padding:0;color: #2f2f2f;'><br />
<option value='3'>3 Nights</option><br />
</select></span></div><span style='display: inline-block;'><input type='submit' name='subcheck' value='Book Now' style='font-size:inherit;color: #2f2f2f;'><input type='hidden' name='propid' value='3103'><input type='hidden' name='subgetdates' value='1'><br />
<input type='hidden' name='type' value='0'><input type='hidden' name='page' value='showprice'><input type='hidden' name='referer' value='BookingStrip'></span></form></div><br />
<br />
</nowiki><br />
Result:<br />
<br />
[[Image:Custom-Widget5.png|600px|link=]]<br />
[[Media:Custom-Widget5.png|view large]]<br />
<br />
== Create a booking form for a preselected room and dates ==<br />
Create a URL like this:<br />
<br />
https://www.beds24.com/booking2.php?propid=13434&checkin_hide=2016-11-24&numnight=2&numadult=1&br1-32906=Book<br />
<br />
You need to define:<br />
<br />
1) propid<br />
<br />
2) one of checkin or checkin_hide (different date formats)<br />
<br />
3) one of checkout, checkout_hide or numnight<br />
<br />
4) numadult and/or numchild<br />
<br />
5) br1-32906=Book where "br1 is offer 1, br2 is offer 2 etc. and 32906 is the room to book.<br />
<br />
== Redirect to your own property landing page ==<br />
<br />
You can do this with the menu Settings > Properties > Link <br />
<br />
Set "Booking Redirect" = Immediately<br />
<br />
Set "Booking Redirect Url" = your landing page for the property. The landing page can contain can iframe with the property booking page. If you do have an Iframe embedded make sure you do not set the number of nights or people in the URL.</div>
Beds24>Annette