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 download 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 you want to install, then click Save button
  • After that you will JMS Enter theme in theme listing.
  • Choose JMS Enter , 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 Enter 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 upload jms_enter.zip to the "/themes" directory on your server.
  2. Login to your back-office and go to "Preferences" -> "Themes'. Click "Add new theme" button on right top.
  3. In Import from FTP part, select "jms_enter.zip" file in select box, then click Save button.
  4. After that you will JMS Enter theme in theme listing.
  5. Choose JMS Enter , then click "Use this theme" button
  6. On this step you will get information about theme installation status. Please mark all items (modules) you want and click "Save" button
  7. 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!

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 to regenerate images.

JMS Enter supports 9 default homepage layouts. Admin also can add more homepage layouts in backend easy.

JMS Enter have lots of modules used. Some are prestashop default module and some are developed by Joommasters team for JMS Enter from scrach or slightly modified prestashop default modules.Go to Modules->Modules, then choose author is Joommasters, you will see all my modules

JMS Pager builder

This module allows you to manage layouts for homepage of your site.

Theme setting :

  • Home page: choose home page layout layout you want
  • Product hover: choose effect for product hover box
  • Shop fullpage: Product List full page Enabled, Disabled.
  • Setting panel: Show or Hide setting panel at front end, on your website, you should set it is No

Homepages

it manages homepage layouts

  • 1: Add new button
  • 2: Export layout homepage to xml
  • 3: Edit layout homepage.
  • 4: Delete button

Each Homepage, you can choose Header, Body and Footer from list, add link to custom css and custom font for this homepage

Header

It allows you create unlimited profiles for header. Each profile will have many rows, each row will have many positions, each position you can add many blocks, each block will be a module, custom html or image.

Backend of module:

  • 1: Add new header button
  • 2: Duplicate header
  • 3: Edit header.
  • 4: Row list of header
  • 5: Delete header

You can see profile list, you can add more profiles for header, edit, duplicate, delete current profile.

Detail of each profile:

Each profile will has many rows, each row will has many positions, each position you can add many blocks.Click on Row list button for viewing row list:

  • 1: Layout button with selection for making layout for desktop, medium device, tablet and mobile
  • 2: Add new row
  • 3: Save button.
  • 4: A Row
  • 5: A position
  • 5: A block, it can be a custom html or a module

Detail row:

As you can see, row 1 Topbar has 1 position is Topbar Right,you can add position by click on Add position button.Detail position:

  • Title : name of this position
  • Class suffix: class suffix for this position
  • Desktop width : set width for this position base on grid 12 columns for screen >1200px
  • Medium device width : set width for this position base on grid 12 columns for screen >=1200px
  • Tablet width : set width for this position base on grid 12 columns for screen >=768px
  • Phone width : set width for this position base on grid 12 columns for mobile screen < 768px
  • Active : Yes or No

you can drag and drop for changing position and changing width of each position.Click on arrow at right of each position you will have some buttons:

Each position you can add multi block, we have some type of block:html, module, link

For Html type:

  • Title : name of block
  • Show title: Yes or No
  • Html Content : Html Content
  • Active : Yes or No

For Assign module type:

  • Module assign : choose module for this block
  • Hook : choose hook function of this module for showing

For Link type: it doesn't support in this version

As you can see in this default profile of header, we have 3 rows

Row 1 TopBar has 1 position is Topbar Right, TopBar Right position has 2 blocks are Language (module language) and Currencies (module currency)

Row 2 HeaderBar, it has 2 positions are Logo position and Right position. Logo position has block Logo (custom html), and Right Position has 3 block are Search box (JMS Ajax search module), User info (module user information) and Cart (cart module)

Row 3 Main Menu, it has 1 position is Mainmenu position, it has block Mainmenu block (JMS Drop megamenu)

You can change width of positions for each screen by choosing layout, then drag and drop positions following grid 12 columns

JMS Theme Body

