Plugin / Slider by 10Web – Responsive Image Slider

Press Add Slides button below Slider Title to add an item to your banner rotator. You will access WordPress Media Library, which lets you use existing images or upload new media. Upload the images and videos you wish to add or browse items from WordPress Media Library. You can select a single item by clicking on it, or choose multiple by pressing and holding Shift or Control keys on your keyboard. After choosing the images and videos for your image carousel or cycle slider, press Add to Slider button. When the slides are added, you will be able to see the list of their thumbnails which help you to easily navigate through slides. Each thumbnail has its own set of buttons, which will become visible after hovering on an item: Edit. You can change the slide image, keeping its attributes (e.g. layers on slides, transitions). Copy. Pressing this button will create a duplicate of the current slide. The duplicate will be added as the last slide of your slideshow. Delete. You can delete the slide using this button. Furthermore, you are able to change the ordering of the slides by dragging the thumbnails and repositioning them. Make sure to Publish/Update your slideshow to keep the changes you made. You can also Preview the slider to check its appearance. Adding Images from URL In addition to uploading, embedding items and using WordPress posts, WordPress Slider plugin allows to insert images using their absolute links. To do this, press Add Slides button and navigate to Insert from URL tab. This section of the toolbox provides an input, where you just need to add the absolute URL of an image. The link needs to have the following structure: https://example.com/complete-file-path/image.jpg After providing the URL of the slide image, click Add to Slider button. Using WD Media Uploader Besides using default Media Library, WordPress Slider plugin has an advanced WD Uploader for adding or editing slides. This is a powerful and user-friendly tool which allows you to upload and manage images, separate them into folders, and more. To access WD Uploader, firstly, you need to enable it from Global Options of Slider by 10Web plugin. Go to Slider by 10Web > Options page and set Enable WD Media Uploader setting to Yes. Afterwards, edit your slideshow and click on Add Slides button. Navigate to WD Media Uploader tab to start adding new images. This dashboard includes a set of options which we will describe one by one.

Slider by 10Web plugin also lets you embed media from various platforms, such as YouTube and Vimeo. To use this feature, press Add Slides button then click on Embed Media tab. Use the input bar above to add the URL of the image or video you wish to add, then press Add to slider button. You can import items from the following websites: * YouTube, * Vimeo, * Instagram, * Flickr, * Dailymotion. For instance, when adding a YouTube video as a slideshow item, you just need to provide its link. This lets you create a modern-looking fullscreen slider with videos, that showcase your products, business or services.

Use CSS tab of Slider Settings to write additional CSS code and apply custom styles to the slider. Note, that these changes will override the original styles of the slider. Also, you can edit its Settings by enabling different attributes and configuring corresponding features. For instance, you can enable slide vertical animation effect and turn your slideshow into a vertical slider. These vertical slides look especially nice, when you are displaying professional photographs. However, you are able to use all slide effects both on images and videos.

To publish your slideshow on a widget area, navigate to Appearance > Widgets page. All widgets on your website and widget areas provided by your theme are available on this dashboard. Look for Slider by 10Web widget, then drag it to the widget area where you wish to display the slideshow. Write a Title for the widget and choose any slideshow using Select Slider drop-down menu. Press Save and the slider will appear on this widget area immediately.

WordPress slider plugin provides powerful layer options, which help you enhance the display of your slideshow. This section of Slider by 10Web user guide will help you add them to your slides and fully customize them. The plugin is tuned up with the following types of layers, which can be added to each slide multiple times: Text, allowing you to display a text block on your slides, Image, which lets you place an image layer over the slide background image, Video, which you can use to add a self-hosted video on the slide, Media Embed, that adds Youtube, Vimeo, Instagram, Flickr, and Dailymotion media as slide layer, Social Buttons, letting you place Facebook, Google+, Twitter, Pinterest, and Tumblr share buttons on your slides, Hotspot, which adds an animating spot to slide. It displays additional text, when users hover the hotspot, and you can also add an onclick link to it. Click on a slide you wish to edit, and the layer buttons will appear under the main image. Press the one you wish to add to the selected slide, and let’s begin customizing its settings. After a layer is added, a new toolbox becomes available, providing various customization options. Using the top bar, you can: * reorder the layer using drag-and-drop feature, * edit the title of the layer, * delete or copy it, * change its order number. Click on the gray bar to expand and edit all options of the layer. This section of user-friendly tools allows to fully personalize each layer. You are able to implement modifications such as: specify the dimensions of layers, set their positions on slides, configure slide in and slide out animations effects, modify their color, font style, transparency, add unique classes for layers, set links on each layer, configure various on-click actions, such as playing/pausing slideshow, and much more. It is important to note, that Slider by 10Web plugin also allows you to reposition layers by dragging them around on the slide itself.

