Black Friday"
0
Go To Cart
Your Cart is currently empty!
Product update
Coupon
add
Coupon code invalid! Please re-enter!
AJAX loader
Go To Cart Total : 0 checkout
You are here: HomeJoomla TemplatesTemplate User-GuidesSJ Education Template Userguide

SJ Education Template Userguide

August.19.2012
First of all, make sure you always download the newest version of template

REQUIREMENTS

- Joomla! v1.7.x and v2.5.x latest stable versions are highly recommended.

If you want to install the template that like as our demo (the same data), you should install the Quickstart Package. In the following 4-part guideline, we will help you install SJ Education and all extensions included in this template step by step by yourself.
  • 1. Download Template and Extensions
  • 2. SJ Education Template - Installation and Configuration
  • 3. Imperative Plugins - Installation and Configuration
  • 4. Extensions - Installation and Configuration

1. Download Template and Extensions

1.1 Using for membership of JTC - Joomla Template Club

STEP 1: LOGIN YOUR ACCOUNT

STEP 2: GO TO MEMBER AREA - DOWNLOAD PAGE

STEP 3: GO TO LIST PRODUCTS - DOWNLOAD

STEP 4: DOWNLOAD PACKAGES OF PRODUCT

1.2 Using for single product

DOWNLOAD PACKAGES IN THE EMAIL

2. SJ Education Template -Installation and Configuration

2.1 INSTALLATION

  • In Administrator page on Joomla! v1.7.x, go to Extensions -> Extension Manager
    On this page, click on Choose File button, choose our template and then click Upload & Install


  • Set SJ Education Template as default template

2.2 CONFIGURATION

The parameters of SJ Education Template are divided into the following areas:
  • General Settings
  • MainBody Columns Settings
  • Layout Settings
  • Style Settings
  • Top Menu Settings
  • Content Component
  • Advanced Options
alt

GENERAL SETTINGS

  • Generator tag - Generate tag for your template
  • Template Width Type - Choose width type of your template
  • Template Width - Change width of template here
  • Hide Main content block - Allow to hide content component for home page
  • Direction - Choose RTL/LTR Language
  • Logo Type - Choose your logo types: image or text type
  • Logo Text - For Text Type
  • Slogan - Change your slogan here
alt

MAINBODY COLUMNS SETTINGS

  • Main body width type - Choose width type: pixel/percentage
  • Main width - Change width of main body
  • Left/Right Width - Change width of Left/Right column
alt

LAYOUT SETTINGS

  • Default Mode View - We support Mobile View and Window View for your site.
  • Window layout - When a guest views your website on computer, this layout is used. You can choose the following options for your window layout
    • Full
    • Main - left - right
    • Left - Right - Main
    • Main - Left - Right
    • Main - right
    • Left - main
  • Mobile Layout - When a guest uses a mobile to view, this layout is used as default
  • Iphone layout - When a guest views the site on Iphone, this layout is used
  • Android layout - When a guest views the site on Android System, this layout is used
  • Handheld layout - When a guest views the site on a Handheld, this layout is used
  • Overwrite Layouts Windows - This parameter will be used for window mode. When you want to use another layout for a menu, you can use this one. Syntax:
    • Id1:Layout_Name1 | Id1:Layout_Name2 | ...
    With:
    • Id1, Id2...: Id of Menu. You can see the Id column in Menu Item Manager page
    • Layout_Name1, Layout_Name2...: The name of layout in templates/sj_education/layouts folder without tail .xml
alt

STYLE SETTINGS

  • Default Style - Choose a suitable style for your site. There're 6 different site styles
  • Default Font Size - Set default size for your template here.
  • Default Font-Family - Use this parameter to choose font-family for your site. The default font of this template is Arial.
  • Google Font-Family - This parameter allows you to use a google font for some html tags which are in Affected Selectors
  • Affected Selectors - Tags will be applied with google font.
alt

TOP MENU SETTINGS

  • Default Type Menu - Here is the list of menu which can be chosen default
  • Default Menu Style - We support four styles of Menu
    • CSS Menu
    • Moo Menu
    • Mega Menu
    • Droplinle Menu
  • Use JS for Dropline Menu - Choose to use JS effect for Dropline Menu or not
  • Javascript Effect - JS Effect for Moo Menu, Mega Menu
  • Duration Effect - Time to change effects
  • Start Level - Level to start rendering the Menu at
  • End Level - Level to end rendering the Menu at
