JA University T3

The Responsive Joomla template - JA University T3 is fully compatible with Joomla 2.5 and Joomla 3. We have written this the documentation based on Joomla 3, please do consider this factor if you are using it for Joomla 2.5. No worry, there aren't any big differences between the two.

1. Joomla Template for University and school websites - JA University

JA University will be the choice for your next school or university website project.

The template is designed with the aim for simple and minimal design. JA University has rich content types.

This Joomla template for education institution supports the latest version of T3 Framework 2.5.4, K2 component, Slideshow Lite and much more.

JA University will meet all the demands of a professional educational website.

View Demo

2. Main Features

  • JA University has rich content types
  • Fully Responsive Template
  • Joomla 2.5 and Joomla 3 native
  • Bootstrap 3 integration

3. JA Extensions Supported

  • JA Contentslider module
  • JA Facebook Activity module
  • JA Facebook Likebox module
  • JA Slideshowlite module
  • JA Sidenews module
  • JA Masshead module
  • JA Extension Manager
  • T3 Framework

4. Supported Third party extensions

  • Acymailing
  • K2 Component

5. Supported Joomla pages (by default)

  • Login
  • Registration Page
  • Edit User Profile
  • Web Links
  • News Feeds
  • Contact Us
  • Smart Search
  • Offline Page
  • Tag Item Page
  • 404 Page

6. Site structure and Module position

View in higher Resolution

JA University T3 is compatible with Joomla 3 and Joomla 2.5. Please make sure your system meets the following requirements:

Joomla 3 System requirement

Software

  • Software: PHP (Magic Quotes GPC off): 5.3.1 + (5.4+ recommended)

Databases

  • MySQL(InnoDB support required): 5.1+
  • MSSQL 10.50.1600.1+
  • PostgreSQL 8.3.18+

Web Severs

  • Apache 2.x+
  • Microsoft IIS 7
  • Nginx 1.0 (1.1 recommended)

Joomla 2.5+ system requirement

Software

  • Software: PHP 5.2.4+ (5.4+ recommended)
  • MySQL: 5.0.4+

Web Sever

  • Apache: 2.x+
  • Microsoft: IIS 7
  • Nginx: 1.0 (1.1 recommended)

Browser requirement

The requirements are the same with both Joomla 2.5 and Joomla 3

  • Firefox 4+
  • IE (Internet Explorer) 8+
  • Google Chrome 10+
  • Opera 10+
  • Safari 5+

Development Environment

The requirements are the same with both Joomla 2.5 and Joomla 3

During development process, Localhost is preferred. You can use the following servers on your PC to develop your site.

Windows

  • WAMPSEVER
  • XAMPP for Windows

Linux

  • LAMP Bubdle
  • XAMPP for Linux

Mac OS

  • MAMP & MAMP Pro
  • XAMPP for Mac OS

1. Plan your site Development

  • Kick-start a New Joomla Site? - If you are planning to start fresh with a new Joomla site, then use our Quickstart package to quickly clone the demo site, then replace the demo content with yours. Check the How to install Quickstart Package documentation for the in-depth how-to guide for Quickstart Installation.
  • Installing on your existing live site ? - If you are planning to use this template for your existing Joomla site, then you should follow the How to make your site look like demo site guide first to dig in the steps involved.

2. Download Template and Extensions

Please proceed to JA University T3's Download page, where it holds all the related files and template zip file that you need.

3. Install Template and Extensions

Once you successfully Download the files you need, You'll have to:

  • Install the template file onto your Joomla system.
  • At default, during the installation process, JA University T3 template will be installed with the settings we're used as on the demo website. Therefore, if you would like to make any changes in configuration, it's recommended that you should complete the setup (including installing all the modules and plugins along with the templates as on demo) then carry out any customization afterwards.

View how to install extensions guide

4. Build demo with our Demo Builder

