SM Gameshop - Responsive Magento Theme

Introduction


  • Created: 11/01
  • Latest update: 23/01
  • By: MagenTech

When you download theme from our store and unzip, you will be got full of main files for theme installation. They're:

  • Theme Package: Use this package to install to your current site. This contains the theme files only.

  • QuickStart Installation Package: This package included modules, theme, sample data.

  • Extension Packages: Modules in-house which we used for the demo.

  • PSD Sources: All PSD design themes

  • Documentation: Detail userguide to install and configure theme

INSTALLATION GUIDE

There are two ways to install a MagenTech theme:

  • Install quickstart: By using this package, you will set the theme exactly as Demo. This is applied when you need a fresh Magento with our theme.

  • Install Theme and Extensions: This is applied when you have already installed a Magento instance on your server. You will need only be using the zipped files in “Extensions” and “Theme” folders mentioned above. Please follow below instruction about how to install theme and extensions:

How to install theme

How to install extensions

Magento Community Edition 1.7.x and 1.8.x

Magentech provides SM Quickstart package for each template which aims to ease the installation for users. It will help you save much time of installing and configuring if you plan to start your site from the beginning.

Please following steps below (we used images of SM Glasses theme installation to illustrate for general installations - Magento Quickstart Installation - Magento Theme Installation - Magento Extension Installation):

  • Step 1: Download the quickstart package

  • Step 2: Extract and Upload the whole Quickstart package to your server. In Quickstart folder you will see the extracted folder that include all sample data

  • Step 3: Create a database for your Magento

  • Step 4: Start installation by opening browser and navigate to your url (where the quickstart uploaded) to load default Magento installer.

  • Step 5:  Finish installation

Before you start the installation process of this theme, we recommend to back up your current live Magento files and database. If your store has not been available yet, get it quickly following Magento Installation Guide