alt

CONTENT COMPONENT

  • Apply for Blog View - Choose to apply for Blog view or not
  • Apply for Frontpage view - Choose to apply for Frontpage view or not
  • Leading Images Width - Change width of images of Leading Articles.
  • Leading Images Height - Change height of images of Leading Articles.
  • Intro Images Width - Change width of images of Intro Articles.
  • Intro Images Height - Change height of images of Intro Articles.
  • Thumbnail Background Color - Set color background for thumbnail image
  • Thumbnail Mode - Set thumbnail mode
    • Fill
    • Fit
    • Stretch
    • Center
alt

ADVANCED OPTIONS

  • Show Cpanel - Allow you to show/ not to show Cpanel
  • Override logo image - Change logo image of Cpanel by inserting path of image in code folder or live link of image here
  • Include LazyLoad Plugin - Allow you include LazyLoad Plugin. It makes the web pages which are containing many large images load faster.
  • Enable jquery - Enable/disable jquery
  • Optimize CSS/Merge File - Allow to optimize all the CSS/Merge Files which are used in your website
  • Optimize CSS Exclude - Please insert name of CSS File which you don't want to optimize
  • Optimize JS - Allow to optimize all the JS Files which are used in your website
  • Optimize JS Exclude - Please insert name of JS File which you don't want to optimize
  • Optimize Folder - This is the folder where optimized css/js files are stored
  • Optimize HTML - Allow to optimize all the HTML Files which are used in your webite
  • Enable Google Analytics - Enable/disable Google Analytics
  • Enter your Google Analytics tracking ID - Copy and paste your Google Analytics tracking ID here

3. Imperative Plugins-Installation and Configuration

You need to install Yt Plugin(for Yt Framework) and SJ Core plugin. Yt Plugin supports Yt Framework for adding extra parameters to use for Mega Menu and compressing CSS/ JS or HTML. SJ Core is using for resizing images in Content Component and extensions of SmartAddons.

3.1 INSTALLATION

  • STEP 1: In Administrator page on Joomla! v1.7.x, go to Extensions -> Extension Manager
    On this page, click on Choose File button, choose the plugins and then click Upload & Install


  • STEP 2: Perform enable to SJ Core and Yt Plugin in Extension/Plug-in Manager

