24 HOUR FLASH SALE - 30% OFF EVERYTHING - Enter coupon code 24HOURFLASH on any purchase!

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.

General Settings

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.

Site Links

Recommended

Join Our Newsletter

* indicates required
We respect your privacy and do not tolerate spam and will never sell, rent, lease or give away your information (name, email, number, etc.) to any third party. Nor will we send you unsolicited email.
Joomla51 - Mullaghmore, Co. Sligo, Ireland
Joomla51.com is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by
Open Source Matters the trademark holder in the United States and other countries.

We use cookies on our website. Some of them are essential for the operation of the site, while others help us to improve this site and the user experience (tracking cookies). You can decide for yourself whether you want to allow cookies or not. Please note that if you reject them, you may not be able to use all the functionalities of the site.

Ok