It allows you create unlimited profiles for body. Each profile will have many rows, each row will have many positions, each position you can add many blocks, each block will be a module, custom html.

Management body is similar as management header

JMS Theme Footer

It allows you create unlimited profiles for footer. Each profile will have many rows, each row will have many positions, each position you can add many blocks, each block will be a module, custom html.

Backend of module:

You can see profile list, you can add more profiles for footer, edit, duplicate, delete current profile. You can choose what profile will display at frontend in JMS Setting module.

Detail of each profile:

Each profile will has many rows, each row will has many positions, each position you can add many blocks.Rows list:

You can drag and drop for changing ordering of rows, width and ordering of positions in each row.

Detail row:

As you can see, row 1 Footer Row has 4 positions are Company, Help, From The Blog and Follow Us, you can drag and drop for changing ordering and changing width of each position.Click on arrow at right of each position you will have some buttons:

Detail position:

  • Title : name of this position
  • Class suffix: class suffix for this position
  • Desktop width : set width for this position base on grid 12 columns for screen >1200px
  • Medium device width : set width for this position base on grid 12 columns for screen >=1200px
  • Tablet width : set width for this position base on grid 12 columns for screen >=768px
  • Phone width : set width for this position base on grid 12 columns for mobile screen < 768px
  • Active : Yes or No

Each position you can add multi blocks, we have some type of block:html, module, link

For Html type:

  • Title : name of block
  • Show title: Yes or No
  • Html Content : Html Content
  • Active : Yes or No

For Assign module type:

  • Module assign : choose module for this block
  • Hook : choose hook function of this module for showing

For Link type: you can add links as you want

Best option is use Html type instead of Link type block

As you can see in this default profile of footer, we have 2 rows

As you can see, row 1 Footer Row has 4 positions are Company, Help, From The Blog and Follow Us, Company has 1 block is Company (custom html), Help has 1 block is Help (custom html), From The Blog has 1 block is From The Blog (module JMS Advance blog), and Follow Us has 2 blocks are Follow Us (module block social) and Newsletter (module newsletter)

Row 2 Copyright Row, it has 1 position is Copyright, Copyright has 1 block is Copyright(custom html)

You can change width of positions for each screen devices by choosing layout, then drag and drop positions following grid 12 columns

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.
  • Menu class suffix: class for this menu item.
  • Active: Active or not.

Example : make submenu for "Shop" menu like demo:

You can see demo, "Shop" has submenu with 4 columns are 4 submenu level 1 and their own submenu level2, so set Full Width is No, Column of Sub menus is 4. "Shop" item has 4 submenu items level 1

Detail of "New arrivals" submenu item: set "Column of Sub menus" is 1, set "Width" is 3 (that mean if whole width submenu of Megamenu is 12, "New arrivals" has width is 3), set Group is Yes. Then you can add submenu level 2 of "New arrivals".

Same for "Clothes", "Shoes" and "Sale" submenu item.

JMS Slider layer module

Jms Slider Layer is an all-purpose slide displaying solution that allows for showing almost any kind of content with highly customizable, transitions, effects and custom animations. Frontend of module :

General setting

  • The mode of the slider : Slider Mode (boxed, fullwidth, fullscreen).
  • Slider Class Suffix : Class Suffix for slider, this class added to cover div of slider.
  • Touch Enabled : Enable Swipe Function on touch devices.
  • Delay : The time one slide stays on the screen in Milliseconds
  • Grid Height : This Height of the Grid where Layers are displayed in Pixel. This Height is the Max Height of the Slider in Fullwidth Layout and in Responsive Layout. In Fullscreen Layout the Grid will be centered Vertically in case the Slider is higher than this value.
  • Grid Width : This Width of the Grid where Layers are displayed in Pixel. This Width is the Max Width of the Slider in Responsive Layout. In Fullscreen and in FullWidth Layout the Grid will be centered Horizontally in case the Slider is wider than this value.
  • Slider Shadow : The shadow style of the slider box. .
  • Spinner : The Layout of Loader. If not defined, it will use the basic spinner.
  • On Hover Stop : Stop the Timer if mouse is hovering the Slider. Caption/Layer animations are not stopped !! They will just play to the end.
  • Hide Timer Bar : Hidden the Timer Bar.
  • Timer Bar Position : The Position of timer bar.
  • Use Google Font : Enter google font family it loaded when use slider.