To save lots of time, WordPress slider plugin provides its Import/Export feature, letting you move created sliders from one site to another. With just a few clicks, you can have all slideshows uploaded and built on your second website. Prior to transferring the sliders, make sure to install Slider by 10Web to the destination site. Let’s begin discussing exporting and importing options. Exporting Sliders Navigate to Slider by 10Web > Sliders page to export slideshows. Mark the sliders you would like to export, then select Export option from Bulk Actions. Afterwards, press Apply button and sliders will start downloading immediately. You can choose to transfer the slider with images and settings, or alternatively, just export the settings and add your own slides afterwards. Importing Sliders To import the downloaded sliders, go to Slider by 10Web > Import page first. Use Choose File button to browse the exported slider. Select the file, afterwards, click Import button. The slider will be added automatically. You can also import slideshows from Demo site and import them to your website. Just press the Download button below each slider, and follow the steps described above.

To insert your slider into a page or post, add or edit the post/page where you wish to showcase the slideshow. Above the content editor, there is a button titled Add Slider by 10Web. All you need to do is to press this button, choose a slideshow using Select a Slider drop-down menu, then click Insert. The shortcode of your slideshow, e.g. [wds id=”2″], will be added to the content of the page/post you are editing. In addition, you can add the shortcode manually by copying it from Slider by 10Web > Sliders page. Each slider shortcode is displayed next to the corresponding item, under Shortcode column.

WordPress Slider plugin comes with a set of useful options which allow you to customize each slideshow independently. Having configured slideshows separately, you can publish multiple sliders on your website, each with its own unique design and purpose. Navigate to Settings tab of your slider to begin configuring its options. This toolbox consists of the following sections, each providing its own pack of user-friendly options. Global Global tab of Slider Settings includes general options for the slider. You can personalize the way your slider behaves and shows. You can: * modify its display type and dimensions, * set animation effect and its duration, * specify slider looping and shuffling settings, * change slideshow behavior on desktop and mobile devices, * set music to play along with the slider, * enable parallax effect for the slider, and much more. Carousel Have your slideshow appearing in Carousel mode by activating it from Carousel tab of Slider Settings. With these options, you can personalize the display of your slider carousel. You are able to: * change the number of images shown on carousel, * set the ratio of carousel image dimensions (width divided by height), * edit the styles of carousel background image, and more. Navigation Completely customize the way your slider navigates using the tools provided in Navigation section of Slider Settings. You are able to switch on: * mouse-click navigation (Next/Previous buttons), * mouse-swipe and mouse-wheel navigation, * touch-swipe navigation on mobile devices, * keyboard navigation with next/previous keys, * on-slider Play / Pause buttons, * as well as activate navigation buttons for your slider and style every attribute as you wish. Bullets Place bullets on your slider by activating them from this section. This feature lets users to easily navigate from one slide to another in a random sequence. This set of options lets you: * select to show bullets on hover or always, * set the position of slider bullets, * choose color, size and margin for them, * customize the bullets by uploading your own images, and more. Filmstrip Display a nifty filmstrip of slide thumbnails along with your slider. This is a neat way to showcase miniatures of your slides before users click to view their larger versions. You can customize the filmstrip by: * changing its position on the slider, * setting background color and inactive thumbnail transparency, * specify thumbnail dimensions and separator size, * customize the border of the active thumbnail. Timer bar Activating Timer bar lets you have a neat loading bar with each slide. The loading bar starts every time a slide displays, and ends when the slideshow switches to the next image during autoplay. You can customize the type of the Timer bar, as well as its size, color and transparency. Watermark You are able to add watermark to the main images of your slider with the options Watermark section provides. Choose the type of the watermark, text or image, then configure settings such as: * providing watermark text or image URL, * specifying font size, font style and color of watermark text. * setting the size of the watermark image, and select the position of the watermark. * Press Set Watermark to add the watermark text or image to main images of your slider. To remove it, simply click on Reset Watermark button.