If you are not yet familiar with JoomlArt Demo Builder, more information on this can be read here. To be short, the demo builder service allows you to quickly clone demo for any JoomlArt's Joomla template and test-drive it. As we have recently improved and re-developed the Demo Builder system, you can now play around and experiment with it up to 3 days.

Demo Builder at JoomlArt

Visit Demo Builder

Note:

Custom HTML Module: We have styled (CSS) for several Custom HTML modules using different div classes. You should check out the HTML codes in these module and follow the same format in order to get it displayed correctly. We do also provide the HTML code in this user-guide down below for your references.

I. JA Extension Configuration

1. JA Slideshow Lite module

  Module Position: slideshow
  Module Suffix: NOT USED

JA Slideshow Lite module

View JA Slideshow Lite Docs

2. JA Side News module

  Module Position: content-mass-top
  Module Suffix: NOT USED

Side News module

View JA Side News Docs

3. JA Content Slider module

  Module Position: contentslider
  Module Suffix:  no-margin

JA Content Slider module

View JA Content Slider Docs

4. JA Facebook Like Box module

  Module Position: sidebar-2
  Module Suffix: NOT USED

JA Facebook Like Box module

View JA Facebook Like Box Docs

5. JA Facebook Activity module

  Module Position: sidebar-2
  Module Suffix: NOT USED

JA Facebook Activity module

View JA Facebook Activity Docs

6. JA Masshead module

  Module Position: masshead
  Module Suffix: NOT USED

JA Masshead module

View JA Masshead Docs


II. Default Joomla Extensions Configuration

1. Acymailing Module

  Module Position: position-5
  Module Suffix: NOT USED

Acymailing Module

2. Most Read Content

  Module Position: sidebar-2
  Module Suffix: NOT USED

Most Read Content

3. Breadcrumbs

  Module Position: navhelper
  Module Suffix: NOT USED

Breadcrumbs

4. Footer

  Module Position: footer
  Module Suffix: NOT USED

Footer

5. Language Switcher

  Module Position: languageswitcherload
  Module Suffix: NOT USED

Language Switcher

6. Login Form

  Module Position: sidebar-2
  Module Suffix: NOT USED

Login Form

7. Menu

7.1. Quick links menu module

To have it displayed as it is per Demo site, please follow the step by step instruction as below:

Step 1: Create "Quick links" menu

Go to Administrator >> Menus >> Menu Manager >> Add New Menu: Quick links.

Step 2: Add "Quick links"'s menu items

Go to Administrator >> Menus >> Quick links >> Add New Menu Items for the Menu.

Step 3: Create "Quick links" menu module

This module is Joomla default module, that means when you install Joomla fresh, this module is ready to use.

Go to Administrator >> Module Manager >> Add new Menu Module, named: Quick links.

  Module Position: position-8
  Module Suffix: NOT USED

Quick links menu module

7.2. About Joomla menu module

To have it displayed as it is per Demo site, please follow the step by step instruction as below:

Step 1: Create "About Joomla" menu

Go to Administrator >> Menus >> Menu Manager >> Add New Menu: About Joomla.

Step 2: Add "About Joomla" menu items

Go to Administrator >> Menus >> About Joomla >> Add New Menu Items for the Menu.

Step 3: Create "About Joomla" menu module

This module is Joomla default module, that means when you install Joomla fresh, this module is ready to use.

Go to Administrator >> Module Manager >> Add new Menu Module, named: About Joomla.

  Module Position: position-9
  Module Suffix: NOT USED

About Joomla menu module

7.3. Colleges menu module

To have it displayed as it is per Demo site, please follow the step by step instruction as below:

Step 1: Create "Colleges" menu

Go to Administrator >> Menus >> Menu Manager >> Add New Menu: Colleges.

Step 2: Add "Colleges" menu items

Go to Administrator >> Menus >> Colleges >> Add New Menu Items for the Menu.

Step 3: Create "Colleges" menu module

