Setting up the J51 Icons
Our J51 Icons module extension allows you to quickly and easily place a set of icons in a module position along with a caption title and some text for each. This module uses the 'Font Awesome' icons collection which give you a massive 500+ scalable vector icons to choose from.
Firstly install the mod_j51icons.zip from the corresponding folder to your Joomla version in your template download via your extension manager (Extensions -> Extension Manager).
Once installed you can create a new instance of your J51 Icons module by navigating to Extensions -> Module Manager -> New -> J51_Icons. Multiple instances of your Icons module, or indeed any module can be achieved by simply repeating this process.
When creating/editing your Icons module you will find your 'General Settings' tab. This tab contains the main settings for the full set of icons.
- Icons Color - Select the color of your icon(s).
- Icons Size - Select the size of your icon(s).
- Icons Opacity - Select the opacity of your icon(s).
- Number of Columns - The number of columns to place your icons.
- Icon Alignment - Align your icons to left, right or center.
- Horizontal Margins - Set the horizontal margin in pixels of each icon.
- Vertical Margins - Set the vertical margin in pixels of each icon.
Icons Settings (Icon ##)
Along with your 'General Settings' tab, you will find a tab for each icon within your collection. There is a total of 8 tabs allowing your collection to contain a maximum of 8 icons. Set the following settings for each icon you wish to be displayed in your collection.
- Select Icon - Set the class name for the Font Awesome icon you want to use (eg. fa-coffee). For a full list of icon names check out http://fortawesome.github.io/Font-Awesome/cheatsheet/
- Icon URL - Set the URL to which your icon will link to.
- Open link in new window - Allow the link to open in a new browser window.
- Icon Alt text - Mainly for SEO purpose, this field allows you to set an 'alt' tag for the icon.
- Icon Title - Set the icon title to display.
- Icon Description - Set the icons caption text to display.
- Animate On Scroll - Add an animate class name to animate the image on scroll.
- Tuesday, 23 June 2015
- Posted in: Joomla51 Extensions