SJ Eduonline

View demoMore detail
This guide will help you install SJ Eduonline Template step by step.

 

1SYSTEM REQUIREMENTS – Back to top

SJ Eduonline is compatible with Joomla v2.5 and Joomla v3.x. Please make sure your system meets the following requirements:

1.1 System Requirements – Joomla version 3.x

Software

  • Software: PHP 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)

1.2 Browser Requirements

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

  • Firefox 4+
  • Google Chrome 10+
  • Opera 10+
  • Safari 5+

1.3 Development Environment

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

During the 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.4 Component Requirements

K2 component – V3.0.x

Acymailing component

2DOWNLOAD – Back to top

Download Packages from our store:

Step 1: Login your account

Step 2: Go to Joomla > Download > Joomla Templates Club


Step 3: Under Premium Joomla Templates –> Find and Download Template as you want

3INSTALLATION – Back to top

There are two ways to install a Joomla Template:

  • Install Quickstart: By using this package, you will set the template exactly as our Demo with sample data. This is applied when you need a fresh Joomla with our template.
  • Install Template and Extensions: This is applied when you have already installed a Joomla instance on your server. You will need only be using the zipped files in “Extensions” and “Template” folders mentioned above.

3.1 Install with Quickstart Package:

The following steps will guide to install a quickstart package of SmartAddons Joomla Template: Click here

3.2 Install with Template and Extensions:

3.2.1 Install Template

 

Step 1: Access the installation panel

Navigate to Extensions >> Extension Manager.

Step 2: Install Template

  • Install with option: Upload Package File

Firstly, you choose file template.zip then click on the button Upload & Install to install the uploaded package.

Step 3: Set New Installed Template As Default Template

  • Go to Extensions >> Template Manager.

  • In order to display your site with the new installed template, you have to set the template as default template

3.2.2 Install Extensions

 

The extensions package include of (Modules/Components and Plugins).

Note: Extensions installation is the same with Template installation as above

Here is list of extensions that are used in the template.


ENABLE MODULES

  • Go to Extensions >> Module Manager.

  • Find the new installed module. For example: with “SJ Contact Ajax “ module.

You can use the search or filter option to find the new installed module easier and enable module.

  • Enable and set position for the module

When you find the new installed module, please open its configuration panel.

To display the module in front-page, you must publish it and set right position for the module.

Please note that not all module positions can be active in front-page, so please make sure the module is assigned to an active module position.

  • Assign the modules to specific menus

You have to assign the modules to specific menus so that the module will be displayed in the assigned menus. There are 4 options : “On all pages, No pages, Only on the pages selected, On all pages except those selected”

  • Configure the new installed module

Normally, each module has its own settings, the settings allow you to customize the module so that you can have it displayed in front-page as you wish.

ENABLE PLUGIN

Note: all plug-ins listed are imperative.

  • YT Framework Plug-in supports to add extra parameters used with Mega Menu and to compress CSS/JS/HTML when optimizing code. Besides, configure Yt Framework to show SJ Help with Report Bugs, Template Tutorials and YT Framework Tutorials or include jQuery into template. You can go here for getting more information of this plugin.
  • YT Shortcode offer you an amazing tool to create advanced custom content with minimal effort or even without any knowledge how to code HTML. Please go here for getting more information of this plugin.
  • SJ Content Related News is a simple plugin for content component. It helps you to show other articles in the same category. Please go here for getting more information of this plugin.

You need to install and activate them when using this template. Let’s start from 1 – 2 – 3 to active plug-ins as below:

Install Component

    To Install K2 Component, you can follow these steps:
    Step 1: Please go to Extensions >> Extension Manager

    Step 2: Choose file K2 component.zip that you have downloaded and then Click on the button Upload & Install to install the uploaded package.

To install Acymailing Component you do the same as the installation K2 Component.

3.3 Install multilingual site in SJ Template

To help you about language problem when you work with SJ Template, please read this post: how to set up a multilingual site in SJ Template.

4CONFIGURATION – Back to top

 
To view the Module Positions you can follow these steps:
 
