=== Slider WD === Contributors: webdorado Donate link: https://web-dorado.com/products/wordpress-slider-plugin.html Tags: best slider plugin, carousel, carousel slider, coin slider, content slider, content slideshow, custom video slider, flex slider, free video slider, free video slideshow, Horizontal slider, Image Rotator, image slider, image slideshow, javascript slider, javascript slideshow, jquery slider, jquery slideshow, Photo Slider, posts slider, responsive slider, responsive slideshow, sidebar, slide, slide show, slider, slider plugin, slider widget, slides, slideshow,slideshow manager, slideshow plugin, vertical slider, video slider, video slideshow,vimeo slideshow, vimeo slider, widget slider, widget slideshow, wordpress slider, wordpress slideshow, wp slider, youtube slider, youtube slideshow, post slider, fullscreen Slider, css3 slider, responsive image slider, banner slider, social slider, cycle slider, text slider, revolution slider, thumbnail slider, touch slider, sliders, parallax slider, 3D slider, coinslider, featured-content-slider, image, images, picture, pictures, picture slider, responsive, shortcode, widget, vertical slides, autoplay, auto, jquery, rotate, flexslider, gallery, photo gallery, javascript, rotator, wordpress picture slider, wordpress responsive slider, animation, best slider, fullwidth slider, mobile slider, swipe, layer, layer slider, product slider, mp3, video, embed media Requires at least: 3.4 Tested up to: 4.3 Stable tag: 1.1.4 License: GPLv2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Slider WD is a great tool for creating responsive sliders. It uses various transition effects. == Description == Create responsive, highly configurable sliders with various effects for your WordPress site. Download for FREE! https://www.youtube.com/watch?v=xebpM_-GwG0&index=1&list=PLnxWPiY5tLFWQf5XaEYYPZj0gdggUrVxP [WordPress Slider Plugin](http://web-dorado.com/products/wordpress-slider-plugin.html) [Demo](http://wpdemo.web-dorado.com/slider/) [Demo Admin](http://wpdemo.web-dorado.com/wp-admin/admin.php?page=sliders_wds) [User Manual](http://web-dorado.com/wordpress-slider-wd-guide-step-1.html) [Support Forum](http://web-dorado.com/forum/slider-plugin.html) [How to change and modify Slider WD Settings](https://www.youtube.com/watch?v=Peny_dkHaMo&list=PLnxWPiY5tLFWQf5XaEYYPZj0gdggUrVxP&index=3) Slider WD is an effective tool for adding responsive sliders to your website. The 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 product. The number of the slides for each slider is not limited. Various layers can be applied for each individual slide. 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. * 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 * 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 * Time setting feature for the effect changes * Right-click protection * 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 * 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 Upgrade to [WordPress Slider Pro](http://web-dorado.com/products/wordpress-slider-plugin.html) to add features: * 26 transition effects for Slider * 38 layer effects * Post Slides * Video Slide support (YouTube and Vimeo) * Dailymotion, Instagram and Flickr embed * Layers (text, image and media embed)- [Video Manual](https://www.youtube.com/watch?v=obnyK-Czf0k&list=PLnxWPiY5tLFWQf5XaEYYPZj0gdggUrVxP&index=2) * Social sharing buttons layer (Google+, Tumblr, Twitter, Pinterest and Facebook) * Hotspot layer * Filmstrip support * Navigation button/bullet styles * Parallax effect * Carousel effect * Video Slide and layer (mp4) * Slider Export/Import. ###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](http://web-dorado.com/forum/slider-plugin.html) in our website. If you do not find a solution here, do not hesitate to [click here to contact us](https://web-dorado.com/support/contact-us.html). ### Supported languages *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. * Afrikaans (af) Albanian (sq) Arabic (ar) Armenian (hy_AM) Belarusian (be_BY) Bulgarian (bg_BG) Catalan (ca) Chinese, Simplified (zh_CN) Croatian (hr) Czech (cs_CZ) Danish (da_DK) Dutch (nl_NL) Esperanto (eo_EO) Estonian (et) Finnish (fi) French (fr_FR) Galician (gl_ES) Georgian (ka_GE) German (de_DE) Greek (el) Hebrew (he_IL) Hindi (hi_IN) Hungarian (hu_HU) Indonesian (id_ID) Italian (it_IT) Japanese (ja) Korean (ko_KR) Latvian (lv) Lithuanian (lt_LT) Macedonian (mk_MK) Malay (ms_MY) Maltese (mt_MT) Norwegian (nb_NO) Persian (fa_IR) Polish (pl_PL) Portuguese (pt_PT) Russian (ru_RU) Romanian (ro_RO) Serbian (sr_RS) Slovak (sk_SK) Spanish (es_ES) Swedish (sv_SE) Tamil (ta) Thai (th) Turkish (tr_TR) Ukrainian (uk_UA) Vietnamese (vi) == Installation == #### Thank you for your interest in Slider WD. ### Minimum requirements. * Wordpress 3.0+ * PHP 5.x * MySQL 5.x ### Perform a new installation After downloading the ZIP file of the slider plugin, 1. Log in to the administrator panel. 2. Go to Plugins Add > New > Upload. 3. Click "Choose file" ("Browse") and select the downloaded zip file of the slider. *For Mac Users* *Go to your Downloads folder and locate the folder with the Slider WD. Right-click on the folder and select Compress. Now you have a newly created .zip file which can be installed as described here.* 4. Click "Install Now" button. 5. Click "Activate Plugin" button for activating the Slider WD. 6. If the installation does not succeed, please [click here to contact us](https://web-dorado.com/support/contact-us.html). == Screenshots == 1. Slider WD - Slider 1 2. Slider WD - Slider 2 3. Slider WD - Slider 3 4. Slider WD - Slides 5. Slider WD - File manager 6. Slider WD - Settings == Changelog == = 1.1.4 = * Fixed: File manager styles. * Fixed: Stay on current tab after save. = 1.1.3 = * Fixed: Shortcode puts in html tags for some themes. * Changed: Enlarge title container in admin. * Changed: Add slide button. * Fixed: Carousel load. = 1.1.2 = * Added: Smart crop. = 1.1.1 = * Fixed: Backend styles. * Fixed: Check all in add post popup. = 1.1.0 = * Changed: Backend design. * Changed: Responsive backend. = 1.0.50 = * Fixed: Border sizing problem with image wrap. = 1.0.49 = * Added: Shortcode support in text layers. = 1.0.48 = * Fixed: Controll buttons in sites with different site and admin urls. = 1.0.47 = * Added: Fixed background slider. = 1.0.46 = * Changed: Default uploader. = 1.0.45 = * Changed: Demo Sliders. = 1.0.44 = * Fixed: Video sliders export without videos and thumbnails. * Fixed: Single quote in css. * Changed: Loading styles. = 1.0.43 = * Added: Show thumbnail on bullets hover. * Fixed: First slide with single quotes in name. * Fixed: Video slide/layer export/import with featured image. * Fixed: Hide slider play /pause button on video slides. = 1.0.42 = * Added: Possibility to add font family. * Fixed: "Link the slide to:" option save. * Changed: No image, no video images. * Changed: Notices show order. = 1.0.41 = * Added: Video slide/layer. * Fixed: Line break in text, hotspot layer on export/import. = 1.0.40 = * Added: Swipe for filmstrip. * Added: Mousewheel and keyboard navigation methods. * Changed: Make touch navigation optional. = 1.0.39 = * Fixed: Flashing only on first transition during fade effect. = 1.0.38 = * Changed: Embed autoplay on slider autoplay. * Fixed: Embed video poster. * Changed: Featured plugins page. = 1.0.37 = * Added: Support/rate us messages. = 1.0.36 = * Changed: Filmstrip navigation arrows show on hover. = 1.0.35 = * Changed: Compability with Wordpress 4.3. * Changed: Filmstrip separator. * Changed: Message classes. = 1.0.34 = * Added: Google fonts. = 1.0.33 = * Added: Option to display bullets on hover. = 1.0.32 = * Added: Option for mouse swipe navigation. = 1.0.30 = * Fixed: Removed editor button from hotspot layer. * Added: Demo sliders page. = 1.0.29 = * Fixed: Multiple sliders in a page. = 1.0.28 = * Fixed: Embed slide as first slide. * Changed: Licensing page. = 1.0.27 = * New: Slider preview in admin. * Changed: Improved slide load. * Fixed: Play/pause button. = 1.0.26 = * New: Parallax effect. = 1.0.25 = * Fixed: security issue. * Changed: Manage buttons position. = 1.0.24 = * Changed: YouTube, Vimeo embed. * New: Instagram, Flickr and Dailymotion embed. = 1.0.23 = * New: Hotspot layer (pro version). = 1.2.22 = * New: Search by name in file manager. = 1.0.21 = * Changed: Featured plugins page. = 1.0.20 = * Fixed: Slider playback direction. = 1.0.19 = * Fixed: Slider width/height problem after Chrome update. * Fixed: Export. * Fixed: Carousel slider with one slide. = 1.0.18 = * Fixed: Conflict with some themes. = 1.0.17 = * New: Slider Export/Import. * Fixed: Delete slides whitout layers on slider delete. * Fixed: Image change effect in carousel views whith one image. * Fixed: Removed "There is no slider selected or the slider was deleted." error message for unpublished sliders. * Fixed: Carousel view after Chrome update(23.05.15). * Fixed: Activate first slide tab after slider duplication. * Fixed: Active bullet and filmstrip thumbnail in carousel view. = 1.0.16 = * Changed: Featured plugins page. * New: Featured themes page. = 1.0.15 = * Change links. = 1.0.14 = * Fixed: Disable enter key on text inputs. * New: Bulk add images by media uploader. = 1.0.13 = * Fixed: Image layer alt. * Fixed: Word break in Chrome. = 1.0.11 = * Fixed: Timer bar and bullets postion with horizontal filmstrip. * Fixed: Set watermark. = 1.0.10 = * Fixed: Slide change direction from 9 to 10. * Fixed: Layers with "Start with slide" option. = 1.0.9 = * Update licensing page = 1.0.8 = * New: Start with slide option. * New: Effect duration option. = 1.0.7 = * New: Circle timer. * New: Slider duplication. * Fixed: Disable swipe on navigation off. * Fixed: Layer click on 3D animations. = 1.0.6 = * custom play/pause buttons * slide duplication = 1.0.5 = * Image for Next / Previous buttons (Default, Custom, Styled) * Image for bullets (Default, Custom, Styled) = 1.0.4 = * stop on hover option * slide, text layer, image layer link open in a new window option = 1.0.3 = * single quota in image name (bug fixed) = 1.0.2 = * Turn SliderWD Media Upload * Ajax save * Images Bulk Add * Timer bar bug fixed * change shortcode button * fullwidth slider margin bug fixed = 1.0.1 = * User manual links added. = 1.0.0 = * Initial version. ==Wordpress Slider WD Step by step guide== = Step 1: Installing the Slider WD. = 1.1 Minimum requirements. * Wordpress 3.0+ * PHP 5.x * MySQL 5.x 1.2 Installation. 1. Log in to your WordPress Administrator panel. 2. Go to Plugins page, click Add > New > Upload. 3. Click "Choose file" ("Browse") and select the Sliders zip file. For Mac Users Go to your Downloads folder and locate the folder with the plugin. Right-click on the folder and select Compress. Now you have a newly created .zip file which can be installed as described here. 4. Click "Upload&Install" button. 5. Click "Activate Plugin" button for activating the plugin. If any problem occurs with Slider WD, please [click here to contact us](https://web-dorado.com/support/contact-us.html). = Step 2: Adding images to Sliders. = Go to Slider WD >Sliders > Add New. Slides tab will open up. As a first step you should specify the name of the slider. Slider Name. Provide a name for the slider. Below you will be able to add slides. 2.1 Published. Choose whether to publish the newly added slider or not. 2.2 Link the slide. You can set a redirection link, so that the user will get to the mentioned location upon hitting that specific slide. 2.3 Add image from Media Library. You can select images to use within the slider which are currently uploaded to your Media Library by clicking on those and pressing Insert button. In addition you can upload new files, navigating to Upload Files tab on the left. Then press Select Files button, choose the image and press Insert button. This way the image will be added to the slider. 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 slide. These layers can be of different or same type. 3.1 Add Text Layer. You can add custom text to be set as layer over the specific slide. Text. Provide the text which will be displayed over the slide 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 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 effect 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. 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. = 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 480x300 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. Upon hitting the bullet the slider image in the corresponding position will be displayed. 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 the 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. 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 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 left to switching to the next slide. This is commonly used when using autoplay for the slider. 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. Text * Watermark text. Provide the text which will be displayed over the slides. * Watermark font size. Specify the font size of the watermark in pixels. * 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 slider. The changes will override the original styles coming as default with the slider. 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 Slider within the Theme. You can insert the created Slider into the theme calling it with PHP function. This feature is commonly used for adding the 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.