Winner - Responsive Prestashop Theme

The Documentation

THANK YOU FOR PURCHASING OUR THEME!

Winner is super flexible Prestashop theme for multipurpose with a clean, simple and clear for creating your best online store. This responsive theme featured with 4 homepage layouts, unlimited color styles, powerful Mega Menu, List and Grid products view, Product Quick view and Product Image Zoom,.. In addition, flexible settings, fast loading, premium modules, fast support and much more. The theme is built with latest web technologies and SEO optimized to make it friendly with search engines. We Build is the right choice if you want to create professional and truly unique eCommerce website with ease.

Compatible with Prestashop version: 1.7.1.1, 1.7.1.0, 1.7.0.6, 1.7.0.5, 1.7.0.4, 1.7.0.x

You can find out more about theme updates, new features and about our upcoming themes:

If you like this theme please rate it.

Here are some basics on installing, configuring and customizing the our themes.

Have a great day!

Sincerely,

FieldThemesTeam

General about Prestashop

+ Prestashop FAQ:

• http://www.prestashop.com/en/faq

• http://doc.prestashop.com/display/PS16/FAQ

+ System Requirements:

• http://www.prestashop.com/en/system-requirements

• http://doc.prestashop.com/display/PS16/What+you+need+to+get+started

+ System administrator guide: http://doc.prestashop.com/display/PS16/System+Administrator+Guide

+ Installation Guide: http://doc.prestashop.com/display/PS16/Installing+PrestaShop

+ Online prestashop guide: http://www.prestashop.com/en/features

+ Prestashop forum: http://www.prestashop.com/forums/

Set up Prestashop

1. Prepare your Prestashop:

+ Important things you need to know before you start using Prestashop:

• Before you get started, make sure you have all the requirements available: server space at a hosting provider, domain name, FTP client, text editor.

• Makes sure to follow the instructions in the "What you need to get started" page first: http://doc.prestashop.com/display/PS16/What+you+need+to+get+started

• After Prestashop is installed, you must delete “install” folder in your prestashop.

+ You install new website with database sample. After you install your website like our demo.

2. You can download the latest version of PrestaShop at: http://www.prestashop.com/en/download

+ If you need to download any of the previous versions, go to this address: http://www.prestashop.com/en/developers-versions. Scroll down to the "Previously released versions" section.

+ Note that it is never recommended to use any other version than the current stable one.

+ Click on the "Download now" button, and save the archive on your computer (such as on your Desktop).

+ Using a Zip tool, extract the content of the archive to a known location on your hard-drive (such as on the Desktop again). Do not upload the Zip file directly to your server.

+ Since version 1.5.4, the Zip archive has two items at its root:

• The "prestashop" folder, which contains the PrestaShop files that you are about to upload to your web server.

• The "Install_PrestaShop.html" file, which opens the current "Installing PrestaShop" page in your default web browser.

+ The HTML files should not be uploaded on your web server.

