Changes

Jump to navigation Jump to search

Category:Widgets

3,654 bytes added, 15:15, 6 June 2017
no edit summary
[[Category:Booking_Page_and_Widgets]]
[[Category:Booking_Page]]
This page is about the menu SETTINGS -> BOOKING PAGE->BOOKING WIDGETS
The booking widget links your website to your online booking systems [[:Category:Booking Page|Booking Page]] letting your guests see your availabilty and make a booking. You can create your own widget using the link to your booking page or place one of the widgets or availability calendars Beds24 supplies on your website.
You find ''This page is about the widgets unter menu SETTINGS -> BOOKING PAGE-> BOOKING WIDGETS''__TOC__The widget designer allow you to create a booking widget which you can embed into the html of your website.
All our widgets can be customised == Generate a widget using the widget designer ==*Choose the widget you want to suit generate. *Customise the style of settings you want to adjust. *Click on "Refresh" to see a preview.*Click on "Get Code" and copy the provided code snippet.*Go go the page on your websiteweb site where you want to add the widget and paste it into the HTML. If you do not know how to do this check the help for the CMS or sitebuilder you are using how to add HTML to your site or ask your web desginer to do this for you.
You can use multiple widgets on multiple websites, blogs etc.=== If you do not have JQuery ===
If you do not have jQuery and jQueryUI installed on your web page add the following to the <head> section of your page.
Choose from the menu and use the selector to determine what the widget should <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <link torel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1. Depending what you want to show you have the choice of12.1/themes/smoothness/jquery-ui.css"> <script src="https: //ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
'''Room Widgets'''*=== Advanced functions for individual rooms showing just this room go to Properties open the room you want to set up developers and then go to Widgets. When you use these widgets a guest can only see/book this room.web designers ===Required skills: HTML, CSS
'''Property Widgets'''*for a property showing all the rooms in a property go to Properties open the property you want to You can manually set up parameters and then go to Widgetsapply your own CSS. When If you want to apply your own CSS use these widgets a guest can can see all rooms developer tools to identify the classes in this propertythe widget.
'''Multiple Property and Agency Widgets'''*if you Parameters are a host with multiple properties or an association showing all properties and rooms in your account. When you use these widgets a guest can see all rooms in all properties.:
{| class="wikitable"| '''Install Widgets on your Web SiteParameter''' || '''Values''' ||'''Description'''
To install |-| alignment || left right center || alignment of the widget, copy the supplied content|-| backgroundColor || hex code from the white box to the place in your page source you want the item to appear. These widgets are samples, you are allowed to modify them as you like to create your own booking links, buttons, forms etc./any valid CSS|| widget background color
You will need the ability to edit the HTML of your page. This may involve knowing the passwords for your web server and the ability to transfer your files. Your web hosting service should be able to provide information and assist you with this.|-| borderColor || hex code/any valid CSS || widget border color
If you are using '''Wordpress''' you install |-| boxShadow || true false|| shadow around the Beds24 Wordpress plugin. This will allow you to easily install widgets using shortcodes.widget
|-| buttonBackgroundColor || hex code/any valid CSS || button background color |-| buttonColor Note:|| hex code/any valid CSS || button text color |-| buttonTitle || text || button text|- Your website | color || hex code/any valid CSS (e|| text color |-| dateFormat|| refer to http://api.gjqueryui. Wordpress theme CSS) might override com/datepicker || formate of displayed dates |-| dateSelection|| 0 = check-in only 1= check in and check out 2 = check in and number of nights 3 = check in and check out and number of nights || type of date selection |-| dayNamesMin|| ["SO", "MO", "DI", "MI", "DO", "FR", "SA"]|| headings for the CSS days of week |-| defaultNightsAdvance|| number 0 = today|| how many days in advance are shown |-| defaultNumNight|| number 0 = today|| preselection for the booking widgets. number ob booked nights |-| excludeGroup || text || group of properties not to include |-| fontSize || px percentage || text size |-| formAction || text To fix display problems with ||text for the action parameter of the form|-| formTarget || valid HTML ||text for the target parameter of the booking strip try addingform |-| includeGroup || text|| group of properties to include |-| numChild || number || default number of children |-| numAdult || || default number of adults |-| ownerid || id number of owner. || The page will open showing all properties and rooms for this owner |-| peopleSelection|| 0 = none 1 = guests 2= adults and children || selection number of guests |-| propid || id number of property.b24bookingstrip select|| The page will open showing this property |-| referer || text ||this text will be recorded with any bookings originating from this widget allowing tracking of booking sources |-| roomid || id number of room || The page will open showing this room|-| showLabels || true false || display of labels |-| weekFirstDay|| 0 = Sunday 1 = Monday 2 = Tuesday 3 = Wednesday 4 = Thursday 5 = Friday 6 = Saturday || first day of the week |-| widgetLang || language parameter as shown here: [[Developers] || languages |-| widgetTitle || text || title of the widget |-| widgetType ||BookingBox BookingBoxMini BookingStrip AvailabilityCalendar|| type of widget |-| width || px percentage || width of the widget|}  '''Availability Calendar only'''{| class="wikitable"| '''Parameter''' || '''Values''' ||'''Description'''|-| availableBackgroundColor || hex code/any valid CSS || background color of available dates|-| availableColor || hex code/any valid CSS || text color of available dates|-| numMonth || number || number of calendars |-| pastBackbroundColor || hex code/any valid CSS|| background color of past dates|-| pastColor || hex code/any valid CSS || text color of past dates |-| requestBackgroundColor || hex code/any valid CSS || background color of request dates |-| requestColor || hex code/any valid CSS || text color of request dates |-| unavailableBackgroundColor || hex code/any valid CSS || background color of unavailable dates |-| unavailableColor || hex code/any valid CSS || text color of unavailable dates |}  '''Multiple property search only'''{width: auto;| class="wikitable"| '''Parameter''' || '''Values''' ||'''Description'''|-|searchShow ||hide, show ||Seach criteria open with link or are always visible|-| searchLinkText ||text ||Text of the link which opens the search criteria|- |== Other widgets ==*Code to embed your booking page as an Iframe into your web site can be generated under SETTINGS -> BOOKING PAGE->BOOKING WIDGETS->EMBEDDED IFRAME*A link to your booking page can be generated under SETTINGS -> BOOKING PAGE->BOOKING WIDGETS->LINKS*An URL linking to the custom CSS of your Wordpress booking pagecan be generated under SETTINGS -> BOOKING PAGE->BOOKING WIDGETS->QUICK URL*A button can be generated under SETTINGS -> BOOKING PAGE->BOOKING WIDGETS->BOOKING BUTTON*Code for an enquiry form generated under SETTINGS -> BOOKING PAGE->BOOKING WIDGETS->ENQUIRY FORM  Previous versions of the widgets are not supported any longer. If you want to use old versions you can access the menu pages via these links:*[https://beds24.com/control2.php?pagetype=widgetcalendar Availability Calendar]*[https://beds24.com/control2.php?pagetype=widgetstrip Booking Strip]*[https://beds24.com/control2.php?pagetype=widgetbox Booking Box]

Navigation menu