Yes, you can create unlimited number of sliders with unlimited amount of slides. Then you may paste corresponding slider code within each page.The slider shortcodes are listed next to the slider in Slider by 10Web > Slider section.

In case you use custom PHP templates and would like to display your slideshow on these pages, you can use PHP function Slider by 10Web plugin provides. You just need to add the function, e.g.: into the necessary .php file. For instance, if you wish to display the slideshow along with the header, simply add the code to header.php file of your website theme. You can find the function and copy it from Slider by 10Web > Sliders page, under PHP function column.

You are able to add watermark to the main images of your slider with the options Slider Settings > Watermark section provides. Choose the type of the watermark, text or image, then configure settings such as: providing watermark text or image URL, specifying font size, font style and color of watermark text. setting the size of the watermark image, and select the position of the watermark. Press Set Watermark to add the watermark text or image to main images of your slider. To remove it, simply click on Reset Watermark button.

Slider by 10Web does support Google Fonts. This allows you to custom text layer over slides using the provided big variety of Google Fonts. You can change the fonts of a layer by editing it. Look for Font family option to enable Google Fonts, then select the font family you wish to use.

This free slider plugin can be used for showcasing your portfoliow with the help of: * Image slider, * video slider (specifically vimeo slider, youtube slider, HTML5 slider), * post slider, * product slider, * photo slider / gallery slider, * carousel slider and more. Thes content slider options are the most commonly used applications of the best slider plugin, but those can be expanded to meet the needs. You can combine images into multi-layer content with videos and carousel slideshow effect or display video layers.

The plugin allows embedding WordPress posts making it a great WordPress Posts slider with various functionality and content slideshow. This is also useful in case you wish to have a product slider. You can add your products as posts and display them on your slideshow. Moreover, it can be turned into custom post types slider or a content slider with various layers, images and animations. This will help to create product carousel/image carousel with ecommerce plugins or photo slideshow with gallery plugin and even more. The good part of this is that you can have a text slider with its picture slide, while keeping up with responsive post slider if compared with other post slider or banner slider plugins. This image slideshow plugin has all the necessary features for creating various kinds of wonderful CSS3 slider.

You can post a redirection link on the image, allowing the user to get to the mentioned post or page upon clicking on the slide. Please note, that with this WordPress responsive slider plugin, you need to use http:// and https:// for external links.

Watermark may not work because of the following reasons: If you add slider images by embedding them from an external link, If your GD2 library is switched off on your server, If the image you have uploaded is larger than the slider dimensions you have set in settings. The last point means that if you have placed the watermark on the angles of the image, it will not be visible because the slider image will be cut off. So, please try the following: * Make sure to upload images in slider plugin, instead of embedding it from an external URL, * make sure to have your server’s GD2 library on, * resize the slideshow images and set the same dimensions as in Slider Settings before uploading. If you post a watermark on the slider plugin and it does not appear on the image, you can check the watermark position firstly. Please open Slide Options section, and use Fillmode to change the appearance of the slide background. By changing the fillmode option, you can see in which mode the watermark looks good on WordPress responsive slider images.

Premium version of Slider by 10Web plugin allows you to place social media layers. Under each image of your slider, you’ll see Add Social Media Button Layer button. Press it to add to your slide. You also are able to customize these buttons using layer settings.

You can add your own custom navigation images instead of buttons in WordPress responsive slider plugin. You can also manage default buttons by customizing sizes, colors, border and background colors. To add custom buttons in slider plugin please enter Settings > Navigation section and find Image for next / previous buttons. Select Custom and upload images for each button.

Slider plugin lets you use the same text layer, image layer, video layer for all slider images. After adding the layer, you can mark the Static layer option and the layer will be visible on all slides.

The plugin takes the full width of the widget area if the Boxed Layout in Slider Settings is checked. Please note that the option you can find in the Global Options section, rather than in the widget settings.