3. Uploading PrestaShop: Using the free FileZilla (http://filezilla-project.org/)

+ You should now have a hosting space at your disposal (if not, read the "What you need to get started" chapter of this guide), and a folder on your hard-drive with the uncompressed PrestaShop archive.

+ This step makes you upload the PrestaShop files on your hosting space. This is done by connecting your computer to your server using a tool known as a "FTP client", which you should have installed while reading the "What you need to get started" chapter. We will be using the free FileZilla (http://filezilla-project.org/).

+ Connect to your hosting space using your FTP client, by using the connection details provided by your web host (if not, contact your host). Once connected, it is time to transfer the PrestaShop files from your computer to your server.

+ In FileZilla, browse your local folders until you find the one that contains the PrestaShop files. Keep it open in the "Local site" section on the left.

  

+ In the "Remote site" section, browse to the location where you want PrestaShop to be publicly available (root of the domain, sub-folder, sub-domain...) This can change a lot, depending on both your host and your needs:

• Some hosts may require you to place your files in a specific folder, such as /htdocs, /public_html, /web, /www, /yourdomainname.com, etc.

• Other hosts' FTP server will simply log you directly into the proper upload space.

• If you want your shop to be the main website for your domain name (http://www.myprestashop.com), upload PrestaShop at the root folder of the upload space (which may depend on the host).

• If you want your shop to be in a sub-folder of your domain name (http://www.mywebsite.com/shop), you must first create said folder through FileZilla (right-click and choose "Create directory"), then upload PrestaShop in that folder.

• If you want your shop to be in a sub-domain of your domain name (http://shop.mywebsite.com), you must first create said sub-domain. This depends on your host: you might be able to do it simply by adding a new folder with your FTP client, or you might have to create the sub-domain through your host's administration panel. Read your host's support documentation first. Once created, browse to the sub-domain's folder, and upload PrestaShop there.

+ On FileZilla's left side, you should now have the local folder where you keep the PrestaShop files from the Zip archive, and on the right side, the destination location. If you haven't done it yet, uploading is simple: select all files and folders from the local folder (use Ctrl-A), and either drag & drop them to the remote folder, or right-click on the selection and choose "Upload" in the context menu.

  

+ Uploading can take several minutes, as PrestaShop uses more than 7500 files and almost 1000 folders. After a while, all of PrestaShop's files and folders should be online. Great!

4. Creating a database for your shop

+ Before you can actually install PrestaShop, you need to make sure your MySQL server has a database ready for PrestaShop's data. If not, you must create one.

+ Some hosts prefer to have customers use a graphic control panel, such as cPanel, Plesk or a custom-made one. Make sure you read your host's documentation about handling MySQL databases, and create a database for your shop by following their specific explanations

+ Then create database

+ Connect to phpMyAdmin using your account credentials, which your host provided you with. It should be accessible through a standard URL, tied to your domain name, or host's domain name

5. Launching the auto-installer

+ Click “Next” to continue.

+ Click “Next” to continue.

+ Click “Next” to continue.

+ Click “Next” to continue.

+ Click “Next” to continue.

+ You must delete “install” folder in your prestashop before you manage your store.

+ If you don’t delete “install” folder, when you click “ Manage your store”, you will see warning:

+ Click Manage your store to login your Prestashop admin

+ Click Discover your store to Homepage.

Install Theme

Note: Before install theme, you have to import your language first (see tab 1 of Translate general Winner theme section). If in front-end of the theme still does not display your language translation the same like our demo site, please reset 2 modules Staticblock and Staticfooter

Step 1. Login your admin prestashop and navigate to Design > Theme & Logo

Step 2. Click "Add new theme":

Step 3. We got:

Note:

+ If you import from your computer successfully, please skip step 4.

+ If you have a problem with import theme, such as "An error has occurred during the file upload (1)", you will have to increase the “upload_max_filesize” in php.ini file to at least 10M.

+ If you still can not upload theme from your computer, please try to upload theme via FTP (see step 4).

Step 4. Upload "Winner_package_1.1/Winner_themes_1.1_for_prestashop_1.7.x.x/Winner_home1_theme_install.zip" file to "yoursite/theme" folder of your site:

• Navigate to Back Office > Design > Theme & Logo

• Choose theme and we got:

Step 5. After importing the theme, Prestashop will redirect you to the previous page, but this time you will be able to see the Winner theme in the list.

Step 6. In this step, Prestashop will ask you to which modules are going to be installed along with theme as well as which native ones will be installed/enabled and which ones will be disabled.

Step 7. Then click Finish to finish importing theme

Step 8. Navigate to Design > Image Settings.

• Note: When you upload an image, PrestaShop automatically generates various sizes of this image, including thumbnails and a mobile version. Therefore, you only have to upload one "master" version of your image, big enough to be resized into all the images sizes. If you want to make sure your image is correctly resized, you should upload an image that fits the size ratio of the various image sizes. If your uploaded image does not have the same width-to-height ratio than the settings in place, you are taking the risk to see whitespace on the resized image.

+ And:

+ After that, we got:

Step 9. Finish installer.

Install Quickstart Package

+ Quickstart package = Latest Prestashop version + Full Extensions

Setup Instructions:

1. Create new database by:

+ Open your Browse and type: localhost/phpmyadmin

+ Then create database

2. Extract and upload the whole Quickstart package (admin, modules, themes,…) in Winner_package_1.1 folder to your server.

+ Extract Winner_quickstart_home1_for_prestashop_1.7.1.1.zip, we got:

    

+ Copy all of folder above to your Prestashop

3. Open browser and navigate to your site (where the quickstart uploaded) to load quickstart package installer with the database you just created.

+ As an example, name of quickstart package is Winner.

  

+ Choose language you want to install.

+ Click button “Next”.

4. Step by step to follow the instructions.

  

+ Click “Next” to continue, we got :

  

+ Click “Next” to continue, we got:

  

+ With database name : Winner – database name you have just created

+ User name : root

+ User password : No need to fill in.

+ Click “Next” button.

  

  

+ Click Manage your store to login your Prestashop admin

+ Click Discover your store to your home page

+ If you click “Manage your store”, you will have a trouble :

  

+ You have to delete the “install” folder in your quickstart.

  

+ Then, you access your Prestashop admin. Example, here is admin234jdsep9.

5. Finish installer.

Manage theme Winner Store 1

+ Configuration Popup Newsletter

• Login your Prestashop admin

• Navigate to Fieldthemes > Popup newsletter

• You will get:

1. Nav block

+ If you want to translate this block, please do these steps below:

• Login prestashop admin

• Navigate to International > Translations

• Search word “blockuserinfo”:

• Search title you want to translate, then translate.

2. Logo

• In order to your logo in PNG format, do these steps below:

• Click “Save” button to save changes.

3. Field Megamenu

3.1. How to add categories in menu

• Login your prestashop admin

• Navigate to Catalog > Categories

• You will get:

• Navigate to Fieldthemes > Megamenu

• You will get:

• Result:

+ Add subcategory:

• Navigate to Fieldthemes > Megamenu

• You will get:

3.2. How to add Custom Content to popup of a specify category.

+ In order to display a custom block with images or other html content in the popup, do these steps below:

• Navigate to Fieldthemes > Megamenu

• You will get:

DEMO:

3.3. How to add links to menu item.

• Navigate to Fieldthemes > Megamenu

• You will get:

4. Field Slideshow

+ Configuration

• Login your Prestashop admin

• Navigate to Modules > Modules & Services

• At “Field Slideshow”, choose “Configure”

+ How to edit slideshow

• Navigate to FIELD THEMES > Manage Slideshow

• You will get:

• Click “Save” button to save this block.

+ How to add slideshow

• Navigate to FIELD THEMES > Manage Slideshow

• Click “Save” button to save this block.

5. Stt-home-top

+ If you want to change this block, do these steps below:

• Login your prestashop admin

• Navigate to FIELD THEMES > Manage Staticblocks

• At “Title” column, choose “Stt-home-top”.

+ You can change this block by editing HTML:

• Click “OK” button to save changes.

• And then click “Save” button to save this block.

6. About

+ If you want to change this block, do these steps below:

• Login your prestashop admin

• Navigate to FIELD THEMES > Manage Staticblocks

• At “Title” column, choose “About”.

+ You can change this block by editing HTML:

• Click “OK” button to save changes.

• And then click “Save” button to save this block.

7. Field tabcateslider.

+ Configuration

• Login your Prestashop admin

• Navigate to FIELDTHEMES > Configure tabcateslider

• You will get:

• Below is paramenters explanation:

• Click “Update” to save config.

8. Banner-top

+ If you want to change this block, do these steps below:

• Login your prestashop admin

• Navigate to FIELD THEMES > Manage Staticblocks

• At “Title” column, choose “Banner-top”.

+ You can change this block by editing HTML:

• Click “OK” button to save changes.

• And then click “Save” button to save this block.

9. Home-banner-2

+ If you want to change this block, do these steps below:

• Login your prestashop admin

• Navigate to FIELD THEMES > Manage Staticblocks

• At “ Title” column, choose Home-banner-2.

+ You can change this block by editing HTML:

• Click “OK” button to save changes.

• And then click “Save” button to save this block.

10. Home-banner-1

+ If you want to change this block, do these steps below:

• Login your prestashop admin

• Navigate to FIELD THEMES > Manage Staticblocks

• At “Title” column, choose “Home-banner-1”.

+ You can change this block by editing HTML:

• Click “OK” button to save changes.

• And then click “Save” button to save this block.

11. Featured product.

+ Configuration

• Login your Prestashop admin

• Navigate to FIELDTHEMES > Configure Featured product

• You will get:

• Below is paramenters explanation:

• Click “Save” to save config.

12. Smart Blog module

12.1 How to add blog category

+ Login your prestashop admin

+ Navigate to SmartBlog > Blog Category

• You will get:

12.2. How to add blog post

+ Login your prestashop admin

+ Navigate to SmartBlog > Blog Post

• You will get:

12.3. Translate title of Smart Blog

• Login prestashop admin

• Navigate to International > Translations

• Search word “smartblog” :

• Search title you want to translate, then translate.

• Click Save and stay or Save button when you finish.

13. Field Testimonials Module

+ Configuration

• Login your Prestashop admin

• Navigate to Modules > Modules & Services

• At “Field Testimonials Module”, choose “Configure”

• You will get:

• Below is paramenters explanation:

• Click “Update” to save config.

+ How to edit item in Testimonial

• Login your prestashop

• Navigate to FieldThemes > Manager Testimonial

• Choose item you want to edit, click Edit

• Click Save button when you finish.

+ Translate title of Field Testimonials Module (fieldtestimonials)

• Login prestashop admin

• Navigate to Localization > Translations

• Search word “fieldtestimonials”:

• Search title you want to translate, then translate.

• Click Save and stay or Save button when you finish.

14. Field Brandslider

+ Configuration

• Login your Prestashop admin

• Navigate to FIELDTHEMES > Configure brands

• You will get:

• Below is paramenters explanation:

• Click “Update” to save config.

+ How to Add brand in slider

• Login your prestashop

• Navigate to Catalog > Brands & Suppliers

• You will get:

• Click “Save” when you finish.

15. Footer static col 1

+ If you want to change this block, please do these steps below:

• Login your prestashop admin

• Navigate to FIELD THEMES > Manage Static Footer

• You get:

• At “Title” column, choose "Footer static col 1”.

• You can change content of this block by editing HTML.

• Click "OK" button to save your change.

• Click “Save” button to save this block.

16. Footer static col5

+ If you want to change this block, please do these steps below:

• Login your prestashop admin

• Navigate to FIELD THEMES > Manage Static Footer

• You get:

• At “Title” column, choose "Footer static col5”.

• You can change content of this block by editing HTML.

• Click "OK" button to save your change.

• Click “Save” button to save this block.

17. Contact us

+ If you want to change this block, please do these steps below:

• Login your prestashop admin

• Navigate to FIELD THEMES > Manage Static Footer

• You get:

• At “Title” column, choose "Contact us”.

• You can change content of this block by editing HTML.

• Click "OK" button to save your change.

• Click “Save” button to save this block.

Manage theme Winner Store 2

Manage theme Winner Store 3

Manage theme Winner Store 4

Translate general Winner theme

1. Import language

• Login your prestashop admin

• Navigate to International > Translations

2. Translation

• Navigate to International > Translations

• After add or update language, all default modules of Prestashop will be auto translate

• And modules not default of Prestashop, you have to translate by yourself.

3. Translate front office

• Navigate to International > Translations

• Search each block, then type your language.

4. Translate back office

• Navigate to International > Translations

5. Translate modules not default of Prestashop

6. Translate categories

• Navigate to Catalog > Categories

• Select one category

7. Translate product

• Navigate to Catalog > Products

Need Help?

1. Theme support: If you have found any bugs or have some other problems with this theme. If the problem is not covered there, you can contact us in the comment section on Fieldthemes or via contact form on our profile page on Fieldthemes. We will respond as soon as possible.

2. Questions about Prestashop:

+ If you have a question about Prestashop itself, please ask on Prestashop Forum. Almost every detail of Prestashop configuration is described there so you will find answers for most of your questions. You can also find there many helpful tips and tutorials.

+ The best place to start searching is chapter Prestashop configuration in this user guide. It covers some of the basic Prestashop elements.

Thank you for reading!

We hope you can create the best website with our themes.

 
Follow us on twitter or join my facebook page to get noticed about all theme or modules updates and news!
If you have any questions that are beyond the scope of this help file, please feel free to contact us. 
 
Support ticket: https://fieldthemes.ticksy.com/