Search Login

JMS Kid

  • created: 15/07/2014
  • latest update: 16/07/2014
  • by: Joommasters.com
  • detail: JMS Kid
  • email: This email address is being protected from spambots. You need JavaScript enabled to view it.
  • skype: tungpscnc or nguyenngochai84

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email contact us. Thanks so much!

1. Please read the complete instruction
2. Make sure you have installed and running the correct version of Prestashop
3. Backup your system before do anything is best
 
 
We recommend to use this theme on a new, clean installation or existing shops without custom core modifications.

You can install the theme by two way

1. automatically installation

2. manually installation

Automatically installation of the theme

  1. First of all you downloaded archive
  2. Login to your back-office

 

  • Go to "Preferences -> Themes"
  • Click on "Add new theme" button on right hand
  • Click on "Add file" button for choosing theme__kid.zip file , then click Save button
  • After that you will JMS Kid theme in theme listing.
  • Choose JMS Kid , then click "Use this theme" button
  • On this step you will get information about theme installation status. Please mark all items (modules) you want and click "Save" button
  • Next step will inform you about modules installation status, and images settings update. Click Finish button

Congratulations! You have installed your new theme and to check it out, go to the front-end of your online shop and take a look at it!

Please check more JMS Kid modules for making site looking better.

 

Manually installation of the template

 

If you want to install this theme manually, you have to do following steps:

  1. Download and extract it locally.
  2. Upload the "themes" folder contents to the "/themes" directory on your server.
  3. Login to your back-office and go to "Preferences" -> "Themes'.
  4. Now select "jms_kid" theme in the "Theme appearance" section below
  5. Click to "Save" button
  6. Upload the "/modules" folder contents to the "/modules" directory on your server.
  7. Install each uploaded modules in back office, please remember to install JMS Setting module first. How to work with prestashop modules please read here http://doc.prestashop.com/display/PS16/Managing+Modules+and+Themes

Congratulations! You have installed your new theme and to check it out, go to the front-end of your online shop and take a look at it!

Configuring images

The dimensions of images are adapted to the design of this theme. We advice you to set the image dimensions according to the following screenshot:

To configure product image dimensions open PrestaShop admin panel, go to Preferences -> Images. In some cases after image dimensions changes you need regenerate images.

JMS Kid have lots of modules used. Some are prestashop default module and some are developed by Joommasters team for JMS Kid from scrach or slightly modified prestashop default modules.

JMS setting for theme

This module allows you to configure JMS Kid theme

  • Theme skin: choose skin color for website
  • Theme width: configure default width
  • Responsive: turn on responsive or not
  • background pattern: choose type pattern for background
  • Setting demo panel: show setting block at front-end or not

You can drag modules from left side to hooks on right side or drag modules from this hook to other hook.

In case frontend display not good after installation, you should check again hook of modules, modules should stay in hooks like image above.For some default modules of Prestashop, maybe you have to uninstall then install them again.

JMS Drop mega menu

It is a powerful mega menu for prestashop, supports responsive theme .

Configuring JMS Drop megamenu

Params for each menu item:

  • Name: Title will be display of menu item.
  • Parent: Choose parent of this menu item.
  • Menu Type:Choose type of menu item, has 9 types are product, category, link, cms, manufacturer, module, html, separator, supplier.
    • For product type, will display an input box for filling product id.
    • For category type, will display a select box for choosing category.
    • For cms type, will display a select box for choosing cms.
    • For link type, will display an input box for filling link.
    • For manufacturer type, will display a select box for choosing manufacturer.
    • For supplier type, will display a select box for choosing supplier.
    • For module type, will display 2 options are Show or Hide menu title, and display a select box for choosing module will display.
    • For html type, will display 2 option are Show or Hide menu title, and display text area for filling html.
  • Show title: show title of menu or not.
  • Menu Icon: menu has icon or not.
  • Icon class: choose class for Icon if you choose Menu Icon is yes.
  • Full width: configure submenu will be full width or not, choose yes for what main menu you want to have full width submenu.
  • Group: choose yes if you want this menu is head of 1 column, example you create 1 submenu with name is "Categories", choose Group is Yes, then create submenus of this menu are categories, you will have a column with title is "Categories", below are categories.
  • Column of Sub menus: Configure count of columns of sub menus
  • Width of Sub menus: Configure with of submenu in pixel
  • Width: If this menu is in level 2 you can use this value to change width for column, choose value from 1 to 12 .
  • Target: Choose trigger when click on this menu item, has 4 types are sefl, parent, blank, top.
  • Active: Active or not.

JMS Slideshow2

This module displays slideshow full width .

Params for each slide

  • Background image: background image for this slide
  • Small image: small image for this slide
  • Title : title of slide
  • Class: class for effect of this slide, have 7 classes : lefleft, leftright, rightright, updown, downdown, rupup, rupdown
  • URL: link for readmore button
  • Description : description of slide
  • Active : active or not

You can add html to this module for displaying at hook FootLeft.

HTML code:

<p>All Rights Reserved.Designed by <a href="#">Joommasters.com</a>. Powered by <a href="#">Prestashop</a>.</p>

JMS Custom Html Botcontent block