Navigation setting

  • Keyboard Navigation : Allows to use the Left/Right Arrow for Keyboard navigation when Slider is in Focus.
  • Navigation Type : Choose type of the "bullet/thumbnail" bar
  • Navigation Arrows : Choose position of the Navigation Arrows.
  • Navigation Style : The style of Bullets and Arrows if the navigation type is 'Bullet'.
  • Navigation Horizontal Align : Horizontal Align of the Navigation bullets / thumbs (depending on which navigation type was selected).
  • Navigation Vertical Align : Vertical Align of the Navigation bullets / thumbs (depending on which navigation type was selected).
  • Navigation Horizontal Offset : The Horizontal Offset position of the navigation depending on the aligned position.
  • Navigation Vertical Offset : The Vertical Offset position of the navigation depending on the aligned position.

Image setting

  • Image Resize : image resize setting for background image: Yes or No.
  • Image Width : This Width of image in Pixel. This Value use for resize image and Max-Width.
  • Image Height : This Height of image in Pixel. This Value use for resize image and Max-Height.
  • Thumbnail Width : This Width of image in Pixel, use for resize thumbnail
  • Thumbnail Height : This Height of image in Pixel, use for resize thumbnail

Slides list

  • Add slide button : user for adding slide.
  • Enable/Edit/Delete button : user for enable/edit/delete slide.
  • Duplicate button : user for add a copy of current slider.
  • Layers manager button : click on it for viewing layers manager page of each slider.

Detail slide - General setting

  • Title : name of slide.
  • Language : choose language for this slide.
  • Transition : The appearance transition of this slide.
  • Slot Amount : The number of slots or boxes the slide is divided into. If you use boxfade, over 7 slots can be juggy.
  • Master Speed : The speed of the transition in "ms". default value is 300 (0.3 sec).
  • Delay : A new delay value for this Slide. If it is defined, it will overwrite the default delay time in general setting of the module.
  • Link : A link on the whole slide pic. Current version doens't support this param
  • Target : The target of the Link for the whole slide pic.
  • Ken Burn : Yes or No
  • Background Repeat : Yes or No
  • Background Position : position of background
  • Background Position End : For Ken Burns Animation. This is where the IMG will be animatied
  • Background Fitting : choose type of fitting
  • Background Fitting End : Use only a Number . i.e. 300 will be a 300% Zoomed image where the basic 100% is fitting with width or height.
  • Active : Active or Not

Detail slide - Background & Thumbnail

If background type is Yes

  • Background Image : upload background image
  • Thumbnail : Please upload thumbnail image to modules/jms_sliderlayer/images/thumbs/ folder.If use Default it will get thumbnail of background image.

If background type is No

  • Background Color : choose color
  • Thumbnail : Please upload thumbnail image to modules/jms_sliderlayer/images/thumbs/ folder.If use Default it will get thumbnail of background image.

Detail slide - Layers manager

It has 4 parts:

  • Part 1 : grid view of layers, where you can view all layers in this slide, drad and drop layers to position you want
  • Part 2 : 3 buttons what allow you to add more layers : text layer, image layer and video layer
  • Part 3 : list of layers in this slide, you can drag and drop for changing ordering of layers, also can delete layer as you want
  • Part 4 : when you click on layer on list part or click on layer on grid part, detail of that layer will display on left side

Add layer text: Enter text or htm you want to show

