Hi guys this is a quick tutorial on how to add the One by One slider addon to your serif webplus project, the instructions are simple to follow, so we hope you have fun with the serif webplus addons that we have created for you.
You do not need to touch any of the scripts.
The first thing you need to do is download the widget from our serif addons page or click on the link below this tutorial, unzip or unrar the file to a folder of your choosing, you the need to click on the assets tab on the left hand side of your serif webplus window (see the image below), click on open and then add add it from the folder you saved our file in.
You then should see the red square with the name of the addon.
Click on the addon and then put it into your project, you should have a html fragment like below
Double click on the fragment to open it up this is where you will see the code so you can edit and make changes if you wish to do so.
Please note that the image above is to show you an example of what the widget looks like.
Hereis the basic functions of the slider
easeType: 'random', // options: random, rollIn, fadeIn, fadeInUp, fadeInDown, fadeInLeft, fadeInRight, fadeInRight, bounceIn, bounceInDown, bounceInUp, bounceInLeft, bounceInRight, rotateIn, rotateInDownLeft, rotateInDownRight, rotateInUpLeft, rotateInUpRight width: 980, height: 370, slideShowDelay: 3500, // 3.5 seconds slideShow: true
Changing the default images for your own.
click on files you will see a list of files, all the files have there own custom folders, image files are stored in the images folder, highlight the images and the delete, click on browse and add your own images, then click on export,clickon the images folder and then click ok.
Find the below code and change to your images
<a href="#"><img src="images/slider3_element_2.png" alt="img"
change the image file paths to your images files and then change the captions to what ever you want it to say
the animations are controlled by the animate.css file and the jquery.onebyone.css file you will have to export to disk folder to modify these
And that is it just save your project and preview it in a browser of your choice if your happy publish it to your domain.
Any problems let us know and we will try to help as much as we can.