Step 1: Go to Extensions >> Template Manager >> click the “Options” button in the toolbar.
 

 
Step 2: In the “Preview Module Positions” parameter >> click“Enable” and click the “Save” button
 

 
Step 3: Joomla 2.5 and Joomla 3.x will show the Template positions with ?tp=1 or &tp=1
 

 
Step 4:The image below shows Module Positions
 

 

4.1 Layout Position Layout1

4.2 Layout Position Layout2

4.3 Template Configuration

Go to Extensions > Template Manager > SJ Eduonline. All of parameters of this template are divided into the following groups, in which they are explained themselves:

OVERVIEW

GENERAL

LAYOUT

TYPOGRAPHY

CONTENT

TOOLS UTILITIES

ADVANCED

If you want to make your site same as SJ Eduonline demo site, this would be helpful. We will only show the important, customized settings.
 
 
To change logo image in SJ Eduonline, please go to here

4.4.1 Joomla Menu Configuration

Frontend Appearance

Tree of Joomla Menu

Backend Settings

Joomla Menu

To configure “Joomla Menu”, please go to Menus >> Main menu – English >> Find “Joomla Menu” (you can create new menu if this menu is not exist).
Menu Item Type: External URL
Template Style: Use default
Menu Location: Main menu – English

Blog Content
Menu Item Type: List All Categories
Template Style: Use default
Menu Location: Main menu – English
To configure Blog Content, please go to Menus >> Main menu – English >> Find “Blog Content” (you can create new menu if this menu is not exist).
Backend Settings

Category Blog
Menu Item Type: Category Blog
Template Style: Use default
Menu Location: Main menu – English
To configure Category Blog, please go to Menus >> Main menu – English >> Find “Category Blog” (you can create new menu if this menu is not exist).
Backend Settings

Category Blog (1 Column)
Menu Item Type: Category Blog
Template Style: Use default
Menu Location: Main menu – English
To configure Category Blog (1 Column), please go to Menus >> Main menu – English >> Find “Category Blog (1 Column)” (you can create new menu if this menu is not exist).
Backend Settings

4.4.2 Pages Menu Configuration

Frontend Appearance

Tree of Pages Menu

Backend Settings

Pages Menu

To configure “Pages Menu”, please go to Menus >> Main menu – English >> Find “Pages Menu” (you can create new menu if this menu is not exist).
Menu Item Type: Single Article
Template Style: Use default
Menu Location: Main menu – English

Photo Gallery
Menu Item Type: Single Article
Template Style: Use default
Menu Location: Main menu – English
To configure Photo Gallery, please go to Menus >> Main menu – English >> Find “Photo Gallery” (you can create new menu if this menu is not exist).
Backend Settings

Gallery (2 columns)
Menu Item Type: Single Article
Template Style: Use default
Menu Location: Main menu – English
To configure Gallery (2 columns), please go to Menus >> Main menu – English >> Find “Gallery (2 columns)” (you can create new menu if this menu is not exist).
Backend Settings

4.4.3 K2 Menu Configuration

Frontend Appearance

  • K2 Categories Listing: Please go to here to view page
  • K2 Categories Grid: Please go to here to view page
  • K2 Item: Please go to here to view page

4.4.3.1 To configure “Event page”, you can follow these steps:
 
Step1: To create a new Category, please go to Component >> K2 >> Categories >> Click “New” button. Then fill in the “Basic” Tab and “Display Settings” Tab