Add layer image: Chose image from list to show. Please upload image layers via ftp in modules/jmssliderlayer/views/img/layers folder

Add layer video: select type of video (vimeo or youtube), fill id of video , video width and video height

Detail of layer text

  • Title : name of layer.
  • Layer Class : class in css of layer. These are Styling classes created in the settings.css You can add unlimited amount of Styles in your own css file, to style your captions at the top level already
  • Data X : Possible Values are 'left', 'center', 'right', or any Value between -2500 and 2500
  • Data Y : Possible Values are 'top', 'center', 'bottom', or any Value between -2500 and 2500.
  • Start : The timepoint in millisecond when/at the Layer should move in to the slide
  • End : The timepoint in millisecond when/at the Layer should move out from the slide
  • Incoming Animation : choose effect when this layer income on slider
  • Outgoing Animation : choose effect when this layer outcome on slider
  • Easing : The Easing Art how the layer is moved in to the slide
  • Text or html : Fill text or htl will show
  • Incoming Split Text : Split Text Animation (incoming transition) to 'words', 'chars' or 'lines'. This will create amazing Animation Effects on one go, without the needs to create more layers
  • Outgoing Split Text : Split Text Animation (incoming transition) to 'words', 'chars' or 'lines'. This will create amazing Animation Effects on one go, without the needs to create more layers

Detail of layer images

Same as layer text , only have more 1 field

  • Select Image: Please upload layers image to modules/jms_sliderlayer/images/layers/ folder, then choose image as you want

Detail of layer image

Same as layer text , only have more 4 fields

Detail of layer video

  • Video Source : choose type of video is youtube or vimeo
  • Video ID : fill ID of video
  • Video Width : width of video
  • Video height : height of video
  • Video Autoplay : video auto play when load or not

JMS Ajax search module

This module allows you searching product at frontend with ajax. Frontend of module :

Backend of module

  • Number of products to be displayed : display price or not.
  • Show Description : show description or not
  • Description character limit: limit charaters of description
  • Show Price: show price or not
  • Show Image: show image or not

JMS Advance Blog

This module allows you manage articles and show them at frontend as blog. Frontend of module :

Backend of module

Configuration of module

Blog post setting: this part will show at home

  • Title: title of module blog
  • Limit: limit of articles will be show in blog module
  • Show Image : show image or not
  • Thumb Width: thumb width
  • Thumb Height: thumb height
  • Show Description : show description or not
  • Show Readmore : show readmore or not
  • Show Category : show category or not
  • Show Date : show date or not
  • Show Description : show description or not
  • Show Views : show views or not
Tab setting

  • Number post: number of articles will show in each tab
  • Tab: choose tab you want to display
  • Active tab : show tab part or not
  • Active categories: show categories part or not
  • Active archives: show archives part or not
  • Active tags : show tags part or not
Blog comment setting

  • Minimum time between 2 reviews from the same user

Detail category

  • Title: title of cateogry
  • Alias: alias
  • Parent Category: parent category, default is Root
  • Description: description
  • Image: image of category
  • Active : active or not

List articles

Detail article

  • Title: title of cateogry
  • Alias: alias
  • Category: category
  • Created date: created date
  • Modified date: last modified date
  • Introtext: introtext of article, it will be displayed on blog module
  • Fulltext: full text will be displayed in detail article at frontend
  • Image: image of article, it will be displayed on blog
  • Link video: an iframe to video what you want to show in blog content
  • Image: image of article, it will be displayed on blog
  • Meta Description: meta description
  • Meta Keywords: meta keywords
  • Key reference: don't use in this version
  • Tags : tags of this content
  • Active : active or not