3.2 CONFIGURATION - YT Plugin(for Yt Framework)

  • Yt Plugin supports for Optimizing CSS/ JS/ HTML and Mega Menu. You can see part of optimizing CSS/JS/HTML in configuration of SJ Education and supporting for Mega Menu in any Menu Items. Please see the following example:
    • SUPPORT OPTIMIZING CSS/ JS/ HTML AND MEGA MENU
  • After installing Yt Plugin, please to go Extension/Plug-in Manager and then go to config Yt Plugin as below:
    • GO TO CONFIG PLUGIN
  • In configuration of Yt Plugin, we support for showing SJ Help with Report Bugs, Template Tutorials, Framework Tutorials
    • SHOWING SJ HELP

    4. Extensions - Installation and Configuration

    4.1 INSTALLATION

    4.1.1 List of extensions used in SJ Education demo

    You can find a list of modules/plugins/components which are used in SJ Education by clicking on Features Menu - Extensions

    4.1.2 Installation

    • In Administrator page on Joomla! v1.7.x, go to Extensions -> Extension Manager
      On this page, click on Choose File button, choose an extension and then click Upload & Install


    • Install all of the rest extensions as above

    4.2 CONFIGURATION

    After installing extensions which are included in the SJ Education template, please to go Extensions/Module (Plug-in) Manager and then choose the module/plug-in. The following example is Module Manager:

    4.2.1 SJ Content Slideshow Module

  • Module Position - Module Suffix
    • Position: slide_show
    Suffix: Not Used
  • Frontend - Backend
    • FRONTEND - SJ CONTENT SLIDESHOW
    BACKEND - SJ CONTENT SLIDESHOW

    4.2.2 Showing Content Component

    This part will help you to show the Frontpage at Home Site. First, go to Menus/ Main Menu/ Home then go to Edit Menu Item - Home
  • Frontend - Backend
    • FRONTEND - CONTENT COMPONENT
    BACKEND - CONTENT COMPONENT

    4.2.3 SJ Article Slider Module - Upcoming events

  • Module Position - Module Suffix
    • Position: main_bottom1
    Suffix: title3
  • Frontend - Backend
    • FRONTEND - UPCOMING EVENTS
    BACKEND - UPCOMING EVENTS

    4.2.4 SJ Basic News Module - About Programs

  • Module Position - Module Suffix
    • Position: main_bottom2
    Suffix: title3
  • Frontend - Backend
    • FRONTEND - ABOUT PROGRAMS
    BACKEND - ABOUT PROGRAMS

    4.2.5 Module Latest News

  • Module Position - Module Suffix
    • Position: right_top
    Suffix: Not Used
  • Frontend - Backend
    • FRONTEND - MODULE LATEST NEWS
    BACKEND - MODULE LATEST NEWS

    4.2.6 SJ Article Slider Module - Our Teachers

  • Module Position - Module Suffix
    • Position: right
    Suffix: Not Used
  • Frontend - Backend
    • FRONTEND - OUR TEACHERS
    BACKEND - OUR TEACHERS

    4.2.7 SJ Basic News Module - Our Mission

  • Module Position - Module Suffix
    • Position: right
    Suffix: title1 custom-basicnew
  • Frontend - Backend
    • FRONTEND - OUR MISSION
    BACKEND - OUR MISSION

    4.2.8 Custom HTML - Mobile Ready

  • Module Position - Module Suffix
    • Position: right_bottom
    Suffix: icon info
  • Frontend - Backend
    • FRONTEND - MOBILE READY
    BACKEND - MOBILE READY

    4.2.9 Custom HTML - Testimonials

  • Module Position - Module Suffix
    • Position: content_bottom
    Suffix: icon testimonials
  • Frontend - Backend
    • FRONTEND - TESTIMONIALS
    BACKEND - TESTIMONIALS

    4.2.10 Module Menu

  • Module Position - Module Suffix
    • Position: user10, user11, user12
    Suffix: Not Used
  • Frontend - Backend
    • FRONTEND - MODULE MENU
    BACKEND - MODULE MENU

    4.2.11 Custom HTML - Contact Us

  • Module Position - Module Suffix
    • Position: user13
    Suffix: Not Used
  • Frontend - Backend
    • FRONTEND - CONTACT US
    BACKEND - CONTACT US

    4.2.12 Custom HTML - Newsletter

  • Module Position - Module Suffix
    • Position: user14
    Suffix: newsletter
  • Frontend - Backend
    • FRONTEND - NEWSLETTER
    BACKEND - NEWSLETTER

    4.2.13 Mega Menu - Features

  • Menu Item Type
    • Menu Item Type: Text Separator
  • Frontend - Backend
    • FRONTEND - MEGA MENU FEATURES
    BACKEND - MEGA MENU FEATURES
    BACKEND - TREE OF MEGA ITEMS

    4.2.14 Mega Menu - Joomla

  • Menu Item Type
    • Menu Item Type: Text Separator
  • Frontend - Backend
    • FRONTEND - MEGA MENU JOOMLA
    BACKEND - MEGA MENU JOOMLA
    BACKEND - TREE OF MEGA ITEMS
    BACKEND - ABOUT JOOMLA
    BACKEND - FEATURED ARTICLES

    4.2.15 Mega Menu - K2

  • Menu Item Type
    • Menu Item Type: Text Separator
  • Frontend - Backend
    • FRONTEND - MEGA MENU K2
    BACKEND - MEGA MENU K2
    BACKEND - TREE OF MEGA ITEMS
    BACKEND - K2 CATEGORIES
    BACKEND - FEATURED ITEMS

    4.2.16 Mega Menu - Virtuemart

  • Menu Item Type
    • Menu Item Type: Text Separator
  • Frontend - Backend
    • FRONTEND - MEGA MENU VIRTUEMART
    BACKEND - MEGA MENU VIRTUEMART
    BACKEND - TREE OF MEGA ITEMS
    BACKEND - K2 VIRTUEMART
    BACKEND - NEW PRODUCTS

    Love all our templates?

    Join our membership clubs starting at $49 only for access to all of our templates

    Join Now
    Home Pricing
    0
    Go To Cart
    Your Cart is currently empty!
    Product update
    Coupon
    add
    Coupon code invalid! Please re-enter!
    AJAX loader
    Go To Cart Total : 0 checkout
    SearchSupport
    Magento Themes Magento Extensions Free Magento Extensions Prestashop Themes Prestashop Modules Magento 2 Themes