This module is Joomla default module, that means when you install Joomla fresh, this module is ready to use.

Go to Administrator >> Module Manager >> Add new Menu Module, named: Colleges.

  Module Position: position-10
  Module Suffix: NOT USED

Colleges menu module

7.4. Admissions menu module

To have it displayed as it is per Demo site, please follow the step by step instruction as below:

Step 1: Create "Admissions" menu

Go to Administrator >> Menus >> Menu Manager >> Add New Menu: Admissions.

Step 2: Add "Admissions" menu items

Go to Administrator >> Menus >> Admissions >> Add New Menu Items for the Menu.

Back-end setting for the menu items

Step 3: Create "Admissions" menu module

This module is Joomla default module, that means when you install Joomla fresh, this module is ready to use.

Go to Administrator >> Module Manager >> Add new Menu Module, named: Admissions.

  Module Position: position-11
  Module Suffix: NOT USED

Admissions menu module

7.5. Off canvas

To have it displayed as it is per Demo site, please follow the step by step instruction as below:

Step 1: Create a menu which you want to display on off-canvas sidebar, example: Main menu

Go to Administrator >> Menus >> Menu Manager >> Add New Menu: Main menu.

Step 2: Add "Main menu" items

Go to Administrator >> Menus >> Main menu >> Add New Menu Items for the Menu.

Step 3: Create "Off Canvas" menu module

This module is Joomla default module, that means when you install Joomla fresh, this module is ready to use.

Go to Administrator >> Module Manager >> Add new Menu Module, named: Off canvas.

  Module Position: off-canvas
  Module Suffix: NOT USED

Off canvas

7.6. All Departments

To have it displayed as it is per Demo site, please follow the step by step instruction as below:

Step 1: Create a menu which you want to display on All Departments, example: all departments

Go to Administrator >> Menus >> Menu Manager >> Add New Menu: all departments.

Step 2: Add "all departments" menu items

Go to Administrator >> Menus >> Main menu >> Add New Menu Items for the Menu.

Back-end setting for the menu items

Step 3: Create "All Departments" menu module

This module is Joomla default module, that means when you install Joomla fresh, this module is ready to use.

Go to Administrator >> Module Manager >> Add new Menu Module, named: All Departments.

  Module Position: sidebar-2
  Module Suffix: NOT USED

Off canvas

8. Search

  Module Position: head-search
  Module Suffix: NOT USED

Search

9. Smart Search Module

  Module Position: sidebar-2
  Module Suffix:  search-course

Smart Search

10 Banner module

10.1 Mega banner module

To build this module as it is per demo, please follow this step-by-step instruction as below:

Step 1: Create a new Category

Go to Administrator >> Components >> Banners >> Categories >> New

Back-end Settings

Step 2: Create a new Banner

Go to Administrator >> Components >> Banners >> Banners >> New

Step 3: Create a new banner module

				Named: Mega banner
				Module Position : mega1
				Module Suffix : Not Used
				
Back-end Settings

Front-end Appearance

mega banner

10.2 Sample banner 4 module

To build this module as it is per demo, please follow this step-by-step instruction as below:

Step 1: Create a new Category

Go to Administrator >> Components >> Banners >> Categories >> New

Back-end Settings

Step 2: Create a new Banner

Go to Administrator >> Components >> Banners >> Banners >> New

Step 3: Create a new banner module

				Named: Sample banner 4
				Module Position : sidebar-1
				Module Suffix : Not Used
				
Back-end Settings

Front-end Appearance

mega banner

10.3 Sample banner 3 module

To build this module as it is per demo, please follow this step-by-step instruction as below:

Step 1: Create a new Category

Go to Administrator >> Components >> Banners >> Categories >> New

Back-end Settings

Step 2: Create a new Banner

Go to Administrator >> Components >> Banners >> Banners >> New

