Modified: Tuesday, 31 December 2019 13:03

You can create an attractive slideshow using unregular shapes, and customized colors for each element of the slide.

Change the overall look of your slides with a border-radius feature, background color, fonts for title, fonts for read-more, description and customize its colors.

How to customize the settings?

Go to "Modules" in your Joomla panel. Open (or create new) DJ-ImageSlider module. Now open the "Customize Slider" tab.

Available settings are:

  • Title color - choose the title color and a transparency-level, where 1 is not transparent at all, 0.5 is 50% see-through, and 0 is completely transparent. The color can be chosen from the color palette or defined by typing RGBA parameters.
  • Title font - enter the name of the selected font. You can use generic system fonts or Google Fonts.
  • Title font size - set the font size by entering the px or em value. Leave the field empty for a default size.
  • Description color - choose the description color and a transparency-level, where 1 is not transparent at all, 0.5 is 50% see-through, and 0 is completely transparent. The color can be chosen from the color palette or defined by typing RGBA parameters.
  • Description font -  enter the name of the selected font. You can use generic system fonts or Google Fonts.
  • Description font size - set the description size by entering the px or em value. Leave the field empty for a default size.
  • Read more color - choose the read more color and a transparency-level, where 1 is not transparent at all, 0.5 is 50% see-through, and 0 is completely transparent. The color can be chosen from the color palette or defined by typing RGBA parameters.
  • Read more font - enter the name of the selected font for the read more option. You can use generic system fonts or Google Fonts.
  • Read more font size - set the read more font size by entering the px or em value. Leave the field empty for a default size.
  • Background color - choose the background color and a transparency-level, where 1 is not transparent at all, 0.5 is 50% see-through, and 0 is completely transparent. The color can be chosen from the color palette or defined by typing RGBA parameters.
  • Include Google fonts - Yes/No
  • Border radius - you can give any slide "rounded corners" by applying a border-radius through CSS.  If you are not sure how to configure it, visit Border-Radius page and use the generator.

 We have used sample settings here:

Custom slider module settingsAnd that is how the slider looks on the front page:

Custom slider module view