How To Use

Get Started

Required Files And Folders

Please follow the instructions:

Please upload the assets folder to your server. You can find this folder in "Image Slideshow and Gallery" folder. In this folder you will find the following sub folders containing all of the items content:
- js
- css
- images
- fontawesome
If your carousel layout is placed in a different folder, don’t forget to change the file paths in the upcoming examples!
This step is very important, because product functionality depends on these files, so please first of all attach these files carefully. CSS in <head> section and JavaScript in <body> section:

<link href="assets/fontawesome/webfonts/fontawesome-all.min.css" rel="stylesheet" type="text/css">
<link href="assets/css/bootstrap.min.css" rel="stylesheet" media="all">
<link href="assets/css/bs4-image-slideshow-min.css" rel="stylesheet" media="all">
<link href="yourOwnStyleSheet.css" rel="stylesheet" media="all">
<script src="assets/js/jquery-3.3.1.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/jquery.touchSwipe.min.js"></script>
<script src="assets/js/bs4-image-slideshow-min.js"></script>

Or by using CDN

You can load Bootstrap and jQuery files with a single line of code from their official online sources. You don't even have to download or install anything!

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>

HTML Mark-up

After attaching all of the above files you will be able to attach HTML markup in your HTMl files where you want to use this plugin. We have prepared 72 HTML Mark-up Files. You can find these files in main Image Slideshow and Gallery folder

Now Please Follow the Instructions to use HTML Markup:

  
  1. Open HTML file that you want to use in a code editor such as Notepad++
  2. Copy all HTML code of <body> Section
     
	 From: <!-- Carousel Start -->
	 
	 To: <!-- Carousel End -->
  
  3. Paste this code in your own Project file

Parent Layouts Guide Line

Remember that the layouts those start with the words full-screen-parent must paste inside a parent then it will work. And before use Mark-up delete its parent first. Because we have created it temporary. These types of layouts take the width and height from their parents.

  
   <div style="width: 60%; height: 500px; margin: 50px auto;"></div>

Support

Please do not hesitate if you have any queries about this item. We are always there for your help. You can contact us on this e-mail address szthemes53@gmail.com