Your Cart is currently empty!
Product update
Coupon
add
Coupon code invalid! Please re-enter!
AJAX loader
You are here: HomeJoomla TemplatesTemplate User-GuidesSJ Restaurant Templates Userguide

SJ Restaurant Templates Userguide

The 4-part guideline will help you easily install SJ Restaurant and all extensions included in this template step by step.
  • 1. Download Template and Extensions
  • 2. SJ Restaurant Template - Installation and Configuration
  • 3. Yt Plugin(for Yt Framework) - Installation and Configuration
  • 4. Extensions - Installation and Configuration

1. Download Template and Extensions

STEP 1: LOGIN YOUR ACCOUNT

STEP 2: GO TO YOUR DOWNLOAD AREA

STEP 3: GO TO CATEGORIES OF JOOMLA PRODUCTS

STEP 4: DOWNLOAD SJ RESTAURANT TEMPLATE

STEP 5: DOWNLOAD COMMERCIAL EXTENSIONS

STEP 6: DOWNLOAD FREE EXTENSIONS

2. SJ Restaurant 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 Restaurant Template as default template

2.2 CONFIGURATION

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

GLOBAL 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 Window Layout - 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_restaurant17/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 module
    • Mainmenu
    • Topmenu
    • Usermenu
    • Othermenu
    • Menu-link
    • Keyconcepts
    • Validate-menu
  • 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
  • Enable jquery - Enable/disable jquery
  • Enable Google Analytics - Enable/disable Google Analytics
  • Enter your Google Analytics tracking ID - Copy and paste your Google Analytics tracking ID here
  • 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

3. Yt Plugin(for Yt Framework) -Installation and Configuration

3.1 INSTALLATION

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


