WordPress Slider by Supsystic
Slider by Supsystic is a great way to create stunning image slider and video slider without programming skills. Plugin is fully responsive and works on any mobile devices.
[youtube
https://www.youtube.com/watch?v=lK_6w4IE044]
Using
Slider by Supsystic, you will be able to attract more people to your site and amaze them with effective slideshows, which display your images in a marvellous way. It is simple enough - just select images you would like to show and Slider by Supsystic will create responsive slideshow, slider with thumbnails or carousel slider.
If you have this slider plugin on your website, you will be able to upload large photo galleries there in one moment. It allows you to add both pictures and videos to the slider and customize the settings using different professional slider templates and options. All these things will help you to create a fascinating sliders for every visitor of your site.
Now impressive responsive slideshows can become a good addition to your WordPress site.
Install Slider by Supsystic and make visitors feel delighted by beautiful pictures from your photo and video sliders!
SEO optimized sliders can do a great job of getting the images and captions indexed well in the search engine. Fade, slide, rollover, slice everything you think is possible now with Slider by Supsystic plugin. We give high level of support for our users and are ready to help you out even with some custom implementations for slider.
Slider by Supsystic Support
If you have any problem, feature request or proposal for the Responsive Images Slider by Supsystic, please
let us know!
Slider Translations in Your Language
You have an incredible opportunity to get PRO version of the responsive
Slider plugin for FREE. All you need is to make translation of the Slider plugin! It will be amazing if you take advantage of this offer!
Available slider translations:
- 英文
- Chinese (China)
- 中文(台湾)
- Dutch
- 法语
- 德语
- Hebrew
- 印度尼西亚语
- 意大利
- Norwegian (Bokmål)
- Portuguese (Brazil)
- 俄语
- Spanish (Spain)
- 西班牙语(墨西哥)
- Spanish (Venezuela)
First time Slider by Supsystic user
Thank you for choosing image Slider by Supsystic! Open page of our plug-in admin panel WordPress and you will see three menu items: "New Slider", "Sliders" and "Settings".
In order to create your slideshow, simply click on "New Slider" in your left menu, then set the name of slider in popup window and click OK. When Slider by Supsystic page loads, set the options for your responsive slider - images width and height (images width can set in percent and in pixels), type of transition between slides etc. To add images to your Slider by Supsystic click on button "Add Images" and choose images from WordPress Media Library.
Don't forget to press the "Save" button. After all these points you can see the result, simply click on "Preview".
On the top of Properties you can see the shortcode. Copy and paste the shortcode into your post or page and Slider by Supsystic plugin will automatically create the slider on your page using the settings you choose above.
Important! Shortcode must be inserted in a text editor page, and not in the visual.
To install a slider plugin via FTP, you must
- Download the image slider plugin
- Unarchive the Slider by Supsystic plugin
- Copy the folder with slider plugin
- Open ftp \wp-content\plugins\
- Paste the plug-ins folder in the folder Slider by Supsystic
- Go to admin panel => open item "Plugins" => activate the slider plugin to enable carousel, postfeed, content sliders
How to Create a Slider in WordPress
Step 1: Creating
Slider by Supsystic
- On the left navigation menu click “New Slider”.
- Enter the name of slider.
-
Choose slider template. You have the ability to choose one of 6 amazing templates:
-
Bullets slider navigation
- Slideshow mode
- Thumbnails sldier navigation
- Post Feed slider (PRO feature)
- HTML sldier content (PRO feature)
- Video slider (PRO feature)
- Slider with Captions
- Import from Flickr, Tumblr and Facebook (PRO feature)
-
Slider Template Builder (PRO feature)
-
Click "OK" button.
On the next steps you can change slider template
Step 2: Adding images to the Responsive Slider
- Click on "Add Images" button.
- Choose images from WordPress Media Library - mark those images that you like or need. If there are no images that you need, click the Upload Files tab - here you can drop files anywhere to upload or select files from your computer.
- Click on “Choose Image” button.
-
Images will appear in the Media block at the left side. Here you can:
-
Add caption to image slider - it will be displayed on the caption effect of the slider.
- Attach links to image slider - it will go to the link when you click the image.
- Add SEO slider - tags for search requests.
- HTML slider - support of html-elements inside slides (Pro feature - only for Jssor slider)
Besides PRO version of slider plugin allows you to add
videos and
posts of your site to the slider.
To add videos to the slider click on "Add Video" button, then paste video URL and click "Import".
Slider by Supsystic supports such platforms as Youtube and Vimeo.
Possibility to add video you have only for BxSlider and Jssor slider.
In order to add pages and posts you need - select post / page from corresponding dropdown list at the "Select posts to show" block and click “Add post” / “Add page” button - it will appear at the "Posts and Pages" block.
This option is available only for coin and jssor sliders.
Step3: Editing of Image Slider settings
Firstly, you can change the plugin - simply click "Change slider" button, choose the another module and click "Change" button. But please note that current settings will be removed without ability to restore.
You can select one of 3 sliders:
- BxSlider - easy to use image slider plugin with built-in touch support.
- Coin Slider - slideshow plugin for creating slideshows with amazing transition effects.
- Jssor Slider (PRO feature) - touch swipe and responsive javascript image slider.
And secondly, let's start with the configuration of BxSlider.
The
BxSlider allows you -
- set the width and height of the image slider (width can be set in pixels or percent, and the height only in pixels);
- choose the mode of transition between slides - Horizontal,Vertical or Fade;
- enable the slideshow - auto navigation between slides;
- enable slideshow controls;
- select type of navigation between slides - standard or thumbnails (it is available, when pager option is enabled);
- enable displaying of the images caption;
- set the speed of slide transition in milliseconds;
- enable start of slider on a random slide;
- choose type of easing, which will be used during transitions of slideschoose type of easing, which will be used during transitions of slides;
- enable touch support - slider will allow touch swipe transitions;
- enable one-to-one touch option - non-fade slides will follow for the finger when you swipe it across the screen (available, when touch option is enabled);
- set the swipe threshold - amount of pixels of a touch swipe, which must be exceeded in order to execute a slide transition (only used if touch is enabled);
- enable pager - slider bullets navigation
- choose type of pager: Full - a pager link will be generated for each slide, or Short - a x/y pager will be used (ex. 1/5)
Also this slider has a unique PRO feature - a visual editor! To edit slider in visual mode - click "Builder" button. Here you can specify settings for -
- Slider Viewport
- Slider Caption
- Slideshow Buttons
With
Coin Slider slider you have the opportunity -
- set the width and height of the slider - only in pixels
- select one of the amazing transition effects of slides - you can choose between four types of transition effects: random, rain, swirl and straight;
- set the opacity of caption;
- enable pause mode, when mouse is over slider container;
- hide or show navigation controls of slider;
- show all images with their full size links
Jssor Slider slider - contains such features as
- Width and height of slider;
- Mode - type of transition between slides - Horizontal or Vertical;
- Arrows - a huge variety of arrows for navigation through slider, also you can disable it;
- Bullet slider control - includes a wide range of bullet points, you can enable this option in order to control the navigation of slides using bullet points;
- Responsive slider size - enable or disable auto resize of the slider. Useful if you need to use fixed width sliders;
- Thumbnails slider navigation - enable the navigation control with thumbnails of images, which is much simplify and speed up access to all images of the slider by supsystic;
- Slideshow - enable auto navigation between slides;
- Slideshow Speed;
- Select Shadow - choose one of the box shadow effects, which were first designed in Photoshop and then implemented using CSS3
[Swiper Slider] (
https://supsystic.com/documentation/swiper-slider/ "Swiper Slider") slider allows you -
- Customize width and height of slider;
- Enable Cyclically option and Mousewheel Control option;
- Set Pagination style;
- Choose one of fourth amazing slider effects;
- Select Arrows color;
- Try Slideshow viewing;
- Check all Advanced options.
Important! After changing the settings of slider plugin don’t forget to click “Save” button.
Step 4: Slider Preview settings
After you change some slider settings - with responsive
Slider by Supsystic, you can immediately see the result in a slider live preview. Simply click on "Preview" button and you will see your slider in a popup window.
Step 5: Displaying Slider WordPress Plugin on the website
Over the settings of slider you can see the shortcode.
Copy and paste the shortcode into your post or page and
Slider by Supsystic plugin will automatically create the slider on your page using the settings you choose above.
Important! Shortcode must be inserted in a text editor page, and not in the visual.
Our plugins