Scribd
Upload
112 views2 pages

README

This document provides instructions for adding an image slider to a website using the ImageSliderMaker tool. It explains that you need to extract the zip file, add the CSS, JavaScript and image files to your project directory, and paste the provided HTML markup into the body of your page. Step-by-step instructions are given for integrating the slider, including linking the necessary CSS and JS files, adding the slider HTML, and copying the included files and image folders to your project directory.

Uploaded by

Ryn Donn
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
112 views2 pages

README

This document provides instructions for adding an image slider to a website using the ImageSliderMaker tool. It explains that you need to extract the zip file, add the CSS, JavaScript and image files to your project directory, and paste the provided HTML markup into the body of your page. Step-by-step instructions are given for integrating the slider, including linking the necessary CSS and JS files, adding the slider HTML, and copying the included files and image folders to your project directory.

Uploaded by

Ryn Donn
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

Image Slider Maker README

=========================
ImageSliderMaker.com

Using in your website


---------------------

Please first make sure you have fully extracted the contents of the zip file.
In Windows, right-click on imageslidermaker.zip and select Extract All...

To get your slider working in your web page, you must add
my-slider.css, ism-2.2.min.js and the slide images to your project
directory and paste the markup (included below) into your HTML.

The directory structure of this package:

imageslidermaker/
README.txt
example.html
ism/
css/
my-slider.css
js/
ism-2.2.min.js
image/
slides/
_u/1550129471977_593202.jpg
_u/1550129466433_353696.jpg
_u/1550129456021_128393.jpeg
_u/1550129450780_62215.jpeg
_u/1550129415697_938716.jpg
_u/1550129392800_640565.jpeg

For a working example, open example.html in your web browser or


follow the instructions below to integrate the slider into your
project.

Step by step instructions


-------------------------

1. Paste the following into the head of your HTML file:

<link href="http://fonts.googleapis.com/css?family=Montserrat|Libre+Baskerville"
rel="stylesheet" type="text/css">
<link rel="stylesheet" href="ism/css/my-slider.css"/>
<script src="ism/js/ism-2.2.min.js"></script>

2. Paste this into the body of your HTML file (at the location where:
you would like your slider to appear in the page):

<div class="ism-slider" data-transition_type="fade" id="my-slider">


<ol>
<li>
<img src="ism/image/slides/_u/1550129471977_593202.jpg">
<div class="ism-caption ism-caption-0">Traveling</div>
</li>
<li>
<img src="ism/image/slides/_u/1550129466433_353696.jpg">
<div class="ism-caption ism-caption-0">Vacation</div>
</li>
<li>
<img src="ism/image/slides/_u/1550129456021_128393.jpeg">
<div class="ism-caption ism-caption-0">Peaceful View</div>
</li>
<li>
<img src="ism/image/slides/_u/1550129450780_62215.jpeg">
<div class="ism-caption ism-caption-0">Enjoy the the beautiful island</div>
</li>
<li>
<img src="ism/image/slides/_u/1550129415697_938716.jpg">
<div class="ism-caption ism-caption-0">We welcome you all to our beautiful
and different tourist spot here in our island</div>
</li>
<li>
<img src="ism/image/slides/_u/1550129392800_640565.jpeg">
<div class="ism-caption ism-caption-0">Sibuyan Island, Phillipines</div>
</li>
</ol>
</div>
<p class="ism-badge" id="my-slider-ism-badge"><a class="ism-link"
href="http://imageslidermaker.com" rel="nofollow">generated with ISM</a></p>

3. Copy the ism/ directory into the root directory of your project.

The css, js and image paths are relative, meaning the ism/
directory should be in the same directory (path) as your HTML
file containing the slider.

You might also like