3.2 CONFIGURATION

  • 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
  • Yt Plugin supports for Optimizing CSS/ JS/ HTML and Mega Menu. You can see part of optimizing CSS/JS/HTML in configuration of SJ Restaurant and supporting for Mega Menu in any Menu Items. Please see the following example:
  • SUPPORT OPTIMIZING CSS/ JS/ HTML AND MEGA MENU

    4. Extensions - Installation and Configuration

    4.1 INSTALLATION

    4.1.1 List of extensions are used in SJ Restaurant demo

    You can find a list of modules/plugins which are used in SJ Restaurant on Mega 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 Restaurant 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 Position - Module Suffix
  • Position: slide_show
    Suffix: Not Used
  • Frontend - Backend
  • FRONTEND - SJ CONTENT SLIDESHOW
    BACKEND - SJ CONTENT SLIDESHOW

    4.2.2 Module Articles - Newsflash

  • Module Position - Module Suffix
  • Position: slide_show
    Suffix: news-flash
  • Frontend - Backend
  • FRONTEND - MODULE ARTICLES NEWSFLASH
    BACKEND - MODULE ARTICLES NEWSFLASH

    4.2.3 BREADCRUMBS - HOME

  • Module Position - Module Suffix
  • Position: breadcrumb
    Suffix: Not Used
  • Frontend - Backend
  • FRONTEND - BREADCRUMBS
    BACKEND - BREADCRUMBS

    4.2.4 Custom HTML - Follow Us

  • Module Position - Module Suffix
  • Position: top1
    Suffix: links
  • Frontend - Backend
  • FRONTEND - FOLLOW US
    BACKEND - FOLLOW US

    4.2.5 So Article Slider

  • Module Position - Module Suffix
  • Position: content-top
    Suffix: Not Used
  • Frontend - Backend
  • FRONTEND - SO ARTICLE SLIDER
    BACKEND - SO ARTICLE SLIDER

    4.2.6 SJ News Extra Slider

  • Module Position - Module Suffix
  • Position: content-top
    Suffix: Not Used
  • Frontend - Backend
  • FRONTEND - SJ NEWS EXTRA SLIDER
    BACKEND - SJ NEWS EXTRA SLIDER

    4.2.7 SJ Mega News

  • Module Position - Module Suffix
  • Position: content-top
    Suffix: title-1 border2 mega-news
  • Frontend - Backend
  • FRONTEND - SJ MEGA NEWS
    BACKEND - SJ MEGA NEWS

    4.2.8 Module Menu - Menu Left

  • Module Position - Module Suffix
  • Position: right
    Suffix: menu cate-bottom
  • Frontend - Backend
  • FRONTEND - MODULE MENU LEFT
    BACKEND - MODULE MENU LEFT
    BACKEND - LIST MENU ITEM IN MENU LEFT

    4.2.9 Module Search

  • Module Position - Module Suffix
  • Position: right
    Suffix: search-top
  • Frontend - Backend
  • FRONTEND - MODULE SEARCH
    BACKEND - MODULE SEARCH

    4.2.10 SJ Gallery

  • Module Position - Module Suffix
  • Position: right
    Suffix: default menu gallery
  • Frontend - Backend
  • FRONTEND - SJ GALLERY
    BACKEND - SJ GALLERY

    4.2.11 Module Latest News

  • Module Position - Module Suffix
  • Position: usere
    Suffix: lastest_news
  • Frontend - Backend
  • FRONTEND - MODULE LATEST NEWS
    BACKEND - MODULE LATEST NEWS

    4.2.12 Custom HTML - Testimonials

  • Module Position - Module Suffix
  • Position: usere
    Suffix: Not used
  • Frontend - Backend
  • FRONTEND - TESTIMONIAL
    BACKEND - TESTIMONIAL

    4.2.13 SJ Module Tabs

  • Module Position - Module Suffix
  • Position: right
    Suffix: tabs
  • Frontend - Backend
  • FRONTEND - SJ MODULE TABS
    BACKEND - SJ MODULE TABS

    4.2.14 SJ News Scrollbar

  • Module Position - Module Suffix
  • Position: user10
    Suffix: Not used
  • Frontend - Backend
  • FRONTEND - SJ NEWS SCROLLBAR
    BACKEND - SJ NEWS SCROLLBAR

    4.2.15 SJ Content Accordion

  • Module Position - Module Suffix
  • Position: user11
    Suffix: Not used
  • Frontend - Backend
  • FRONTEND - SJ CONTENT ACCORDION
    BACKEND - SJ CONTENT ACCORDION

    4.2.16 Locations - Custom HTML

  • Module Position - Module Suffix
  • Position: user12
    Suffix: localtions
  • Frontend - Backend
  • FRONTEND - CUSTOM HTML - LOCATIONS
    BACKEND - CUSTOM HTML - LOCATIONS
    CODE - CUSTOM LOCATIONS
          
    <ul>
    <li class="address"><a>Nguyen Phuc Lai Street - Dong Da District - Ha Noi City</a></li>
    <li class="mail">contact@ytcvn.com</li>
    <li class="phone"><a>084 - 04 - 12345678</a></li>
    </ul>
    <img src="http://smartaddons.s3.amazonaws.com/images/userguide/sj-restaurant-j17-temp/map.jpg" border="0" />
    

    4.2.17 Module Menu - Menu Footer

  • Module Position - Module Suffix
  • Position: footnav
    Suffix: _menu
  • Frontend - Backend
  • FRONTEND - MODULE MENU FOOTER
    BACKEND - MODULE MENU FOOTER
    BACKEND - LIST MENU ITEM IN MENU FOOTER

    4.2.18 Header - Custom HTML

  • Module Position - Module Suffix
  • Position for Header - Lunch: header1
    Position for Header - Dinner: header2
    Suffix: Not Used
  • Frontend - Backend
  • FRONTEND - CUSTOM HTML - HEADER
    BACKEND - CUSTOM HTML - HEADER LUNCH
    CODE - CUSTOM HEADER LUNCH
    
    Lunch
    
    <ul>
    <li>Mon - Fri: 11:00 am - 3:00 pm</li>
    <li>Fri - Sat: 11:00 am - 3:00 pm</li>
    <li>Sun: Closed</li>
    </ul>
    
    
    
    BACKEND - CUSTOM HTML - HEADER DINNER
    CODE - CUSTOM HEADER DINNER
    
    Dinner
    
    <ul>
    <li>Mon - Fri: 11:00 am - 3:00 pm</li>
    <li>Fri - Sat: 11:00 am - 3:00 pm</li>
    <li>Sun: Closed</li>
    </ul>
    
    
    

    4.2.18 Header - Custom HTML

  • Module Position - Module Suffix
  • Position for Header - Lunch: header1
    Position for Header - Dinner: header2
    Suffix: Not Used
  • Frontend - Backend
  • FRONTEND - CUSTOM HTML - HEADER
    BACKEND - CUSTOM HTML - HEADER LUNCH
    CODE - CUSTOM HEADER LUNCH
    
    Lunch
    
    <ul>
    <li>Mon - Fri: 11:00 am - 3:00 pm</li>
    <li>Fri - Sat: 11:00 am - 3:00 pm</li>
    <li>Sun: Closed</li>
    </ul>
    
    
    
    BACKEND - CUSTOM HTML - HEADER DINNER
    CODE - CUSTOM HEADER DINNER
    
    Dinner
    
    <ul>
    <li>Mon - Fri: 11:00 am - 3:00 pm</li>
    <li>Fri - Sat: 11:00 am - 3:00 pm</li>
    <li>Sun: Closed</li>
    </ul>
    
    
    

    4.2.19 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.20 Mega Menu - About Us

  • Menu Item Type
  • Menu Item Type: Text Category Blog
  • Frontend - Backend
  • FRONTEND - MEGA MENU ABOUT US
    BACKEND - MEGA MENU ABOUT US
    BACKEND - "ABOUT US" CUSTOM HTML
    CODE - CUSTOM OUTPUT
    <strong>Sj Restaurent</strong> mes pede elit nibh at risus tempus. Nulla semper ac nec sit massa In Curabitur id risus sit.
     
    Non ante gravida eros quis justo sed <em>nonummy et</em> Donec et. <strong>Hendrerit velit</strong> orci sagittis eu.
    
    BACKEND - "VIDEO" CUSTOM HTML

    4.2.21 Mega Menu - Services

  • Menu Item Type
  • Menu Item Type: Category Blog
  • Frontend - Backend
  • FRONTEND - MEGA MENU SERVICES
    BACKEND - MEGA MENU SERVICES
    BACKEND - TREE OF MEGA ITEMS
    BACKEND - MENU OUR MENUS
    BACKEND - MENU ORDER PARTY
    BACKEND - MENU HOT NEWS

    4.2.22 Mega Menu - Extensions

  • Menu Item Type
  • Menu Item Type: Category Blog
  • Frontend - Backend
  • FRONTEND - MEGA MENU EXTENSIONS
    BACKEND - MEGA MENU EXTENSIONS
    BACKEND - TREE OF MEGA ITEMS

    4.2.23 Mega Menu - Contact Us

  • Menu Item Type
  • Menu Item Type: Single Contact
  • Frontend - Backend
  • FRONTEND - MEGA MENU CONTACT US
    BACKEND - MEGA MENU CONTACT US
    BACKEND - MODULE CONTACT IMAGE
    BACKEND - MODULE CONTACT FORM

    Love all our templates?

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

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