SliderJS Installation Instructions

How to install the SliderJS component in a generic HTML website:

(WordPress installation steps below)

  1. Download the SliderJS component from the www.jstyler.net website.
  2. Unpack the SliderJS component, choose one of the demos included in the package and copy the 'SliderJS' folder located inside it into the root folder of your website.
  3. Include these following lines of html/javascript code into the <head> section of your website: <!-- jQuery and jQueryUI libraries -->
    <script type="text/javascript" src="SliderJS/libraries/jquery.min.js"></script>
    <script type="text/javascript" src="SliderJS/libraries/jquery-ui.min.js"></script>

    <!-- SliderJS script and SliderJS css -->
    <script type="text/javascript" src="SliderJS/js/SliderJS.js"></script>
    <link rel="stylesheet" type="text/css" href="SliderJS/css/SliderJS.css" />

    <!-- Launch the SliderJS component once the document has loaded -->
    <script type="text/javascript">
        $(document).ready(function() {
            $('#sliderjs').SliderJS({settingsFile: 'SliderJS/assets/settings/slidersettings.json'});
        });
    </script>
  4. Include this container element in the <body> section of your page wherever you want your SliderJS to be located: <div id="sliderjs">Hello World from Slider JS (http://www.jstyler.net)!</div>
  5. You should now be able to see the SliderJS component on your page. Launch the Administration Panel by ALT + right click (minimum PHP version required is 5.2) on the SliderJS component and change the default password. The default password is jstyleradmin.
  6. Your SliderJS component is now installed and ready to use! You can access the Administration Panel (ALT + right click) and make changes (images, text, styles etc.) to your component, directly from your page, any time you want!

How to install the SliderJS component in a WordPress website:

  1. Download the SliderJS component pack from the http://www.jstyler.net website.
  2. Unpack the SliderJS component, choose one of the demos included in the package and copy the 'SliderJS' folder located inside it into the plugins folder of your WordPress installation folder (\wp-content\plugins\).
  3. Access your WordPress site administration panel, go to the plugins page (Plugins -> Installed Plugins) and activate the jstyler SliderJS plugin.
  4. From the page/article editor of your WordPress site administration panel, add a shortcode for SliderJS component anywhere you want just by clicking the jstyler SliderJS button. Save the page/article and load it in your browser.
  5. You should now be able to see the SliderJS component where you included it. Launch the SliderJS Admin by ALT + right click on the SliderJS component and change the default password. The default password is jstyleradmin.
  6. Your SliderJS component is now installed and ready to use! You can access the Administration Panel (ALT + right click) and make changes (images, text, styles etc.) to your component, directly from your page, any time you want!

    Note that you can easily manage different versions of the SliderJS component from the jstyler SliderJS plugin's options page Settings -> jstyler SliderJS.