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. Slider Options

FavSlider Joomla module documentation settings main screen

  1. SLIDER TYPE - Choose one of the 4 preset slider types: Basic, Carousel, Thumbnail and Simple Carousel.
  2. LOAD JOOMLA! JQUERY - This setting loads Joomla!'s jQuery library. Choose NO if your website loads jQuery from an external source.
  3. TRANSITION EFFECT - Choose between FADE or SLIDE animation types for the slides.
  4. SLIDE HEIGHT - Insert a fixed height for the slideshow. Insert only the value, for example: 14, not 14px. A blank field reverts the setting to the default value.
  5. THUMBNAIL HEIGHT - Insert a fixed height for the thumbnails. Insert only the value, for example: 14, not 14px. A blank field reverts the setting to the default value.
  6. URLs TARGET - Choose the target for the link of the slides.

2. Slides Navigation

FavSlider Joomla module documentation settings navigation options

  1. ARROW NAVIGATION - Choose to navigate between the slides using the previous/next arrows.
  2. ARROWS STYLE - Choose the style for the navigation arrows.
  3. CONTROL NAVIGATION - Choose to navigate between the slides using the control buttons.
  4. AUTORUN - Choose to animate the slider automatically. This setting will only work for a non-video slideshow.
  5. RANDOMIZE - Choose to randomize the order of the slides.
  6. ANIMATION LOOP - Choose to loop the slides. When this feature is set to NO, the previous/next navigation is disabled at either end of the slides.
  7. PAUSE ON HOVER - Choose to pause the slideshow when hovering over the slides, then to resume the slideshow when no longer hovering over the slides. This setting will only work for a non-video slideshow.
  8. KEYBOARD NAVIGATION - Choose to navigate between the slides using the keyboard left/right keys.
  9. MOUSE NAVIGATION - Choose to navigate between the slides using the mouse wheel.
  10. 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.

3. Caption Options

FavSlider Joomla module documentation settings caption options

  1. CAPTION HIDE - Choose the devices on which the caption should be visible on.
  2. CAPTION EFFECTS - Choose a CSS3 effect for the slideshow caption on page scroll and load.
  3. CAPTION TEXT ALIGN - Choose the text align for the content of the caption.
  4. CAPTION STYLE - Choose the caption style for the slides.
  5. CAPTION BACKGROUND STYLE - Choose the caption background style for the slides.
  6. CAPTION WIDTH - Insert the width for the caption of the slides using pixels(px), percent(%) or em (for example: 14px, not 14). A blank field reverts the setting to the default value.
  7. CAPTION HEIGHT - Insert the height for caption of the slides using pixels(px), percent(%) or em (for example: 14px, not 14). A blank field reverts the setting to the default value.

4. Caption Title

FavSlider Joomla module documentation settings caption title options

  1. CAPTION TITLE GOOGLE FONT - Insert the name of the Google Font for the caption title, for example Open Sans or Roboto. A blank field reverts the setting to the default value.
  2. CAPTION TITLE FONT SIZE - Insert the font size for the caption 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.
  3. CAPTION TITLE TEXT TRANSFORM - Choose the text transform for the caption title.
  4. CAPTION TITLE PADDING - Insert the padding for the caption title using pixels or percent (for example: 14px or 10%, not 14). The padding is a CSS property that sets the space around the content. The padding can have from 1 to 4 values (top, right, bottom and left). A blank field reverts the setting to the default value.
  5. CAPTION TITLE MARGIN - Insert the margin for the caption 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.

5. Caption Description

FavSlider Joomla module documentation settings caption description options

  1. CAPTION DESCRIPTION GOOGLE FONT - Insert the name of the Google Font for the caption description, for example Open Sans or Roboto. A blank field reverts the setting to the default value.
  2. CAPTION DESCRIPTION FONT SIZE - Insert the font size for the caption description using pixels, percent or em (for example: 14px, 120% or 1.2em, not 14). A blank field reverts the setting to the default value.

5. Caption Read More

FavSlider Joomla module documentation settings caption Read More options

  1. CAPTION READ MORE COLOR - Choose the color for the Read More text. A blank field reverts the setting to the default value.
  2. CAPTION READ MORE BACKGROUND COLOR - Choose the color for the background of the Read More text. A blank field reverts the setting to the default value.
  3. CAPTION READ MORE GOOGLE FONT - Insert the name of the Google Font for the Read More text, for example Open Sans or Roboto. A blank field reverts the setting to the default value.
  4. CAPTION READ MORE PADDING - Insert the padding for the Read More text using pixels or percent (for example: 14px or 10%, not 14). The padding is a CSS property that sets the space around the content. The padding can have from 1 to 4 values (top, right, bottom and left). A blank field reverts the setting to the default value.
  5. CAPTION READ MORE MARGIN - Insert the margin for the Read More 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.

Module Content

This module supports up to 10 slides with images/videos. 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. SLIDE SHOW - Choose if this slide should be displayed or not.
  2. SLIDE TYPE - Choose if this slide should display an image or a video.
  3. SLIDE IMAGE LOCATION OR VIDEO ID (YouTube/Vimeo) - Insert the full path of the image file, without the leading slash element (for example: images/myfile.jpg) or a valid YouTube/Vimeo video ID (for example: abcde for an URL like https://www.youtube.com/watch?v=abcde or 12345 for an URL like https://vimeo.com/12345).

    The default images are stored in the folder media/favslider. The initial path will be media/favslider/slide1.jpg where slide1.jpg can be changed with any other name used for the slide image.

    If you don't want to upload the slide images via FTP, you can change the path to upload them using the Media Manager. The default path can be changed relative to the Joomla installation root folder. For example, if the slides are located in the images folder, the new path will be images/slide1.png or images/slide1.jpg.
  4. SLIDE IMAGE ALT - Insert the image ALT tag for this slide (only applicable for images). A blank field reverts the setting to the default value.
  5. SLIDE IMAGE LINK - Insert the URL for this slide (only applicable for images). A blank field reverts the setting to the default value.
  6. SLIDE IMAGE TITLE TEXT - Insert the title text for this slide (only applicable for images). A blank field reverts the setting to the default value.
  7. SLIDE IMAGE DESCRIPTION TEXT - Insert the description text for this slide (only applicable for images). A blank field reverts the setting to the default value.
  8. SLIDE IMAGE READ MORE TEXT - Insert the Read More text for this slide (only applicable for images). 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.

The Joomla! name is used under a limited license granted by Open Source Matters the trademark holder in the United States and other countries. FavThemes is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.