Step 3: Create a new banner module

				Named: Sample banner 3
				Module Position : sidebar-2
				Module Suffix : Not Used
				
Back-end Settings

Front-end Appearance

mega banner

10.4 Right banner 1 module

To build this module as it is per demo, please follow this step-by-step instruction as below:

Step 1: Create a new Category

Go to Administrator >> Components >> Banners >> Categories >> New

Back-end Settings

Step 2: Create a new Banner

Go to Administrator >> Components >> Banners >> Banners >> New

Step 3: Create a new banner module

				Named: Right banner 1
				Module Position : sidebar-2
				Module Suffix : Not Used
				
Back-end Settings

Front-end Appearance

mega banner

If you are not sure about how to use Custom HTML Modules or how to access the HTML Editor, please read this Guide.

We will provide you with the HTML Code (markup) for reference below. You will need to replicate it exactly then change your content. Remember, HTML code has special div classes, which are required for demo alike display.

1. Department list

Module Position : department
Module Suffix : NOT USED
<div class="department-list">
<div class="department-list"> <ul class="department-list"> <li class="icon-1"><a href="/index.php?option=com_content&Itemid=709&id=91&lang=en&view=article" title="Sample">Management</a> <span class="department-name">Management</span></li> <li class="icon-2"><a href="/index.php?option=com_content&Itemid=709&id=92&lang=en&view=article" title="Sample">Accounting</a> <span class="department-name">Accounting</span></li> <li class="icon-3"><a href="/index.php?option=com_content&Itemid=709&id=93&lang=en&view=article" title="Sample">Economics</a> <span class="department-name">Economics</span></li> <li class="icon-4"><a href="/index.php?option=com_content&Itemid=709&id=94&lang=en&view=article" title="Sample">Technology</a> <span class="department-name">Technology</span></li> <li class="icon-5"><a href="/index.php?option=com_content&Itemid=709&id=95&lang=en&view=article" title="Sample">Finance</a> <span class="department-name">Finance</span></li> <li class="icon-6"><a href="/index.php?option=com_content&Itemid=709&id=96&lang=en&view=article" title="Sample">Officer</a> <span class="department-name">Officer</span></li> <li class="icon-7"><a href="/index.php?option=com_content&Itemid=709&id=97&lang=en&view=article" title="Sample">Humanities</a> <span class="department-name">Humanities</span></li> <li class="icon-8"><a href="/index.php?option=com_content&Itemid=709&id=98&lang=en&view=article" title="Sample">Geography</a> <span class="department-name">Geography</span></li> </ul> </div>

2. Featured professor

Module Position : sidebar-1
Module Suffix : NOT USED
<ul class="professor-list">
<li><img src="/images/sampledata/ja-university-t3/pss-1.jpg" border="0" alt="Processor 1" /> <strong>Michela Clara</strong> <span>Maths professor</span></li>
<li><img src="/images/sampledata/ja-university-t3/pss-2.jpg" border="0" alt="Processor 1" /> <strong>John Smith</strong> <span>Technology professor</span></li>
<li><img src="/images/sampledata/ja-university-t3/pss-3.jpg" border="0" alt="Processor 1" /> <strong>Tom Michel</strong> <span>Economics professor</span></li>
</ul>

3. Contact us

Module Position : position-6
Module Suffix :  contact-list
<p>Id pretium sapien pellentesque est pretium neque lobortis laoreet id sed.</p>
<ul class="contact-list">
<li class="phone"><strong>Hot line: </strong>+1984 234 5678</li>
<li class="email"><strong>Email: </strong> <a href="mailto:noreply@yourdomain.com">noreply@yourdomain.com</a></li>
</ul>

4. Connect with us

Module Position : position-7
Module Suffix : NOT USED
<p>We're on Social Networks. Follow us &amp; get in touch.</p>
<!-- AddThis Follow BEGIN -->
<div class="social-list addthis_toolbox"> </div>
<!-- AddThis Follow END -->

