Fluid Responsive Slideshow

Fluid Responsive Slideshow / image slider is a wordpress plugin that enable you to put slideshow easily into a post, page, or template. The slideshow is designed to fluid and responsive with the display / devices resolution, so it will always look nice when it open in Desktop, tablet, ipad, or iphone.

The premium skin pack contain 15+ skins in multiple color combination ( In total there is 70 skins ).

How it work

Feature

Slideshow Management

Manage your slideshow easily as you manage your post / page, with easily drag and drop reordering each slide. Each slide has a slide type that unite two or more slide to become a complete slideshow.

Responsive Slideshow

The slideshow is designed to fluid and responsive with the display / devices resolution, so it will always look nice when it open in Desktop, tablet, ipad, or iphone.

Complete Options

Make your own unique slideshow with dozen customizable options: slideshow skin, text box color and position, action button, slideshow size, animation type, mouse behaviour, custom CSS, and so much more!

Premium Feature

Awesome Slideshow Skin

With the premium version you will unlock the awesome extra skins features. The premium version come with 50+ predefined slideshow skin that you can choose.

Fine Tuning Button Skin

The premium version also come with 20+ predefined theme button that you can choose.

Priority Support

Use our support forum to solve your problem if you ever have using the plugin. Premium buyer wil get priority support on the forum.

Money Back Guarantee

We believe that we have crafted the best available tools for your needs. And if you don’t feel satisfied within 14 days of your purchase you can get 100% refund of your money
- No Question Asked

Do you want get all the benefit FRS ?

Get FRS Premium

Try FRS right now !

coba
123456

License Comparison

Usage Personal Multi Developer
Use the product in Multiple Site
Product Update 1 Site 5 Site 25 Site
Access to support forum
Product update 1 Year 1 Year 1 Year
One to one support
Price $7.50 $12.50 $25
Buy Buy Buy

Awesome Support

Priority Support

If you have any trouble with our problem, feel free to discuss it on the support forum

Go to Forum

  1. Buy the license you need ( Personal / Developer )
  2. Download the plugin from your account
  3. Unzip the zip file. It will extract two file : fluid-responsive-slideshow.zip and fluid-responsive-slideshow-premium.zip
  4. Upload and install fluid-responsive-slideshow.zip followed by fluid-responsive-slideshow-premium.zip
  5. Premium Fluid Responsive Slideshow option feature will appears in FR Slideshow menu
figure 1. Slideshow Options

figure 1. Slideshow Options

figure 2. Individual Slide Options

figure 2. Individual Slide Options

Here is the manual for Fluid Responsive Slideshow. Follow the step bellow to create your first slideshow !

1. Slide Type

The first thing to do is create a “Slide Type”. A Slide Type represents one slideshow that contains one or more slides.

  1. Click FR Slideshow > Slide Type menu from WordPress Dashboard.
  2. Enter the Slide Type name and slug in the form.
  3. Our first slideshow will be “My First Slideshow”
  4. Click “Add New Slide Type “.

Now you have a SlideType.

2. Add Slide

Now we’re adding some slides to the slide type.

2

  1. Click FR Slideshow > Slideshow menu from WordPress Dashboard.
  2. Select the corresponding slideshow to add, click show button.
  3. Click create first slide or add new slide button.
  4. The slide editor pop-up will appear, and will be explained further in part 3.

Repeat step 3-4 to add more slides in same slide type/slideshow.

3. Single Slide Customization (1)

You can customize each slides via slide editor.

  1. Slide Title > the title of your slide.
  2. Set image slideshow by clicking Set image button, and choose the image you want you want to display in this slide.
  3. In the Slide Options section, you can further customize each slide. The details are in the part below.

4. Single Slide Customization (2)

General

  • Show Text > select yes if you want the slide description to be displayed.
  • Background > The slide background color, if the slide is not using the image background from the featured image.

Text Box Background

  • Type > To set the background text displayed in the slide. Type options are Transparent, Solid Color, or None.
  • None > The text will have no background color.
  • Transparent > The text will have colored background with opacity.
  • Solid Color > The text will have solid background color.

Text Box Position

  • Text Box Position > the position of the text box (left, top left, top, top right, right, bottom right, bottom, bottom left, center, sticky top, sticky bottom)
  • Text Box Width > the width of the text box (1 / 12 until 12 / 12)
  • Text Box Align > set the text alignment (left, center, right)

Text Color

  • Title > to set the title text color
  • Description > to set the slide description text color

Text Box Button

  • Show Button > select yes to display a link button in the slide
  • Button Skin > select to set the button appearance
  • Caption > set the button caption
  • Href > link provided from the button

Text Box Padding

  • Type > Select auto to automatically set the text box padding, or select manual if you want to.
  • Padding > Sub-option of Manual padding, you can set the desired padding from here.

 

5. Slideshow Configuration

You can customize each slideshow i.e. skins, slideshow timer, etc.

5-1

  1. Click FR Slideshow > Slideshow menu from WordPress Dashboard.
  2. Select the corresponding slideshow you want to edit, then click show.
  3. In the Slide tab, you can add, edit, and delete the slides.
  4. To rearrange slide order, just drag and drop the slides in the list.
  5. If you want to edit the skins, animation, timer, etc, go to Configuration tab.

6. Slideshow Configuration (2)

You can customize each slideshow via FR Slideshow > Slideshow menu.

  1. The slideshow above is the preview of your slideshow.
  2. Change the settings and click Save Options to see the change.

Skin & Animation

  • Skin > You can choose your slideshow skin from here. Get more skins by purchasing premium package.
  • Animation > There are 4 transition animation to choose: Horizontal Slide, Vertical Slide, and fade.

Dimension

  • Width > set the maximum width of the slideshow.
  • Height > set the maximum height of the slideshow.

Text Box

  • Show Textbox > options to show or hide the text box from all slides related to the slide type.
  • Title Size > set the slide title text size.
  • Description Size > set the slide description text size.

Slide Time

  • Slide Time > the slide display period in miliseconds.
  • Slide Transition > Time the slide transition period in miliseconds.

Mouse Hover Behaviour

  • Pause On Hover > select yes to pause the timer so the slide doesn’t switch when the mouse is on hover.
  • Continue On Mouseout > select yes to resume slide timer when the mouse is not hovering the slide.
  • Delayed Start After Mouseout > delay time of slide timer to resume.

Timer

  • Show Timer > to display the slide timer.

Arrow Navigation

  • Arrow Navigation > displays the arrow navigation on the slideshow.

Bullet Navigation

  • Bullet Navigation displays the bullet navigation on the slideshow.

6. Insert Slideshow into Post / Page

The final part is to insert your slideshow to post / page you have previously created.

Untitled

  1. Open the Post / Page where the slideshow will live
  2. Chose Add FR Slideshow
  3. Pick your desired slideshow
  4. A shortcode will go into your post / page content
  5. Update your page
  6. Hit View Page
  7. Voila ! You just made your first slideshow

For mor advanced technique, such as insert your slideshow into your theme, please refer to this post : https://tonjoostudio.com/insert-shortcode-into-your-wordpress-theme/

 

 


facebooktwittergoogle_plusredditpinterestlinkedinmail