Step2: To create a new Item, please go to Component >> K2 >> Items >> Click “New” button

  • Item Frontend: Please go to here to view
  • Item Backend: Please go to here to view

    • 4.4.3.2 To configure “Sourse List” page, you can follow these steps:
     
    Step1: To create a new Category, please go to Component >> K2 >> Categories >> Click “New” button. Then fill in the “Basic” Tab and “Display Settings” Tab

    Step2: To create a new Item, please go to Component >> K2 >> Items >> Click “New” button

  • Item Frontend: Please go to here to view
  • Item Backend: Please go to here to view
    • 4.4.4 Contact-us Menu Configuration

    Frontend Appearance

    Backend Settings

    Contact-us Menu

    To configure “Contact-us Menu”, please go to Menus >> Main menu – English >> Find “Contact-us Menu” (you can create new menu if this menu is not exist).
    Menu Item Type: Single Article
    Template Style: Use default
    Menu Location: Main menu – English

    1. To configure Category 01, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Sj Basic News” module.
    Backend Settings

    4.5 Extension Configuration – Layout1

    4.5.1 Search Top Right – Top1 Position

     
    Module Position – Module Suffix

    Position: Top1
    Module Class Suffix: blank search_top
    Module Type: Smart Search

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Smart Search” module.

    4.5.2 Login – Login Position

     
    Module Position – Module Suffix

    Position: Login
    Module Class Suffix: Not Use
    Module Type: Login

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Login” module.

    4.5.3 Slideshow – Position
     
    Frontend Appearance

    4.5.3.1 Main Slideshow – Slideshow Position
     
    Module Position – Module Suffix

    Position: Slideshow
    Module Class Suffix: Not Use
    Module Type: Custom HTML

     

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom” module.

    Copy & Paste the code into your editor:

     

    4.5.3.2 Join people – Slideshow Position
     
    Module Position – Module Suffix

    Position: Slideshow
    Module Class Suffix: Not Use
    Module Type: Custom HTML

     
    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom HTML” module.

    Copy & Paste the code into your editor:

     
    4.5.3.3 Custom Spotlight1 – Slideshow Position
     
    Module Position – Module Suffix

    Position: Slideshow
    Module Class Suffix: Not Use
    Module Type: Custom HTML

     
    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom HTML” module.

    Copy & Paste the code into your editor:

     

    4.5.4 Upcoming courses – Spotlight1

     
    Module Position – Module Suffix

    Position: Spotlight1
    Module Class Suffix: sjupcomingcourses
    Module Type: SJ Listing Tabs For K2

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “SJ Listing Tabs For K2” module.

    4.5.5 Learning online – Spotlight3-Position
    Module Position – Module Suffix

    Position: Spotlight3
    Module Class Suffix: Not Use
    Module Type: Custom HTML

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom HTML” module.

    Copy & Paste the code into your editor:

     

    4.5.6 Spotlight4 – Position
     
    Frontend Appearance

    4.5.6.1 Free courses- Spotlight4 Position
     
    Module Position – Module Suffix

    Position: Spotlight4
    Module Class Suffix: sj-meganew-freecourses
    Module Type: Sj Mega News for K2

     

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Sj Mega News for K2” module.

    4.5.6.2 Sj K2 Filter – Slideshow Position
     
    Module Position – Module Suffix

    Position: Slideshow
    Module Class Suffix: sjextrafieldsfilter
    Module Type: Sj K2 Filter

     
    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Sj K2 Filter” module.

    4.5.7 Course categories – Spotlight5 Position

     
    Module Position – Module Suffix

    Position: Spotlight5
    Module Class Suffix: slide-categories
    Module Type: SJ Categories for K2

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “SJ Categories for K2” module.

    4.5.8 Upcoming events – Spotlight6left Position

     
    Module Position – Module Suffix

    Position: Spotlight6left
    Module Class Suffix: sjrelateclass
    Module Type: K2 Content

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “K2 Content” module.

    4.5.9 Latest blog – Spotlight6right Position

     
    Module Position – Module Suffix

    Position: Spotlight6right
    Module Class Suffix: sjlatestblog
    Module Type: SJ Extra Slider for K2

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “SJ Extra Slider for K2” module.

    4.5.10 logo category – Spotlight7 Position

     
    Module Position – Module Suffix

    Position: Spotlight7
    Module Class Suffix: Not Use
    Module Type: Custom

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom” module.

    Copy & Paste the code into your editor:

     

    4.5.11 Newsletter – Bottom Position

     
    Module Position – Module Suffix

    Position: Bottom
    Module Class Suffix: blank newsletter
    Module Type: AcyMailing Module

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “AcyMailing Module” module.

    4.5.12 About Footer – Bottom1 Position

     
    Module Position – Module Suffix

    Position: Bottom1
    Module Class Suffix: Not Use
    Module Type: Custom HTML

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom HTML” module.

    Copy and paste the Code into editor:

     

    4.5.13 Testimonials – Bottom2 Position

     
    Module Position – Module Suffix

    Position: Bottom2
    Module Class Suffix: sj_testimonials
    Module Type: Custom HTML

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom HTML” module.

    Copy and paste the Code into editor:

     
    4.5.14 Quick link – Bottom3 Position

     
    Module Position – Module Suffix

    Position: Bottom3
    Module Class Suffix: Not use
    Module Type: Custom HTML

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom HTML” module.

    Copy and paste the Code into editor:

     
    4.5.15 Contact – Bottom4 Position
     
    Module Position – Module Suffix

    Position: Bottom4
    Module Class Suffix: sj_contact
    Module Type: Custom

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom” module.

    Copy & Paste the code into your editor:

     

    4.6 Extension Configuration – Layout2

    4.6.1 Top social index 2 – Top1 Position

     
    Module Position – Module Suffix

    Position: Top1
    Module Class Suffix: Not use
    Module Type: Custom

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom” module.

    Copy & Paste the code into your editor:

     
    4.6.2 Search Top index2 – Top Search Position

     
    Module Position – Module Suffix

    Position: Top Search
    Module Class Suffix:blank search_topindex2
    Module Type: Smart Search

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Smart Search” module.

    4.6.3 Main Slideshow index2 – Slideshow Position

     
    Module Position – Module Suffix

    Position: Slideshow
    Module Class Suffix: Not Use
    Module Type: Custom

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom” module.

    Copy & Paste the code into your editor:

     

    4.6.4 maintop1 – Maintop1 Position

     
    Module Position – Module Suffix

    Position: Maintop1
    Module Class Suffix: Not Use
    Module Type: Custom

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom” module.

    Copy & Paste the code into your editor:

     

    4.6.5 maintop2 – Maintop2 Position

     
    Module Position – Module Suffix

    Position: Maintop2
    Module Class Suffix: Not Use
    Module Type: Custom

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom” module.

    Copy & Paste the code into your editor:

     

    4.6.6 Course categories index2 maintop3 – Maintop3 Position

     
    Module Position – Module Suffix

    Position: maintop3
    Module Class Suffix: sj-categories
    Module Type: SJ Categories for K2

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “SJ Categories for K2” module.

    4.6.7 maintop4 – maintop4 Position

     
    Module Position – Module Suffix

    Position: maintop4
    Module Class Suffix: Not Use
    Module Type: Custom

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom” module.

    Copy & Paste the code into your editor:

     

    4.6.8 maintop5 – maintop4 Position

     
    Module Position – Module Suffix

    Position: maintop5
    Module Class Suffix: Step index2
    Module Type: Custom

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom” module.

    Copy & Paste the code into your editor:

     

    4.6.9 Popular Free Courses – Spotlight1 Position

     
    Module Position – Module Suffix

    Position: Spotlight1
    Module Class Suffix: sjpopularfreecourses
    Module Type: SJ Extra Slider for K2

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “SJ Extra Slider for K2” module.

    4.6.10 Sj K2 Filter index 2 – Spotlight2 Position

     
    Module Position – Module Suffix

    Position: Spotlight2
    Module Class Suffix: sjextrafieldsfilter
    Module Type: Sj K2 Filter

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Sj K2 Filter ” module.

    4.6.11 Learning online index2 – Spotlight3 Position

     
    Module Position – Module Suffix

    Position: Spotlight3
    Module Class Suffix: Not Use
    Module Type: Custom

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “Custom” module.

    Copy & Paste the code into your editor:

     
    4.6.12 Featured Courses – Spotlight5 Position

     
    Module Position – Module Suffix

    Position: Spotlight5
    Module Class Suffix: sjfeaturedcourses
    Module Type: SJ Extra Slider for K2

     
    Frontend Appearance

    Backend Settings

    To configure this module, please go to Extensions >> Module Manager >> Click “New” button to create a new module >> Select “SJ Extra Slider for K2” module.

    6SUPPORT – Back to top

    Thank you so much for purchasing this template. If you have any questions that are beyond the scope of this help file, please send us via: Submit a Ticket

    Thanks so much!