JMS Advance blog module supports 4 type of url for adding on menu with typs is link

  • Blog category: index.php?fc=module&module=jmsadvblog&cat_id=1&controller=cat , you can change cat_id by your category blog id you want to show
  • Single post: index.php?fc=module&module=jmsadvblog&item_id=2&controller=item , you can change item_id by your conent id you want to show
  • Blog archives: index.php?archives=2015-01&fc=module&module=jmsadvblog&controller=archives , you can change archives by your archives you want to show
  • Blog tags : index.php?fc=module&module=jmsadvblog&tags=fashion&controller=tags&id_lang=1 , you can change tags by your tags you want to show

Jms new products block

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

Backend of module:

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

Jms Product filter block

This is module allows you showing products of categories in tabs. Frontend of module :

Backend of module:

  • Display products' prices : Show price or not
  • Products Filter : choose type products will show
  • Categories : Choose category
  • Number of products for each category : ANumber products of each category will be show in tab

JMS brands slider module

This module allows you showing a slider of brands logo. Frontend of module :

Backend of module

  • Auto play : auto play or not.
  • Number of items : number of items will load
  • Number of items show: number of items will show each time

Detail each brand

  • Image : choose image.
  • Title: title
  • URL: url of brand logo when click on it
  • Active: active or not

JMS Top-sellers block

This is module allows you showing on best seller products. Frontend of module :

JMS Vertical menu block

This is module allows you showing vertical megamenu. Frontend of module :

JMS Vertical menu has parameters like JMS Drop megamenu

JMS Twitter block

This is module allows you showing Twitter feed. In this theme, my team doesn't use it but you can enable and use it as you want.

Onsale products block

This is module allows you showing onsale products. Frontend of module :

Backend:

JMS Custom html left

This module show custom html at Right column

JMS Custom html right

This module show custom html at Right column

Frontend of module :

HTML code in backend:

<div class="tweets block_right">
<div class="box-right">
<h3 class="title">Recent tweets</h3>
</div>
<div><em class="fa fa-twitter"></em>
<p>@designer <span class="comment">The new collection is here !</span> <a title="" href="#">http:/t.co/0000abcdef</a></p>
<div class="time-comment">about 2 days ago</div>
</div>
<div><em class="fa fa-twitter"></em>
<p>@designer <span class="comment">The new collection is here !</span> <a title="" href="#">http:/t.co/0000abcdef</a></p>
<div class="time-comment">about 2 days ago</div>
</div>
</div>

Other modules

Block language, block user info, block cart, block newsletter are default modules from Prestashop, my team just overwrited html, make them look better. .

FAQ

My JMS slider layer doesn't work, it only shows text ?

Please log in backend, go to Modules->Positions, add JMS Slider layer module to hook displayHeader.

How can I translate your modules to my language ?

Please log in backend, go to Localization -> Translations, choose Installed modules, theme is JMS Enter, your language, then click Save, you will go to a page where you can translate all modules. You can read more detail http://doc.prestashop.com/display/PS16/Translations

For custom html modules, you have to go to Modules->Modules, choose author is Joommasters, you will see al my modules, choose module custom html you want to translate, you can add content of module in each language as you want.

For JMS Drop megamenu, you have to edit each menu item, add name of item for each language

I upload logo in prestashop backend but it still show old logo ?

Prestashop doesn't support .png logo file of my theme doesn't use it for upload logo, you can go to JMS Theme Layout->JMS Theme Header, check Row list of profile header what you chosen, you will see block Logo, edit that block as you want. You can upload logo via FTP, then add link into this Logo block.

I chosen other Home page layout, but site still show default ?

Please go to Advanced Parameters -> Performance, turn off cache first, then check again. You can read more http://doc.prestashop.com/display/PS16/Performance+Parameters

When I turn on SEO friendly url, link of Home menu is wrong when I stay in detail product page ?

Please log in backend, go to Modules->Modules, configure JMS Drop megamenu, edit Home menu item, change link of it from "index.php" to "/index.php" or "http://yourdomain/index.php".

If I want to custom your theme, can I contact you ?

Yes, my team also do custom work for clients, please contact me via skype (my id is tungpscnc) or email (joommasters@gmail.com).