Changes

[[Category:Booking_PageBooking Page]][[Category:How toBooking_Engine]][[Category:Wordpress]]<div class="heading">Developer Options</div> ''This page is about the menu {{#fas:cog}} (SETTINGS -) > BOOKING PAGE ENGINE -> DEVELOPERS''Code snippets for the booking page are available in SETTINGS-> PROPERTY BOOKING PAGE.> DEVELOPERS

The == Custom Text ==Any fixed text on the booking page can be embedded exchanged in a This page using an iframe or opened with a link or form. is about the menu {{#fas:cog}} (SETTINGS) > BOOKING ENGINE It > can be fully customised in SETTINGS->PROPERTY BOOKING PAGE. This > [[Customise_Booking_Page|page]] gives an overview. Additional options for developers are:DEVELOPER > "Custom Text"

*Any fixed text on For more information please read the booking page can be exchanged in SETTINGS->BOOKING PAGE ->DEVELOPERS "Custom Text"context help (?).

*<span class="" style="color: #f3e504; font-size: 250%;" >{{#fas:lightbulb}} </span> Custom CSS can be added in This page is about the menu {{#fas:cog}} (SETTINGS-) > BOOKING ENGINE > PROPERTY BOOKING PAGE ->DEVELOPERS > "Custom CSS"

=== Bigger Room Name === /*code for bigger room name*/ .at_roomnametext{ font-sizeTo see a list of CSS examples look into this document: 14px /*if you want the text even bigger use a higher number*/ }[[Custom_CSS|Custom CSS]]

=== Background Image =External CSS file ==To It is possible to make the booking page use a background image upload it to SETTINGS -> BOOKING PAGE -> PICTURES. Replace CSS file that you supply, you must host the CSS file on a secure web server (using https://www.beds24.com/pic/p0000/2049/04.jpg with the url of your uploaded picture).

/*code fo use an image as background*/ body { background-image:url(https://wwwTo do this you need to add the &cssfile parameter to the URL for the booking page, or for example the Iframe SRC.beds24.com/pic/p0000/2049/04.jpg); }

Go to this site and encode it:http:/*code for a shadow arround your booking page*/meyerweb.com/eric/tools/dencoder/

<nowiki>#</nowiki>bookingpage { -webkit-box-shadow:0 1px 2px rgba(0, 10, 10, 0.38); -moz-box-shadow:0 1px 2px rgba(0, 10, 10, 0.38); box-shadowAdd the resulting parameter to the booking page URL like this: 1px 1px 2px 1px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 10, 10, 0&cssfile=https%3A%2F%2Fyoursite%2Fpath%2Fyour.38); margin-bottom: 20px; }css

Your CSS file will be included. <span class="" style== Booking Page with Rounded Corners "color: #f3e504; font-size: 250%;" >{{#fas:lightbulb}} </span> The external stylesheet needs to be hosted on a secure site (Adaptive Booking Page Onlyhttps)===Add code in SETTINGS-> BOOKING PAGE -> DEVELOPERS "Custom CSS"to be accepted by the secure Beds24 booking page.

== Javascript ==Javascript can be entered in .bookingpagecentshide This page is about the menu {display{#fas:cog}} (SETTINGS)> BOOKING ENGINE > PROPERTY BOOKING PAGE > DEVELOPERS or in {{#fas:inline;cog}}(SETTINGS) >BOOKING ENGINE > MULTI BOOKING PAGE> DEVELOPER "Advanced HTML Settings"

=== Mark certain days of the week Redirects ===Example 1For example: Change this would cause property 1234 to open in the parent window (frame busting) when it's book button is clicked on the background color for Saturday multiple property page

<code><script>$(document).daySat ready(function(){color:$('#c44a2f !importantpropid1234 a').attr('target', '_parent');});</script></code>

exchange daySat by daySun, dayMon, dayTue, dayeWed, dayThu, dayFri to exchange <span style="color: #f3e504; font-size: 250%;" >{{#fas:lightbulb}} </span> Check the backgound color for other dayssettings under {{#fas:cog}} (SETTINGS) >BOOKING ENGINE > PROPERTY BOOKING PAGE > BEHAVIOUR before you add such a script.

Example 2: === Change the background color for Saturday title text ===Javascript to change the titletext.

<code><script>document.daysat {background-color:#ccc !importanttitle='your title';}</script></code>

exchange daysat by daysun, daymon, daytue, dayewed, daythu, dayfri === Change date format ===Javascript to exchange change the backgound color for other daysdate format.

<code><script>$(document).daysat ready(function(){border:1px solid #999999 !important;}

exchange daysat by daysun$('#inputcheckin').data('date-format', daymon'MMMM DD, daytue, dayewedYYYY');$('#inputcheckout').data('date-format', daythu'MMMM DD, dayfri to exchange the backgound color for other days.YYYY');})</script></code>

<code><script>window.onload =function() {$("[id^='ptdate']").text(function(i, t) {return t.split(' ').reverse().join(' ');})}; window.onunload = function(){};</script></code> === Change the first day of the week in the datepicker= Javascript ==* Javascript can be entered The start day of the week in SETTINGS->BOOKING PAGE ->DEVELOPERS"Advanced HTML Settings"the checkin and checkout selectors is set automatically based on the language selected by the guest, different languages have different standards for this.It is possible to override it on a per language basis.

*The [[<code><script>moment.updateLocale("en", { week:category{dow:API|API]] can be used to develop custom applications and solutions.1}});</script></code>

*The behavior of the booking page can be controlled with the following parameters passed in the URL or form. URL Parameters are always added in the format name=value. To separate them, the first parameter must have a ? before it and all following parameters must have an & before them. For example if you want to change the default for the numbers of night selector to 7 nights you change the link to your booking page from

https://www.beds24.com/booking2.php?propid=2047

https://www.beds24.com/booking2.php?propid=2047&numnight=7  Example: Make a booking page for selected rooms only Use the propid to open the page and add &hideroom=22543 to hide a room. You can hide multiple rooms by comma separating them. https://beds24.com/booking2.php?propid=2048&hideroom=3589,3588  '''Example: link to the booking page with dates pre populated:''' https://beds24.com/booking2.php?propid=13437&checkin=2017-8-24&numnight=3 exchange these values with your data: checkin=2017-8-24 - the date the guest wants to arrive &numnight=3 - the number of nights the guest wants to book  '''Example: Link to a booking form with dates and room pre populated:''' https://beds24.com/booking2.php?checkin=2017-8-24&numnight=3&numadult=2&numchild=0&br1-32919=Book&roomid=32919 exchange these values with your data: checkin=2017-8-24 - the date the guest wants to arrive &numnight=3 - the number of nights the guest wants to book &numadult=2 - number of adults &numchild=0 - number of children &br1-32919=Book - exchange 32919 with the room id the guest wants to book

'''Example: hide headerBooking form for a preselected room and dates'''

httpsCreate a URL like this://www.beds24.com/booking2.php?propid=2047

https://beds24.com/booking2.php?propid=13434&checkin_hide=2016-11-24&numnight=2&numadult=1&br1-32906=Book You need todefine: 1) propid 2) one of checkin or checkin_hide (different date formats)

Use 5) br1-32906=Book where "br1 is offer 1, br2 is offer 2 etc. and 32906 is the propid to open the page and add &hideroom=22543 room to hide a room. You can hide multiple rooms by comma separating thembook.

| https://www.beds24.com/booking.php || Path to booking page ||At the very minimum there must also be one of propid, roomid or ownerid parameter

| roomid advancedays || id number of room. days || The This will set the initial date to this many days in advance of today. Only applies the first time the page is opened. If advancedays is not used the initial date will open showing this roombe the current date. The first date with availability can be specified by setting advancedays to the value -1.

| propid checkin || id number of property. check-in full date || The page will open showing at this property. check-in date

| ownerid cssfile || id number of owner. encoded url || The External css file for inclusion in booking page will open showing all properties , the file must be available via a secure url (https) and rooms for this ownerthe url must be url encoded. (http://meyerweb.com/eric/tools/dencoder/)

| checkin cur || check-in full date AUD, CAD, EUR, GBP, NZD, USD, BGN, BRL, CHF, CNY, CZK, DKK, EEK, HKD, HRK, HUF, IDR, INR, JPY, KRW, MXN, MYR, NOK, PHP, PLN, RON, RUB, SEK, SGD, THB, TRY, VND, ZAR|| The Opens the page will open at this check-in date  |-| mobile=0 || desktop view || Display showing the currency converted. (responsive booking page in desktop viewonly)

| mobile=1 group || mobile view keyword || Display the booking page in mobile viewShow only properties that have this group keyword

| numnight hidefooter || number of nights yes, no || Initial value for Do not show the number property information at the bottom of nights selector the page

| numadult hideheader || number of adults yes, no || Initial value for Do not show the number property information at the top of adults selector the page. Do not use this option when using a "Full Width Slider".  

| numchild hideoffer || number of children 1,2,3,4 || Initial value for Do not show this offer on the number of children selectorbooking page, multiple id's can be specified with a comma separating them.

| width hideprop || page width in px property id || Useful for embedding Do not show this property on the booking page in an iframe of fixed size , multiple id's can be specified with a comma separating them.

| numdisplayed hideroom || number of nights with prices displayed room id || Only applies to price table pages, use Do not show this to reduce room on the number of nights for narrow designsbooking page, multiple id's can be specified with a comma separating them.

| referer invoicee || text integer ||This text Charges and payments will be recorded with any bookings originating from assigned to this widget allowing tracking of booking sourcesinvoicee ID.

| advancedays lang || number of days en (English), ar (Arabic), bg (Bulgarian), ca (Catalan), hr (Croatian), cs (Czech), da (Danish), de (German), el (Greek), es (Spanish), et (Estonian), fi (Finnish), fr (French), he (Hebrew), hu (Hungarian), hy (Armenian), id (Indonesian - Bahasa Indonesia), is (Icelandic), it (Italian), ja (Japanese), ko (Korean), lt (Lithuanian), lv (Latvian) mn (Mongolian), my (Burmese), nl (Dutch), no (Norwegian), pl (Polish), pt (Portuguese), ro (Romanian), ru (Russian), sk (Slovak), sl (Slovenian), sr (Serbian), sv (Swedish), th (Thai), tr (Turkish), vi (Vietnamese), zh (Chinese simplified), zt (Chinese traditional) || This will set Sets the initial date default language to this many days in advance of today. Only applies the first time open the booking page is opened. If advancedays is not used the initial date will be the first date with availability.(2013 new style booking pages only)

| hideheader maxprop ||yes, no number of properties || Do not show the property information at the top Show a maximum of this many properties based on the pagesort order. Additional properties are hidden. 

| hidefooter maxroom ||yes, no number of rooms || Do not Only show a maximum of this many rooms based on the property information at sort order. Additional rooms are hidden.  |-| mobile=1 || mobile view || Display the bottom of booking page in mobile view |-| mobile=0 || desktop view || Display the booking pagein desktop view

| lang numnight ||en (English), ca (Catalan), cs (Czech), da (Danish), de (German), number of nights el (Greek), || Initial value for the number of nights selector  |-| numadult es (Spanish), || number of adults fi (Finnish), || Initial value for the number of adults selector  |-| numchild fr (French), it (Italian), ja (Japanese), lt (Lithuanian), mn (Mongolian), my (Burmese), nl (Dutch), no (Norwegian), pl (Polish), pt (Portugese), ru (Russian), || number of children sk (Slovak), sl (Slovenian), sv (Swedish), th (Thai), tr (Turkish), zh (Chinese) || Sets the default language to open Initial value for the booking page. (2013 new style booking page only)number of children selector 

| hideprop numdisplayed ||property id number of nights with prices displayed || Do not show Only applies to price table pages, use this property on to reduce the booking page, multiple number of nights for narrow designs |-| nogroup || keyword || Exclude properties that have this group keyword  |-| ownerid || id's can be specified with a comma separating themnumber of owner. || The page will open showing all properties and rooms for this owner

| maxprop propid ||id number of properties property. || Show a maximum of The page will open showing this many properties based on the sort order. Additional properties are hiddenproperty.

| hideroom redirect ||room id encoded url || Do not show Redirect to this room on the booking pageurl, multiple id's can must start with http:// or https:// and be specified url encoded with a comma separating tool like http://meyerweb.com/eric/tools/dencoder/. The booking details are stored in session variables and will be available available to a booking page in an Iframe at your redirect URL as long as the Iframe is not overriding themin it's src url.

| maxroom referer ||number of rooms text || Only show a maximum This text will be recorded with any bookings originating from this widget allowing tracking of this many rooms based on the sort order. Additional rooms are hidden. booking sources

| hideoffer roomid ||1,2,3,4 id number of room. || Do not show The page will open showing this price row on the booking page, multiple id's can be specified with a comma separating themroom.

| cssfile toproom ||encoded url room always shown on the top of the bookingpage || External css file for inclusion in you can add mulitpel room IDs separated by a comma (resposive booking page, the file must be available via a secure url (https) and the url must be url encoded. (http://meyerweb.com/eric/tools/dencoder/only)

| cur voucher ||AUD, CAD, EUR, GBP, NZD, USD, BGN, BRL, CHF, CNY, CZK, DKK, EEK, HKD, HRK, HUF, IDR, INR, JPY, KRW, MXN, MYR, NOK, PHP, PLN, RON, RUB, SEK, SGD, THB, TRY, VND, ZARvoucher code || Opens the page showing Pre populates the currency converted. (responsive booking page only)discount voucher code

| redirect width ||encoded url page width in px || Redirect to this url, must start with http:// or https:// and be url encoded with a tool like http://meyerweb.com/eric/tools/dencoder/. The booking details are stored in session variables and will be available available to a Useful for embedding the booking page in an iFrame at your redirect URL as long as the iFrame is not overriding them in it's src url.Iframe of fixed size

 Code snippets for booking widgets are available in {{#fas:cog}} (SETTINGS->) BOOKING PAGE-ENGINE >BOOKING WIDGETS.

== External CSS file Custom Applications / API ==It We also have an API which allows developers to develop their own applications and solutions. The API functions are available at https://api.beds24.com The documentation is possible directly in the API.  To use the API you need to allow API access. Go to make This page is about the booking page use menu {{#fas:cog}} (SETTINGS) > ACCOUNT -> ACCOUNT ACCESS and allow API access. The API is available at https://api.beds24.com. The XML functions can be accessed with your Beds24 username and password. The JSON functions can be created with a CSS file that API and prop key which you supply, you must host set yourself in the Beds24 control panel This page is about the CSS file on a secure web server menu {{#fas:cog}} (using httpsSETTINGS) > ACCOUNT and This page is about the menu {{#fas:cog}} (SETTINGS).> PROPERTIES > ACCESS

To do this you need ==Skip to add Checkout Page from Beds24 Plugin Widget==You can bypass the &cssfile parameter booking page and redirect the widget directly to the URL for the booking checkout page, or for example the iframe SRC.by adding this parameter

For example if your css file is:https://yoursite/path/yourto the widget.css

Goto this site and encode it:http://meyerwebReplace xxxx with the room ID of the room you want to populate.com/eric/tools/dencoder/

Add == Create a website with the resulting parameter content in your Beds24 account ==We have an integration with Rezintel which allows users/developers to create a website with the booking page URL like this:&cssfile=https%3A%2F%2Fyoursite%2Fpath%2Fyourdata you have in Beds24.css

Your CSS file will be included. Note: The external stylesheet needs Go to be hosted on a secure site ([https) to be accepted by the secure Beds24 booking page://wiki.beds24.com/index.php/Rezintel_Website_Builder Website builder] for more details.