Arashtad Ltd.
Web & Graphic Solutions

Arashtad Accordion v1.0

Fully Responsive Accordion for Joomla! 3

 

Author Information

Author: Amin Shahrokhi
Author Email: support [at] arashtad.com
Author URL: https://arashtad.com
Creation Date: September 2014
Copyright: © 2011 - 2016 Arashtad Ltd. All Rights Reserved.

Instruction

Arashtad Accordion is a Joomla! 3 package, including Arashtad Accordion component and Arashtad Accordion module. This package helps Joomla! 3 administrators to have unlimited accordion modules on every single Joomla! web page. Arashtad Accordion has 5 preset stylesheets and also provides facility to use custom stylesheets as easy as possible. Some of Arashtad Accordion features go following:

Features:

  • Fully responsive
  • Cross Browser Compatible
  • BootStrap Compatible
  • FontAwesome Support
  • Easy to Use and Costomization
  • QuickInstall Package
  • Ongoing Support
  • Well Documented
And More...

Usage

Arashtad Accordion is made for creating accordions on Joomla! 3 website without any coding. Its component stores data in the Joomla! database and the module displays data on the front-end. Having unlimited accordions on a page, displaying various items or a single item is easily possible with Arashtad Accordion.

Package Contents (Files Included)

Arashtad Accordion - Responsive Accordion for Joomla! 3


What you will receive as the Arashtad Accordion main package contains Documentation folder including “Documentation.pdf” i.e. the user manual of the product, Licensing directory, including GPL license and more description about licensing of this product and finally, a zip file. This zip file is what you should install on your Joomla! website and make use. To find out more about installation/uninstallation process, follow the rest of this documentation.

Installation

For installing Arashtad Accordion on your Joomla! log into your Joomla! administrator panel by calling [your- domain.com]/administrator and giving your username and password. Then follow the steps below to have Arashtad Accordion installed and ready to use:
1. From the Joomla! top menu go to: Extensions > Extension Manager

Arashtad Accordion - Responsive Accordion for Joomla! 3


2. Click on the "Upload Package File" tab.

Arashtad Accordion - Responsive Accordion for Joomla! 3


3. Click on the "Choose File" button, browse your computer to find the Arashtad Accordion QuickInstall package named “pkg_Arashtad Accordion.zip” and double click on it.
4. Hit the "Upload & Install" button and wait for the component to be installed.
This way, both of the Arashtad Accordion extensions will be installed and ready to use on your Joomla!

Make it use

Using Arashtad Accordion component, you can run several types of maintenance on your items.

  1. Create an item
  2. Edit an item
  3. Delete an item
  4. Display items on front-end with the desired style

Also, Arashtad Accordion module can display the items which you create via Arashtad Accordion component.
Now, we go through this subject and review all of the works you can do by the component, one by one.

Creating an item

To create a new item, do as following:
  • Go to: Components > Arashtad Accordion.
  • Click on the "New" button, on the top-left side of the page.
  • Fill in the blanks and hit the “Save & Close” button.

Arashtad Accordion - Responsive Accordion for Joomla! 3


Editing an item

To edit an item, follow the steps below:
  • Go to Components > Arashtad Accordion.
  • Click on the title of the item you would like to edit.
  • Make your changes and click on the “Save & Close” button.

Arashtad Accordion - Responsive Accordion for Joomla! 3

Deleting an item

To delete an item from the database, follow the steps below:
  • Go to Components > Arashtad Accordion.
  • Check the checkbox next to the item that you would like to delete.
  • Click on the "Delete" button on the top-left side of the page.

Arashtad Accordion - Responsive Accordion for Joomla! 3

Display an Item on Front-end

To display an item on front-end you need to use Arashtad Accordion module:
  • Go to Extensions > Module Manager.
  • Click on the “New” button at the top-left of the page.
  • Select module type as “Arashtad Accordion”.

Arashtad Accordion - Responsive Accordion for Joomla! 3

  • Once the next page is open, you will see few options. Firstly, write a title for your module.
  • The first option is “Select an item”. The drop down next to this label, loads all Arashtad Accordion items that you have created via Arashtad Accordion component. Select an item and it will be displayed on the module output.
  • The second option makes you able to choose a style for accordion output. As described, Arashtad Accordion has 5 preset styles and also an option to choose your custom stylesheet for this specific module. If you would like to select one of the 5 preset styles, simply select it from the derop down. But if you are about having your own style, select the “Custom” option i.e. the last option of the drop down list and then, write your own style here: [Joomla]/modules/mod_Arashtad Accordion/styles/custom.css. All, selectors you need are written and left blank on this file, in order to make things easier for you. A full guideline is available at “Customization” part of this documentation.
  • The next options are for assigning width and height of the module. They are valued as “auto” by default and you can leave them as they are if you would not like to force the module to have another dimensions.
  • Go to “Menu Assignment” tab and assign the pages you would like this module shows up on.
  • When the settings are finished, click the “Save & Close” button.

Arashtad Accordion - Responsive Accordion for Joomla! 3

Uninstallation

To uninstall Arashtad Accordion from your Joomla! completely, do as follow:

  • Go to Extensions > Extension Manager.

Arashtad Accordion - Responsive Accordion for Joomla! 3

  • Click on the “Manage” tab at the left of the page.

Arashtad Accordion - Responsive Accordion for Joomla! 3

  • Search “Arashtad Accordion” using the search field at the top of the table and press Enter.
  • Check the checkbox beside the “Arashtad Accordion Package” and click on “Uninstall” button at the top of the page.

This way, you will have all Arashtad Accordion extensions removed from your website.

Arashtad Accordion - Responsive Accordion for Joomla! 3

    Customization

    As described Arashtad Accordion is very flexible and easy to customize. You can easily change the style of its module output by selecting every preset style you want but if you know CSS and would like to have your own style for Arashtad Accordion module output, follow the instruction below:

    • Open [Joomla!]/modules/mod_Arashtad Accordion/styles/custom.css with a text editor
    • Once the file is open, you find some selectors with no attributes. These selectors are the Arashtad Accordion module selectors that have their attributes on the master.css file but since you are about creating your own style, here you have them all empty. Now, it’s the time for coding! So, fill in the blank selectors with your desired attributes and save the file.

    Arashtad Accordion - Responsive Accordion for Joomla! 3

    • Now, you have a custom stylesheet for your Arashtad Accordion and can make it use for every specific Arashtad Accordion module you create, going to management page of that module and selest “Custom” from drop down of the “Style” section.

    Arashtad Accordion - Responsive Accordion for Joomla! 3

    Sources & Credits

    Special thanks to brilliant brains of the world. People/Companies who have really shaked the world by their superb jobs. Some of these stars have helped Arashtad Accordion project to be handled since they have helped millions of projects before:

    • JQuery
    • Twitter BootStrap
    • FontAwesome
    • PHP .net
    • www.Joomla.org

      Download this Documentation in PDF format

Follow us

We support our clients via social medias. Also, the latest products, services and content on Arashtad is immediately shared on our fans.