The installation of our theme is quite simple. You just need follow steps below to get our theme ready for your Magento store:

  • Step 1: Upload folders skin and app from our download package to your Web server's document root (from here on, referenced as {docroot}). These files will overwrite default folders skin and app in your Magento folder, you should see a directory layout like this:

    {docroot} /magento/

    app/

    index.php

    js/

    lib/

    LICENSE.txt

    media/

    pear/

    skin/

    var/

     

  • Step 2: Login your Magento Admin area (ex: access Magento Admin area on a stage localhost: https://yourdomain/index.php/admin/)

  • Step 3: Navigate to System =>Configuration =>Design as per screenshot below (steps in following images used SM Glasses theme for example)

  • Step 4: Fill texts to the "Package" and "Themes" sections as per screenshot below:

  • Step 5: Finally, Refer here to configure Theme and then save your configuration

Before you begin the SM Gameshop installation process, we recommend to back up your current live Magento files and database. If your store has not been available yet, get it quickly following Magento Installation Guide

You just need following steps below to get our extensions ready for your Magento store:

  • Step 1: Upload folders skin and app from our download package to your Web server's document root (from here on, referenced as {docroot}). These files will overwrite default folders skin and app in your Magento folder, you should see a directory layout like this:

    {docroot} /magento/

    app/

    index.php

    js/

    lib/

    LICENSE.txt

    media/

    pear/

    skin/

    var/

     

  • Step 2: Login your Magento Admin area (ex: access Magento Admin area on a stage localhost: https://yourdomain/index.php/admin/)

  • Step 3: Navigate to System =>Configuration (steps in following images used SM Glasses theme for example)

  • Step 4: You will see installed extension, click extension's name tab to go to extension configuration page.

Important Note:

  • After install extension or theme, you should logout first and then login Admin Panel to ensure all functions work normally.
  • You should disable all caches in cache management in the installation and configuration process.

Configure homepage

1. Select the homepage from CMS Pages

2. Select Homepage >> Design on the left-hand menu.

3. In the Layout Update XML box, add the code as you want, this is our demo homepage:

4. Click the Save Page button.

Configure theme using admin back end

For easing the theme configuration, we has been created Cpanel in both backend and frontend, this is SM Gameshop configuration in backend:

1. Under Magento admin panel, go to System >> Configuration

2. Select SM Gameshop Theme on the left-hand menu

3. Tweak the theme as you want

Theme Config

Configure theme using Cpanel front end

This is fontend, identical to what has in backend:

Front end Cpanel

Color Sample

4 presets to be chosen

1 Body

Background, Link and Text color, Background image

2 Footer

Background image and color

3 Menu Style

3 options to be chosen: Mega, CSS or Split

4 Typography

Google Font, various font-size and font-family

 

1. Position

To replace default main menu

2. Configuration

To config General settings, module parameters, Advance, login your administrator, go to SM Mega Menu >> Configuration

configuration

To view more guide about how to install, set up and configure SM Mega Menu as you want, please click HERE

3. Mega Menu Items

In order to add menu items, Go to SM Mega Menu >> Menu items Manager

You must create add new Menu Group.

The settings below belong to SM Gameshop group. Other group has similar settings menu item

3.1 XBOX360 Menu

Front-end appreance 

Backend Settings: Click here

Category/87: (To config: Go to Catalog >> Manager Categories > Xbox360 > Display Settings > Display Mode = “Products Only”)

Xbox360 Menu Items Tree:

Xbox360-1: Backend

Xbox360-2: Backend

Onx Game Playtion: Backend

Menu type: CMS Block

CMS Block: Menu Product 1 ( To config: Go to CMS >> Statistic Block ): Click here

Code of content used in Menu Product 1:

Clicshee Gaames hot: Backend

Menu type: CMS Block

CMS Block: Menu Product 2 ( To config: Go to CMS >> Statistic Block ): Click here

Code of content used in Menu Product 2:

3.2 PS3 Menu

Front-end appreance 

Backend Settings: Click here

Category/74: (To config: Go to Catalog >> Manager Categories > Ps3 > Display Settings > Display Mode = “Products Only”)

Ps3 Menu Items Tree:

Ps3-1: Backend

Ps3-2: Backend

Ps3-3: Backend

Menu type: CMS Block

CMS Block: Menu Product 3 ( To config: Go to CMS >> Statistic Block ): Click here

Code of content used in Menu Product 3:

Ps3-4: Backend

Menu type: CMS Block

CMS Block: Menu Product 4 ( To config: Go to CMS >> Statistic Block ): Click here

Code of content used in Menu Product 4:

3.3 WIIU Menu

Front-end appreance 

 

Backend Settings: Click here

Category/80: (To config: Go to Catalog >> Manager Categories > WIIU > Display Settings > Display Mode = “Products Only”)

WIIU Menu Items Tree:

Hot wii u: Backend

Wii U Game: Backend

Wii-3: Backend

Menu type: CMS Block

CMS Block: Menu Product 2 ( To config: Go to CMS >> Statistic Block ): Click here

Code of content used in Menu Product 2:

Wii-4: Backend

Menu type: CMS Block

CMS Block: Menu Product 3 ( To config: Go to CMS >> Statistic Block ): Click here

Code of content used in Sub cat:

3.4 WII Menu

Front-end appreance 

Backend Settings: Click here

WII Menu Items Tree:

Wii 1: Backend

Wii 2: Backend

Wii 3: Backend

Menu type: CMS Block

CMS Block: Menu Product 2 ( To config: Go to CMS >> Statistic Block ): Click here

Code of content used in Menu Product 2:

Menu type: CMS Block

CMS Block: Menu Product 3 ( To config: Go to CMS >> Statistic Block ): Click here

Code of content used in Menu Product 3:

3.5 3DS, PSVITA, TABLETS, PC and MOVIES Menu

Front-end appreance 

Backend Setting:

1. SM Cart Pro

1.1 Position

mini-cartpro

1.2 Front-end appreance

1.3 Configuration

Backend of SM Cart Pro: Click here

To view more guide about how to install, set up and configure SM Cart Pro as you want, please click HERE

2. SM Slideshow

2.1 Position:

slideshow

2.2 Front-end appreance

2.3 Configuration

Backend of SM Slideshow: Click here

To view more guide about how to install, set up and configure SM Dynamic Slideshow as you want, please click HERE

To get this extension to show onto the front page at the up top position, go to CMS > Pages >> Homepage >> In Design tab, please fill in Layout Update XML parameter -between tag as below :

 

3. SM Basic Product

3.1 Position:

content-bottom

3.2 Front-end appreance

3.3 Configuration

Backend of SM Basic Product: Click here

To get this extension to show onto the front page at the up top position, go to CMS > Pages >> Homepage >> In Design tab, please fill in Layout Update XML parameter -between tag as below :

4. SM Slider

4.1 Position:

slider

4.2 Front-end appreance

Backend of SM Slider: Click here

To view more guide about how to install, set up and configure SM Slider as you want, please click HERE

4.3 Configuration

To get this extension to show onto the front page at the up top position, go to CMS > Pages >> Homepage >> In Design tab, please fill in Layout Update XML parameter -between tag as below :

 

5.SM Basic Product

5.1 Position

basic product

3.2 Front-end appreance

3.3 Configuration

Backend of SM Basic Product: Click here

To get this extension to show onto the front page at the up top position, go to CMS > Pages >> Homepage >> In Design tab, please fill in Layout Update XML parameter -between tag as below :

6.SM Extra Slider

6.1 Position

extra slider

6.2 Front-end appreance

6.3 Configuration

Backend of SM Extra Slider: Click here

To view more guide about how to install, set up and configure SM Extra Slider as you want, please click HERE

To get this extension to show onto the front page at the up top position, go to CMS > Pages >> Homepage >> In Design tab, please fill in Layout Update XML parameter - between tag as below :

 

The SM Gameshop front-page has static blocks in the Theme:

  • block-news

  • block-banner-left

  • block-brands

  • block-yt-footer-content1

  • block-yt-footer-content2

  • block-yt-footer-content3

  • block-info-footer

  • block-services

  • block-contact-us

  • block-user5

  • block-payment

  • block-community

To create static blocks, go to CMS >> Static Blocks >> Add new block

1. block-news

1.1. Identifier

block-news

1.2. Front-end Appearance

 

 

1.3. Backend settings: Click here

1.4. Code to display as demo

2. banner-left

2.1. Identifier

block-banner-left

2.2. Front-end Appearance

 

 

2.3. Backend settings: Click here

2.4. Code to display as demo

3. block-brands

 

3.1. Identifier

 

block-brands

 

3.2. Front-end Appearance

 

 

3.3. Backend settings: Click here

 

3.4. Code to display as demo

4. block-yt-footer-content1

 

4.1. Identifier

 

block-yt-footer-content1

 

4.2. Front-end Appearance

 

 

4.3. Backend settings: Click here

 

4.4. Code to display as demo

5. block-yt-footer-content2

 

5.1.  Identifier

 

block-yt-footer-content2

 

5.2. Front-end Appearance

 

 

5.3. Backend settings: Click here

 

5.4. Code to display as demo

6. block-yt-footer-content3

 

6.1. Identifier

 

block-yt-footer-content3

 

6.2. Front-end Appearance

 

 

6.3. Backend settings: Click here

 

6.4. Code to display as demo

7. block-info-footer

 

7.1. Identifier

 

block-info-footer

 

7.2. Front-end Appearance

 

 

7.3. Backend settings: Click here

 

7.4. Code to display as demo

8. block-services

 

8.1.  Identifier

 

block-services

 

8.2. Front-end Appearance

 

 

8.3. Backend settings: Click here

 

8.4. Code to display as demo

9. block-contact-us

 

9.1. Identifier

 

block-contact-us

 

9.2. Front-end Appearance

 

 

9.3. Backend settings: Click here

 

9.4. Code to display as demo

10. block-user5

 

10.1. Identifier

 

block-user5

 

10.2. Front-end Appearance

 

 

10.3. Backend settings: Click here

 

10.4. Code to display as demo

11. block-payment

 

11.1. Identifier

 

block-payment

 

11.2. Front-end Appearance

 

 

11.3. Backend settings: Click here

 

11.4. Code to display as demo

12. block-community

 

12.1.  Identifier

 

block-community

 

12.2. Front-end Appearance

 

 

12.3. Backend settings: Click here

 

12.4. Code to display as demo

 Home Page

To config this page, please navigate to CMS >> Pages, create Home page, navigate to tab Design and update with the following settings:

  • Layout : select 1 column

  • Layout Update XML: Paste the code below

PHP Code:

Contact us page:

  • Backend Setting
  • To config this page, please navigate to CMS >> Pages, create About us page, navigate to Content tab and update with the following settings:

    • Content: Paste the code below

    PHP Code:

    Navigate to tab Design and update with the following settings:

    • Layout : select 2 columns with left bar

Support from MagenTech will be defined as following:

  • Support time: Monday - Friday 8:30AM to 5:30PM UTC+7

  • Response Time: Within 24 hours (1 business day)

Item support includes:

  • Responding to questions or problems regarding the item and its features

  • Fixing bugs and reported issues

  • Providing updates to ensure compatibility with new software versions

Item support does not include:

  • Customization and installation services

  • Support for 3rd parties' extensions

Installation Services-Quickstart installation services cost $25:

  • 1. Buy service-installation here

  • 2. Submit your account information to install here

That's it. Now you are ready for using!


Thank you for purchasing our theme. If you have any questions that are beyond the scope of this help file, feel free to do the following steps to send us any question.here