Add a Picture Slider to the Booking Page: Difference between revisions
Jump to navigation
Jump to search
Markkinchin (talk | contribs) No edit summary |
Markkinchin (talk | contribs) No edit summary |
||
| Line 16: | Line 16: | ||
Copy and save the following script to the "Insert in HTML <HEAD>" setting on the BOOKING PAGE >> ADVANCED menu. | Copy and save the following script to the "Insert in HTML <HEAD>" setting on the BOOKING PAGE >> ADVANCED menu. | ||
<pre> | <pre> | ||
| Line 26: | Line 25: | ||
</pre> | </pre> | ||
You can change the flexslider javascript options, see http://flexslider.woothemes.com for more information about flexslider | |||
*Step 2 | |||
You can | Copy the following HTML to the position you want the slider to appear. It can be any HTML content setting area for the booking page. | ||
It is very important to enter the HTML using source mode of the built in editor otherwise the HTML may not save correctly. | |||
Change the SRC value of the IMG tags to the URL of pictures you want to display. | |||
If the pictures are hosted at Beds24 you will find the URL in the PICTURES menu. | |||
You can choose the number and order of the pictures. If the pictures are different sizes you can use WIDTH and HEIGHT settings in the image tags to standardise them. | |||
<pre> | |||
<div class="flexslider"> | |||
<ul class="slides"> | |||
<li><img src="" /></li> | |||
<li><img src="" /></li> | |||
<li><img src="" /></li> | |||
</ul> | |||
</div> | |||
</pre> | |||
The pictures will display individually without a slider in the control panel SETTING editor but should now be displaying properly in a slider on your booking page. | |||