5. Contact info

Module Position : otherinfo
Module Suffix : NOT USED
<div class="other-info">
<div class="contact-map">
<div class="map-info">
<div>
<h3>Admission and info</h3>
Undergraduate Admissions<br /> <strong>+ Tel:</strong> 342 654 987<br /> <strong>+ Fax:</strong> 234 567 890</div>
<div>
<h3>General Information</h3>
Massachusetts Hall <br />Lanscater, Long street<br /> <strong>+ Tel: </strong>342 654 987</div>
</div>
<img src="/images/sampledata/ja_university/sam-15.jpg" alt="University map" border="0" /></div>
<p>Cursus Vivamus nunc porttitor pretium felis Sed et nunc sociis faucibus. Quis Praesent tortor id Donec Vestibulum et Curabitur convallis Duis eros. Ut sit ac venenatis Sed elit auctor interdum fringilla Integer magna. Eros sit ante tristique odio malesuada purus Vivamus id faucibus sit. Sodales pharetra consectetuer est urna adipiscing id pellentesque.</p>
</div>

I. Default Layouts

JA University T3 comes with various types of layout that definitely benefits any business site. We don't use any 3rd party extension to work out these layouts, instead we believe in the power of Joomla core - Joomla com_comtent to come up with these.

II. Build up your own page

To assign a layout to a certain page, please follow our instruction below.

Step 1: Clone the default style

When you install ja_university_t3 template, there is only one style: the default style. However, you can create an unlimited number of different styles for your template as needed.

Why do you need to create a new style?

To have multiple layouts on your site, you need to create multiple styles. Each of these styles will be assigned to one layout.

So what is the difference between template and template style? - Check this out

To create a new style in ja_university_t3, open the template manager panel, select ja_university_t3 default style then hit the Duplicate button.

Duplicate style

On the demo site, we have already duplicated a number of styles for different layouts.

Duplicate style

Step 2: Assign layout to the newly created style

Open the new style then select the respective layout that you want to assign to.

Assign layout

Now open the menu item that you have assigned to the newly created style to configure it, you should be selecting the correct menu type for it.

Matching layout with menu type:

Please note that each layout will go with its own menu type only, so please make sure you select the correct menu type for your layout.

Layout list

Page Layout Menu type
Students page default pLayout - Blog
Videos page default vLayout - Blog
Events page default eLayout - Blog

Here is the list of all extended menu types:

  • pLayout - Blog
  • vLayout - Blog
  • eLayout - Blog

Step 3: Assign style to each menu item

This is called "style override". The menu item that is assigned to a specific style will get that style overrided the default style.

There are 2 ways to assign style to menu items: in the style back-end setting or in the setting panel of menu item.

#1: In the style back-end setting

Menu assignment

#2: In the setting panel of menu item

Blog menu item

1. K2 Installation

If you are new to this Joomla component, please read this guide.

K2 Installation Documentation

2. Configure K2 component

2.1 Global Configuration: Click on Parameter button

Back-end settings

2.2 Category Configuration

To build your website like our demo, navigate to Administrator >> Component >> K2 >> Categories.

k2 category

As you can see on our Demo, each parent category uses ja-university_blog template. The template has content block and right side to display modules.

Front-end appearance

  • All Categories
  • K2 Item List Page

Blog category

Parent category

Current Students category

Note: other categories are inherited parameters from category: Current Students

3. Configure K2 Modules

This instruction is a reference for developers using manual installation, a guide on how to set up K2 Component like on the demo website and the quick-start package.

Please refer to the official documentation on how to install and set up K2.

There are 3 modules of K2 component being used in JA University T3.

3.1 K2 Tools Module

3.1.1 Blog archive

Module Position : sidebar-2
Module Suffix : NOT USED

3.1.2 Calendar

Module Position : sidebar-2
Module Suffix : NOT USED

3.1.3 Tags cloud

