Add a Picture Slider to the Booking Page: Difference between revisions

Jump to navigation Jump to search
Created page with "Category:How to Category:Booking Page '''Add a picture slider to show a gallery of pictures one at a time''' Beds24 supports flexslider 2 by http://www.woothemes.com..."
 
Replaced content with "Category:How to Category:Booking Page Note: This function in built into the responsive version of the booking page. Please see these Responsive_Booking_Page|..."
Tag: Replaced
 
(21 intermediate revisions by 2 users not shown)
Line 2: Line 2:
[[Category:Booking Page]]
[[Category:Booking Page]]


'''Add a picture slider to show a gallery of pictures one at a time'''


Beds24 supports flexslider 2 by http://www.woothemes.com/


The pictures can be uploaded to Beds24 using the PICTURES menu or hosted on your own server. Very Important is that they are hosted securely using https: if they are not security warning about insecure content will be shown in the browser.
Note: This function in built into the responsive version of the booking page. Please see these [[Responsive_Booking_Page|instructions]].
 
The slider can be shown in any position of the booking page which allows user HTML content.
 
 
'''Instructions'''
 
*Step 1
 
Copy the following to the "Insert in HTML <HEAD>" setting on the BOOKING PAGE >> ADVANCED menu.
 
<code>
<link rel="stylesheet" href="include/flexslider/2.0/flexslider.css" />
<script defer src="include/flexslider/2.0/jquery.flexslider-min.js"></script>
<script type="text/javascript">
$(window).load(function(){$('.flexslider').flexslider({animation: "slide", start: function(slider){$('body').removeClass('loading');}});});
</script>
</code>
 
You can change the flexslider javascript options, see http://flexslider.woothemes.com for more information about flexslider
Retrieved from "https://wiki.beds24.com/index.php/Add_a_Picture_Slider_to_the_Booking_Page"