Wordpress plugins
Slider by WD – Responsive Slider for WordPress

Slider by WD – Responsive Slider for WordPress

Version : 1.1.91
Tested up to : 4.8.2
Number of download : 1132011
Author : WebDorado
Average rating : 4.5 / 5 on 171 votes 171 votes, 4.5 avg.rating

Screenshots

Slider by WD – Responsive Slider for WordPress
Slider by WD – Responsive Slider for WordPress
Slider by WD – Responsive Slider for WordPress
Slider by WD – Responsive Slider for WordPress

Slider WD Slider WD WordPress Plugin Create responsive, highly configurable wordpress sliders with various effects for your WordPress site. Download for FREE! WordPress Slider Plugin Demo Demo Admin User Manual Support Forum How to change and modify Slider WD Settings Slider WD is an effective tool for adding responsive slider to your website. The WordPress slider plugin can be added both as a widget and plugin, as well as be included in the theme for displaying the slider within the theme using PHP function. Slider WD allows adding both images and videos (currently supporting YouTube and Vimeo to be displayed as slider slides). The numerous transition effects and layer support enhance the functionality of the WordPress slider plugin. The number of the slides for each slider is not limited. Various layers can be applied for each individual responsive slides. There are three basic types of layers designed for the slides. Those are for sharing textual content, images and sharing buttons (Google+, Tumblr, Twitter, Pinterest and Facebook.) The slides can be used for redirection to another location. Similar feature is also available with the text and image layers of WordPress Slider plugin. Responsiveness Possibility of adding unlimited sliders and unlimited slides for each slider Three options for adding images (from Media Library, by Slider WD Media Upload option or by using image URL) Full-width slider support 5 transition effects for sliders Autoplay Shuffle Shortcode for easy insert of the slider into post/pages Possibility of changing the slide orders (using drag and drop feature) Possibility to provide titles for the slides Support for music playback (one track for entire slider) Time setting feature for the effect changes Right-click protection for avoiding slider image download Slider image changing possibility using bullets Possibility to change design for the bullets, navigation buttons Timer bar Support for watermarks Design customization for almost all features Custom CSS support for adding additional styling features to the slider (css3 slider options) Possibility to use Slider WD Media Upload for uploading multiple images at once Text and image watermarking possibility Option of opening the slider-related link within the same page Slide duplication Fixed background slider Slider widget Upgrade to WordPress Slider Pro to add features: 26 transition effects for Slider 38 layer effects Post Slides Video Slide support (YouTube slider and Vimeo slider) Dailymotion, Instagram and Flickr embed Layers (text, image and media embed)- Video Manual Social sharing buttons layer (Google+, Tumblr, Twitter, Pinterest and Facebook) Hotspot layer Filmstrip support Navigation button/bullet styles Parallax Slider Carousel Slider Video Slide and layer (mp4) Slider Export/Import. This wp slider plugin comes with a few demo sliders on its demo page, which are representing the main types of sliders supported by the plugin, whereas you can always enhance the plugin functionality combining slider types. The mentioned four types are Multi-Layer content Slider, 3D fullwidth Slider, Filmstrip Slider, Zoom Effect Slider. Let’s discuss each of these gallery slider types separately. Multi-layer content slider is designed for displaying content, image layer and social sharing layers over the slides. This type of sliders are most commonly used when you are trying to create a slider similar to one created with PowerPoint or other presentation and slider software. It can be easily turned into video slideshow. 3D fullwidth slider is designed for displaying full-size sliders on any of your website pages. It uses a special effect for shifting between slides creating a 3D effect. This slider takes the width of the page, where it’s included. Fullscreen slider can also be used. Filmstrip slider is designed for displaying small icons of the set of slides included in the slider, it is similar to a thumbnail slider This is especially useful, if you have large set of slides and do want the user to choose which slide of the slider start the showcase. In addition to this, you can use this type of slider as an alternative to gallery plugins, where the displayed image opens up in a larger lightbox, which is not as convenient. Zoom Effect slider is convenient, where you have small space but want to represent the main image and enlarged extract of it. Here the image gets zoomed without switching between slides of the slider. Each image and its extract are being included in a single slide. Thus this slider is more effective when used with HD images. If you don’t want to limit yourself with one of these types of sliders, then you can freely use a combination, e.g. have multi-layer slider with 3D effect or flimstrip slider with zoom effect. IMPORTANT: If you think you found a bug in Slider WD or have any problem/question concerning the plugin, please check out WordPress Slider Support Forum in our website. If you do not find a solution here, do not hesitate to click here to contact us. *If you need language of Slider WD which is not included in this list, please contact us and we will do the translation of Slider WD within 3 days. If you find any mistakes in the translation, please contact us and we will make relevant corrections within 3 days. * Slider WD Step by step guide Step 1: Installation of Slider WD plugin. 1.1 Minimal requirements. WordPress 3.4+ PHP 5.x MySQL 5.x 1.2 Installation. Log-in to your WordPress administrator panel. Select Plugins page from toolbar menu, click Add New. Search for Slider WD in the right-top search bar if you want to download the Free version or click Upload Plugin button > “Choose file” (“Browse”) and select the Sliders zip file if you are installing the Professional version of Slider WD. For Mac Users Go to your Downloads folder and locate the folder with the Slider WD. Right-click on the folder and select Compress. This will create a .zip file which can be installed as described below: Click “Upload & Install” button. Click “Activate Plugin” button for activating the plugin. If any problem occurs with installation of Slider WD, please let us know using “Contact Us” form. Step 2: Adding images to Sliders. Go to Slider WD > select Sliders > click Add New First of all specify the name of the slider in Slider Title field. Below that you will be able to add your new slides. 2.1 Published. Under the image you have just added, select YES whether you want to publish slide, so it will appear in your slider. 2.2 Link the slide. Next to Yes/No select under the slide, you will see an option “Link the slider to”. This option allows you to redirect users on click to another post/page or website. 2.3 Add image from Media Library. ou can upload images of your Media Library to the slider, by clicking “Add Images” button on the top of your working area. Otherwise, you may upload new files using the “Upload files” tab on the top-left side of your Media Library menu. 2.4 Add Image URL. You can also add images providing the absolute link to it. Press Add Image URL, provide the link and press Add button.This will be useful for adding images to the slider without the need of downloading those and uploading again. 2.5 Add Video. In addition to images, you can instead use videos withing the slider from YouTube and Vimeo. You should click on Add Video button, provide the link to the video and press Add button. The image associated with the YouTube/Vimeo video will be automatically displayed as a slider image and then the video will be played. 2.6 Remove. You can use Remove button to remove the slider image or video. For adding additional images, you should press “+” next to the Slide tab. The Slide tabs can be renamed to make it easier to reach the desired slide within the list, as well as they can be rearranged using drag and drop feature. Step 3: Adding layers to the slide. There are three types of layers that can be added to the slides: text, image and social button. The layer buttons are located on the lower left corner of each slide. You can add more than one layer to your content slideshow. These layers can be of different or same type. You can uses flexslider, cycleslider,css3slider all features, create social slider with social layers, add 3D effect to get Image Rotator or text rotate effects. Rotator feature will be no less interesting wit parallax slider (coinslider/flexslider) or vertical slides. 3.1 Add Text Layer. You can add custom text to be set as layer over the specific slide. This is specifically handy when it comes to testimonial slider or carousel slider options. Text. Provide the text which will be displayed over the slider image. Link. Provide an absolute URL to which the user will be redirected when pressing on the text layer. Position. Provide the values of x and y axis to position the text layer. In addition you can drag and drop the text layer to a desired position. Size. Define the font size of the text. Color. Select the text color for the text layer. Font family. Choose the font family for the text. Font weight. Choose the font weight for the text from the provided options. Effect in. Apply an effect to the process of putting the animations or layer over the slide. Start- Define the timing when to start the effect. Effect- Select the effect option from the drop-down list. Duration- Define the duration of the effect in ms. Effect out. Apply an effect to the process of taking the layer off the image. Start- Define the timing when to start the effect. Effect- Select the effect option from the drop-down list. Duration- Define the duration of the animation in ms. Padding. Using CSS type values set padding for the text. Background Color. Choose a background color for the text layer. Transparent. Specify the level of transparency for the layer. Border. Choose the border line width, type and color. Radius. Set a radius for the text layer using CSS type values. Shadow. Get a shadow for the text layer using CSS type values. Published. Choose whether to publish the layer or not. 3.2 Add Image Layer. You can add images of various dimensions to be set as layers. This is used when you plan to have photo slideshow, gallery, photo gallery or banner slider options. Dimensions. Set the dimensions of the image. Note that it will be best to select dimensions which correspond to the ratio of the original image, so that the image will not be distorted. Scale. By checking the box the image will be automatically scaled taking the provided width and keeping the original ratio of the image. Alt. Set the HTML attribute specified in the IMG tag to provide alternate text when an image on a Web page cannot be displayed. Link. Provide an absolute URL to which the user will be redirected when pressing on the image layer. Position. Provide the values of x and y axis to position the image layer. In addition you can drag and drop the layer to a desired position. Transparent. Define the level of transparency for the image layer. Effect in. Apply an effect to the process of putting the layer over the image. Start- Define the timing when to start the effect. Effect- Select the effect option from the drop-down list. Duration- Define the duration of the effect in ms. Effect out. Apply an effect to the process of taking the layer off the image. Start- Define the timing when to start the effect. Effect- Select the effect option from the drop-down list. Duration- Define the duration of the effect in ms. Border. Choose the border line width, type and color. Radius. Set a radius for the image layer using CSS type values. Shadow. Get a shadow for the image layer using CSS type values. Published. Choose whether to publish the layer or not. 3.3 Add Social Button Layer. You can add social media buttons to share the slider images over the popular social networking websites, selecting the relevant button types. Position. Provide the values of x and y axis to position the social button layer. In addition you can drag and drop the layer to a desired position. Social button. The button type can be chosen between Google +, Facebook, Twitter, Tumblr and Pinterest buttons. Size. Define the size of the added button. Transparent. Define the level of transparency for the social button. Effect in. Apply an effect to the process of putting the layer over the image. Start- Define the timing when to start the effect. Effect- Select the effect option from the drop-down list. Duration- Define the duration of the effect in ms. Effect out. Apply an effect to the process of taking the layer off the image. Start- Define the timing when to start the effect. Effect- Select the effect option from the drop-down list. Duration- Define the duration of the effect in ms. Color. Set the color for the social sharing button. Hover color. Set the color for the social sharing button when hovered. 3.4 Add Video Layer. You can add YouTube or Vimeo videos as video layers to created wordpress picture slider files. To do so, it is required to provide the link to the video and press Add button. Dimensions. Set the dimensions of the video layer thumbnail image with be used in slider. The thumbnail will appear with a default dimension, which can be further altered. Position. Provide the values of x and y axis to position the video thumbnail. In addition you can drag and drop the layer to a desired position. Effect in. Apply an effect which will be used when the video layer appears over the slider. Start- Set time for starting the effect on slider. Effect – Select the effect option from the drop-down list. Duration- Define the duration of the effect in ms. Effect out. Apply an effect which will be used when the video layer disappears from the slider. Start- Set time for starting the effect. Effect – Select the effect option from the drop-down list. Duration- Define the duration of the effect in ms. Autoplay. Choose whether to autoplay the video layer when the layer is added on the slider or not. Border. Choose the border line width, type and color. Radius. Set a radius for the video layer using CSS type values. Shadow. Get a shadow for the video layer using CSS type values. Published. Choose whether to publish the layer or not. Step 4: Changing/Modifying Slider Settings. To access the settings you should go to Slider WD>Sliders>Settings tab. 4.1 Global Settings. You can change the main settings here. The changes will affect only the current slider and not previously created sliders. That is to say the global settings are slider-based. Dimensions. Set the maximum dimensions of the slider. The dimension is set to maximum since with smaller displays the slider will be displayed in smaller dimensions due to the responsiveness feature. This will be the constant dimension of the slider regardless of the images. Full width. Choose whether to have the overall slider stretched to the full width of the page, where it is posted or not. The length will be given corresponding to the original ratio of the slider, e.g. if you have it set to 480×300 and the width of the page is 960, then the height of the slider will be 600. Background fit. There are three options for inserting the image into a slide. You can choose the relevant option best for you. If you have the image identical to the Dimensions section, then all three will provide the same full covered look of the slider. As for the cases, if the image is smaller/larger than the original one, the views will be a bit different. Let’s consider the cases. Cover. The image will get cut from the middle part and will get enlarged to fit the entire background. Fill. The image will get stretched or compressed to the dimensions of the slider. Contain. The image will stay in its original form and the rest of the slider content area will be covered by the slider background. Align. Set the alignment of the image within the slider. Effect. Select the slider transition effect which will be applied when shifting from one slider to another. Note, that it is different from the layer effects and does not affect the layer effects. Time Interval. Set the time interval for the change of the sliders. Autoplay. Choose whether to autoplay the sliders or not. Shuffle. Choose whether to have the slides change in a random manner or to keep the original sequence. Music. Choose whether to have music/audio track playback with the slider or not. Music URL. Provide the full link to the audio track, which will be used with the slider. Smart Load. Choose whether to have the smart load feature, which will help to have faster load for the first few images of the slider and will process the rest meanwhile. Background color. Select a background color for the slider, as well as its transparency level. Border. Set the border width, type, as well as the color for the slider. Border radius. Set the border radius using CSS type values. Margin. Set a margin for the slider in pixels. Shadow. Set a slider shadow using CSS type values. Right click protection. Choose whether to have right click protection for avoiding the slider image download of or not. Layer out on next. Choose whether to have the layer effect out regardless of the timing between the hit to the next slide or skip the effect out and get to the next slider image. Published. Choose whether to publish the mentioned slider or not. 4.2 Navigation. You can change the style, colors and dimensions for the navigation buttons or completely remove the navigation buttons from the slider. Next/ Previous buttons. Choose whether to display Previous and Next buttons within the slider or not. Next/ Previous buttons. Choose whether to display Play and Pause buttons within the slider or not. Show Navigation buttons. Select between the option of always displaying the navigation buttons or only when hovered. Next/ Previous buttons style. Choose the style of the button you prefer to have as navigation buttons for the slider. Next/ Previous buttons size. Set the dimensions for the right/left buttons of the slider. Play / Pause button size. Set the dimensions for the play/pause buttons of the slider. Buttons color. Select a color for the navigation buttons. Hover color. Select a hover color for the navigation buttons. Border . Select the type, size, as well as the color of border for the navigation buttons. Border radius. Set border radius for the navigation buttons using CSS type values. Background color. Select the background color for the navigation buttons using the color picker. In addition you can set the transparency level of the background for the slider. 4.3 Bullets. In addition to navigation buttons, you can also use bullets for the navigation within the slider images most likely used for the slideshow display of the slider. Upon hitting the bullet the slider image will be shifted to the next image in the slide show in the corresponding position. This turns the best slider plugin into slideshow manager. Slideshow plugin currently also uses lightbox option to display jquery slideshows in pop-up. This turns this revolutions slider into a great choice among wordpress slideshow, javascript slideshow and jquery slider options available in the market. Enable bullets. Choose whether to have slider naviagation bullets or not. Position. Select the position for the slider navigation bullets. Bullet style. Choose the style for the slider bullets from provided 5 options. Size. Define the size of the navigation bullets. Color. Select the color for the navigation bullets. Active color. Select the color for the bullet, which is currently displaying a corresponding slider image. Margin. Set the margin for the navigation bullets in pixels. 4.4 Filmstrip. You can add a filmstrip for this wordpress responsive slider images.This way the entire list of the slider images will be displayed and the user can navigate immidiately to the desired slider image. Note that in case of fullscreen slider and 3D slider options this will turn into more of thumbnail slider, since the image icons will be smaller. Enable filmstrip. Choose whether to have thumbnails of the slides displayed as a filmstrip or not. Position. Set the position of the filmstrip between 4 possible slides options. Thumbnail dimensions. Define the dimensions of the filmstrip thumbnails. Background color. Select the background color for the filmstrip. Thumbnail margin. Set the margin for the thumbnails in pixels. Active border. The thumbnail for the currently displayed image will have a border. You can set its size, type and color. Deactive transparency. You can set a transparency level for the inactive filmstrip items. 4.5 Timer Bar. You can add a bar displaying the timing sidebar left to switching to the next slide. This is commonly used when using autoplay for the slider, plus it kind of adds animation to product slider or posts slider (to get featured-content-slider) which are lacking active data. When the user presses next button the autoplay is being automatically disabled and auto change is being continued with the next slide. Enable timer bar. Choose whether to display a timer bar over the slider images or not. Type. Choose the type of the timer bar to be used within the slider. Size. Define the size of the timer bar in pixels. Color. Select the color and the transparency level of the timer bar. 4.6 Watermark. You can add watermark over the slider images both in the forms of text and images. Please note that the Fill and Contain options of the slider will work fine with Watermark option regardless of the slider image dimensions, whereas for the Cover option you should have the slider image identical to the size set in the Dimensions setting. If you have uploaded the image with another dimension, you will need to resize the image and upload it again. Watermark Type. Choose what kind of watermark you want to use with the slider from provided 2 options (text, image) or not to use watermarks over your slides. This is an alternative option for creating a copyright layer slider. Watermark layers allow keeping up the author rides for the images and any content filled in you responsive image slider. Text * Watermark text. Provide the text which will be displayed over the coin slider slides. * Watermark font size. Specify the font size of the watermark in pixels for the text slider. * Watermark font style. Specify the font family for the watermark text. * Watermark color. Select the watermark text font color, as well as the watermark transparency using CSS type values. * Watermark position. Choose the positioning of the watermark from the available 9 options. Image * Watermark URL. Provide the absolute URL of the image which will be used for the watermark. Please note that only .png images are supported. * Watermark image size. Define the size (in percentage for the responsive look) of the image used for the watermark. * Watermark position. Choose the positioning of the watermark from the available 9 options. 4.7 CSS. You can add custom CSS in the box below to apply custom changes to the css3 slider. The changes will override the original styles coming as default with the slider. Note that you should consider the fact that this is only applicable for content slideshow and jquery slideshow, custom video slider options such as youtube slider and vimeo slider cannot be used for this, since it is a video slider integration, we do not copy any content from external sources. Free video slider and free video slideshow options are also not included. Those come with pro version only. Step 5: Publishing the created Slider. To insert the Slider into a Page or a Post: You can insert the created Slider into a page or post. Go to the mentioned Post or Page. Here you will see “Insert Slider” button with a Slider icon. Press the button, Select the slider and press Insert. In addition, you can insert the shortcode of the slider manually. The corresponding shortcode is displayed next to the created slider in Slider WD>Sliders section under Shortcode column. To insert the Javascriipt Slider within the Theme. You can insert the created image slideshow Slider into the theme calling it with PHP function. This feature is commonly used for adding the javascript slider code to header.php for displaying the slider within the header position of the website. You can find the function located in Slider WD>Sliders section under PHP function column. To insert the Slider as a widget. Go to Appearance>Widgets>Slider. Select a position for the slider widget and press Save button. Then provide the title for the slider and select the corresponding slider using the drop-down list. The widget slider is ready to go. Note that youtube slideshow, vimeo slideshow and overall video slideshow are also supported with widget slideshow. 4.7 Carousel Slider. You can display the wp slider images in a carousel view, which displays a larger image within the center and descending size carousel images before and after the main image. Carousel. Choose whether to use carousel display of slider or not. Number of images for slider carousel. Define the number of visible images whenever using carousel slider. Carousel image ratio. Define the proportions between the main image and images preceding and following the main image on the slider. Container fit. If you activate the option the distance between the images will be identical so that the images fill the container, otherwise the distance between the images will depend on the ratio. Fixed Width. Define the maximum width of the slider display. Not that this feature is supported only for cases if you do not want to have fullwidth slider. Note that this is great when you have horizontal slider or vertical slider options. Step 5: Publishing the created Slider. To insert the Slider into a Page or a Post: You can insert the created Slider into a page or post. Go to the Post or Page. Here you will see “Insert Slider” button with a Slider icon. Press the button, Select the slider and press Insert. In addition, you can insert the shortcode manually. The corresponding shortcode is displayed next to the created slider in Slider WD>Sliders section under Shortcode column. To insert the Slider within the Theme. You can insert the created jquery slider into the theme calling it with PHP function. This feature is commonly used for adding the javascript code to header.php for displaying the slider within the header position of the website. You can find the function located in Slider WD>Sliders section under PHP function column. To insert the Slider as a widget. Go to Appearance>Widgets>Slider. Select a position for the slider widget and press Save button. Then provide the title for the slider and select the corresponding slider using the drop-down list. Note that as a result you wil get fully responsive image slider with responsive pictures and swipe opportunity for mobile slider (touch slider). Thus there is no difference if you choose to add it as a page shortcode of widget. Step 6: Importing/Exporting Sliders. If you plan to move the sliders from one site to another you can use this feature. Make sure that you have installed the Slider WD to the destination site. Exporting Slider Select the Slider you want to export using the checkbox and press Export slider button. You can choose whether to transfer the slider with pictures and settings, or only the settings of the picture slider adding your own slides afterwards. Importing Slider Select the file of the content slider/ image slider to import and press Import button. The slider will be added automatically. Try demo sliders DOWNLOAD LAYER SLIDER DOWNLOAD LAYER SLIDER 2 DOWNLOAD MULTY LAYER SLIDER DOWNLOAD NEWS SITE OR BLOG SLIDER DOWNLOAD POST FEED DEMO SLIDER DOWNLOAD ONLINE STORE SLIDER DOWNLOAD PORTFOLIO SLIDER DOWNLOAD 3D FULL-WIDTH SLIDER DOWNLOAD FILMSTRIP SLIDER DOWNLOAD ZOOM EFFECT SLIDER DOWNLOAD CAROUSEL SLIDER DOWNLOAD PARALLAX SLIDER DOWNLOAD HOTSPOT SLIDER DOWNLOAD VIDEO SLIDER SLIDER

Download now