FAVSLIDER is a free responsive Joomla! module that can be used to create a slideshow and customize each slide using the 90+ module settings. SEE THE DOCUMENTATION

up to 10
image slides

caption
title & description

90+ module
settings

free Joomla!
module

FavSlider Options

Designed to be versatile and customizable, FavSlider has many options that make it light and easy to use:

dark caption + dark arrows + dark indicators

light caption + light arrows + light indicators

autorun + arrows + no indicators

links for slides enabled

caption effect disabled

caption elements can be enabled/disabled for desktop and mobile

FavSlider Documentation

The downloaded package for the module is a .zip archive that needs to be unzipped before use. After it has been unzipped, inside the downloaded package you will find:

  1. the module's .zip archive - must to be installed using EXTENSIONS/MANAGE/INSTALL
  2. the ReadMe.txt file - has useful information about the product

Once installed, find the module in EXTENSIONS/MODULES and open it:

FavSlider Joomla module documentation main screen

MODULE SETTINGS - this tab controls the general settings, the ones that apply to all elements of the module.

MODULE CONTENT - this tab controls the individual settings for each element of the module such as images, text or icons for each one of the columns.

Module Settings

1. Slideshow Options

FavSlider Joomla module documentation settings main screen

  1. LOAD JOOMLA! JQUERY - This setting loads Joomla!'s jQuery library. Choose NO if your website loads jQuery from an external source.
  2. SLIDESHOW AUTORUN - Choose to animate the slideshow automatically.
  3. SLIDESHOW CYCLING SPEED - Insert the speed of the slideshow, in milliseconds. Insert only the value, for example: 5000, not 5000ms. A blank field reverts the setting to the default value.

2. Caption Options

FavSlider Joomla module documentation settings caption

  1. CAPTION COLOR - Set the caption color for the slideshow.
  2. SHOW CAPTION EFFECT - Choose if a CSS3 effect for the slideshow caption should be displayed or not. Note that the CSS3 features are not supported by older browsers.

Title

FavSlider Joomla module documentation settings caption title

  1. SHOW CAPTION TITLE - Choose if the caption title for the slideshow should be displayed or not.
  2. TITLE COLOR - Choose the color for the title of the slideshow. A blank field reverts the setting to the default value.
  3. TITLE FONT SIZE - Insert the font size for the title using pixels, percent or em (for example: 14px, 120% or 1.2em, not 14). A blank field reverts the setting to the default value.
  4. TITLE LINE HEIGHT - Insert the line height for the title using pixels or em (for example: 14px or 1.2em, not 14). The line-height property is used to modify the spacing between the lines of text. A blank field reverts the setting to the default value.
  5. TITLE_MARGIN - Insert the margin for the title using pixels or percent (for example: 14px or 10%, not 14). The margin is a CSS property that sets the space around the content, including the padding. The margin can have from 1 to 4 values (top, right, bottom and left). A blank field reverts the setting to the default value.

Description

FavSlider Joomla module documentation settings caption description

  1. SHOW CAPTION DESCRIPTION - Choose if the caption description for the slideshow should be displayed or not.
  2. DESCRIPTION TEXT COLOR - Choose the color for the description text. A blank field reverts the setting to the default value.
  3. DESCRIPTION FONT SIZE - Insert the font size for the description text using pixels, percent or em (for example: 14px, 120% or 1.2em, not 14). A blank field reverts the setting to the default value.
  4. DESCRIPTION LINE HEIGHT - Insert the line height for the description text using pixels or em (for example: 14px or 1.2em, not 14). The line-height property is used to modify the spacing between the lines of text. A blank field reverts the setting to the default value.
  5. DESCRIPTION MARGIN - Insert the margin for the description text using pixels or percent (for example: 14px or 10%, not 14). The margin is a CSS property that sets the space around the content, including the padding. The margin can have from 1 to 4 values (top, right, bottom and left). A blank field reverts the setting to the default value.

Caption on mobile

FavSlider Joomla module documentation settings caption mobile

  1. SHOW MOBILE CAPTION TITLE - Choose if the caption title for the slideshow should be displayed or not on mobile devices.
  2. SHOW MOBILE CAPTION DESCRIPTION - Choose if the caption description for the slideshow should be displayed or not on mobile devices.
  3. MOBILE CAPTION HIDE - Insert the maximum width of the device when the caption is no longer visible using pixels (for example: 420px not 420). For example, when setting the caption hide to 420px, the caption is no longer visible for any device with a width smaller than 420px. A blank field reverts the setting to the default value.

3. Arrows Options

FavSlider Joomla module documentation settings arrows

  1. SHOW ARROWS - Choose if the arrows for the slideshow should be displayed or not.
  2. ARROWS COLOR - Choose the color for the carousel navigation arrows. A blank field reverts the setting to the default value.
  3. ARROWS BACKGROUND COLOR - Choose the background color for the carousel navigation arrows. A blank field reverts the setting to the default value.
  4. ARROWS BORDER RADIUS - Insert the border-radius for the arrows using pixels or percent (for example: 140px or 80%, not 140). For circle background shapes for arrows, choose the 50% value. Note that the CSS3 features are not supported by older browsers. A blank field reverts the setting to the default value.

4. Indicators Options

FavSlider Joomla module documentation settings indicators

  1. SHOW INDICATORS - Choose if the bullet indicators for the slideshow should be displayed or not.
  2. INDICATORS COLOR - Choose the color for the bullet indicators. A blank field reverts the setting to the default value.
  3. INDICATORS ACTIVE COLOR - "Choose the color for the active bullet indicator. A blank field reverts the setting to the default value.

Module Content

This module supports up to 10 slides with images. To disable any of these settings, leave the field blank. Each one of the slides from 1 to 10 has these options:

FavSlider Joomla module documentation content main screen

  1. SHOW SLIDE - Choose if this slide should be displayed or not.

1. Image Options

FavSlider Joomla module documentation content image settings

  1. IMAGE UPLOAD - Upload the image for this slide. To clear the uploaded image, press the clear (X) button.
  2. IMAGE ALT - Insert the text for the image Alt. A blank field reverts the setting to the default value.
  3. IMAGE LINK - Insert the URL for the image. Note that the link must include http:// or https://. A blank field means that no link is assigned to the image.
  4. IMAGE LINK TARGET - Choose the target for the URL of the image.

2. Caption Options

FavSlider Joomla module documentation content caption settings

  1. TITLE TEXT - Insert the text for the title inside the caption. A blank field reverts the setting to the default value.
  2. DESCRIPTION TEXT - Insert the text for the description inside the caption. A blank field reverts the setting to the default value.

The module features using CSS3 have limited support for older browsers, so please check the demo first.

Being a responsive module, this Joomla! module has no fixed width. The maximum width of the module is the width of the module position containing the module and/or the width of the device used (desktop, tablet or mobile). To test the responsive behaviour of the module columns, simply adjust the width of the browser window to different sizes.