Module Position : sidebar-2
Module Suffix : NOT USED

3.2 K2 Users Module

Module Position : sidebar-2
Module Suffix : NOT USED

3.3 K2 User Module

Module Position : sidebar-2
Module Suffix : NOT USED

Theme Settings

JA University T3 supports 9 color themes by default: default, blue, brown, green, grey, iron, purple, teal and violet.

JA Biz colors

A here, you can switch to any theme you like. To change theme, kindly select it from the drop down box under the Theme tab.

Theme Settings

In the Theme tab, you can also change the logo by replacing other image here or select text logo option as you wish.

View Logo Customization Docs

ThemeMagic Settings

ThemeMagic is a real time theme customization tool supported by T3 Framework. It allows you to customize any theme without touching in the code.

Step 1: Enable ThemeMagic

In the General tab, enable ThemeMagic then access ThemeMagic's working panel by clicking on ThemeMagic.

ThemeMagic Settings

Step 2: Select the theme to customize

Select theme then customize

Tips: Once ThemeMagic is enabled, you can access ThemeMagic from your front-page by adding "?tm=1" after your site url (example: http://joomla-templates.joomlart.com/ja_university_t3/?tm=1)

View ThemeMagic Documentation   VIew ThemeMagic's Video Tutorial

Layout Settings

There are 6 layouts that are used in the template. Select the style that you want to work on, then assign the layout for that style accordingly.

Layout Settings

Layout Structure

Here, you can change the layout structure, module positions in the layout, and more.

Layout Structure

In the spotlight block, you can see the number of positions available.

spotlight block

Responsive Layouts

JA University T3 supports multiple responsive layouts. In the Responsive layout, select the layout you would like to configure.

Responsive Layouts

In each responsive layout, you can disable any module position as you wish.

disable position

For module positions in the spotlight block, you can drag to resize.

resize position

Documentation   Layout configuration video   Layout customization video

JA University T3 comes with multiple typography styles for Headings, Content, Color, Buttons, Quotes, Forms and so on ...

View typo page

Note:

JA University T3 is built on the latest version of T3 Framework which integrates Bootstrap 3 at core, hence, JA University T3 does support all Bootstrap 3's typo.

Step 1: get the typo markup

There are 3 ways you can quickly get the typo markup from:

#1: using Firebug

Using Firebug to get the typo markup

#2: using quickstart package

We provide a Quickstart package, which includes the sample data that will help you replicating the JA University T3 demo as is for your site. Once you successfully install the site, you can easily get the typo's markup from the articles and custom HTML module.

#3: using demo builder

Once you successfully build a Demo using Demo Builder which we have shown earlier in the Download and Installation section, you can easily copy the typo markup from the articles and custom HTML directly from the back-end.

Demo builder

Access demo builder

Step 2: Add markup of the typo to your content

Turn off editor:

Please make sure you turn the Editor off if you are going to add HTML code to your article content. To turn off, please navigate to Sytem >> Global confoguration, select Editor - None in the field Default editor.

You can add the typo markup to the article's content field or custom HTML module.

Add typography

Here is the Typo HTML code.

You can use the above HTML code to make a similar page on your website and refer to the codes for using Typography.

IMPORTANT : These typography styles are specific to JA University T3 template and if you use them in your content and later decide to change the template, the styles will be broken, as these styles depend upon the template based css files (typo.css). We recommend using minimum typography, if you plan to change your template in future.

Step 3: Get the typo displayed on the front-page

Create a menu, assign to the article we added the typo markup to.

Menu settings

The above userguide should help one in replicating the Demo site settings for the template and extension on their site.

Recommended :

If you are new or are confused, we recommend installing Quickstart on your localhost and use it as reference for the configurations. This is the best way to work with any template. Links to all the resources are provided above. We suggest you to carefully go over those in order to take the maximum advantage of our products.

Support :

Please raise your support queries in support forum