You can add html to this module for displaying at hook HomeTabContent.

Frontend of module :

Backend of module :

HTML code:

				<div class="blog-box">
<div class="blog-image"><img src="/modules/jms_customhtml_botcontent/images/prestashop_document/jms_kid/img1.jpg" alt="" />
<div class="mask"> </div>
</div>
<h4><a href="#">Vivamus eu tortor</a></h4>
<p>Pellentesque mollis consequat purus sit amet vulputate.</p>
<a class="blg-readmore" href="#">Read more</a></div>
<div class="blog-box">
<div class="blog-image"><img src="/modules/jms_customhtml_botcontent/images/prestashop_document/jms_kid/img2.jpg" alt="" />
<div class="mask"> </div>
</div>
<h4><a href="#">Vivamus eu tortor</a></h4>
<p>Pellentesque mollis consequat purus sit amet vulputate.</p>
<a class="blg-readmore" href="#">Read more</a></div>
<div class="blog-box">
<div class="blog-image"><img src="/modules/jms_customhtml_botcontent/images/prestashop_document/jms_kid/img3.jpg" alt="" />
<div class="mask"> </div>
</div>
<h4><a href="#">Vivamus eu tortor</a></h4>
<p>Pellentesque mollis consequat purus sit amet vulputate.</p>
<a class="blg-readmore" href="#">Read more</a></div>
<div class="blog-box">
<div class="blog-image"><img src="/modules/jms_customhtml_botcontent/images/prestashop_document/jms_kid/img4.jpg" alt="" />
<div class="mask"> </div>
</div>
<h4><a href="#">Vivamus eu tortor</a></h4>
<p>Pellentesque mollis consequat purus sit amet vulputate.</p>
<a class="blg-readmore" href="#">Read more</a></div>
<div class="blog-box">
<div class="blog-image"><img src="/modules/jms_customhtml_botcontent/images/prestashop_document/jms_kid/img3.jpg" alt="" />
<div class="mask"> </div>
</div>
<h4><a href="#">Vivamus eu tortor</a></h4>
<p>Pellentesque mollis consequat purus sit amet vulputate.</p>
<a class="blg-readmore" href="#">Read more</a></div>
<div class="blog-box">
<div class="blog-image"><img src="/modules/jms_customhtml_botcontent/images/prestashop_document/jms_kid/img2.jpg" alt="" />
<div class="mask"> </div>
</div>
<h4><a href="#">Vivamus eu tortor</a></h4>
<p>Pellentesque mollis consequat purus sit amet vulputate.</p>
<a class="blg-readmore" href="#">Read more</a></div>
<div class="blog-box">
<div class="blog-image"><img src="/modules/jms_customhtml_botcontent/images/prestashop_document/jms_kid/img1.jpg" alt="" />
<div class="mask"> </div>
</div>
<h4><a href="#">Vivamus eu tortor</a></h4>
<p>Pellentesque mollis consequat purus sit amet vulputate.</p>
<a class="blg-readmore" href="#">Read more</a></div>
<div class="blog-box">
<div class="blog-image"><img src="/modules/jms_customhtml_botcontent/images/prestashop_document/jms_kid/img4.jpg" alt="" />
<div class="mask"> </div>
</div>
<h4><a href="#">Vivamus eu tortor</a></h4>
<p>Pellentesque mollis consequat purus sit amet vulputate.</p>
<a class="blg-readmore" href="#">Read more</a></div>
				
				

Advance Footer

It is advanced footer module for Prestashop

Row 1 :

  • Newsletter : block newsletter
  • Follow Us : block JMS Social

Row 2 :

  • Information: Block CMS
  • My account: Block my account footer
  • Shop: custom html
  • Social channel: custom html
  • Store information: block contactinfos

This module supports multi rows, each row has multi blocks, each block has some 3 options : Custom Html, Assign module and Link.

  • Title : title of row
  • Class : class of row
  • Active : active or not

Detail of each block

  • Title : title of block
  • Show Title : show title or not
  • Width: % width of this block in row
  • Row: choose row for block
  • Block type: choose block type
  • Html content: html content for Custom html type of block

  • Module assign :choose module when you choose Block type is Assign module
  • Hook : choose hook function of module

This module supports to drop and drag rows and blocks, module will auto save

JMS New products block

This module allows you showing a slider of new products. Frontend of module :

Backend of module

  • Products to display : Define the number of products to be displayed in this block.
  • Number of days for which the product is considered 'new'
  • Always display this block: Show the block even if no new products are available.

JMS Featured products filter block

This module allows you showing a slider of featured products by category, you can select cateogry to view featured products or view all, module has a great effect for loading products. Frontend of module :

Backend of module

  • Display product's price : display price or not.
  • Number of products each category

This module allows you manage images and show them at frontend as slider. Frontend of module :

Backend of module

  • Auto play: slider at frontend auto play or not
  • Show navigation: show arrows or not
  • Lightbox image max width: max width of image when popup lightbox
  • Lightbox image max height: max height of image when popup lightbox
  • Column: number of columns when display images
  • Row: number of rows when display images

Detail of each image

  • Background image: image
  • Title: title of image
  • Url: url of image
  • Description: description of image
  • Active: active or not