MT Sunflo userguide

I. Quickstart Installation

• Step 1: Create new database and import sample database ( mt_sunflo.sql or mt_sunflo.sql.gz) in database folder.
• Step 2: Extract and Upload the whole Quickstart package to your server
• Step 3: Open browser and navigate to your site (where the quickstart uploaded) to load default Magento installer with the database you just created and import sample database.
• Step 4: Step by step to follow the instructions
• Step 5: Finish installer

II. Theme Installation

1. First, unzip theme package ZIP-file and then copy the whole "app and skin"- folders on the main root of your local magento server (you will need to merge these files), if this files are not merged, you will have installation issues then.
2. A message may popup and warn you that there are similar files already on your server. You will need to select overwrite to overwrite the same files. If not, don't worry, it will still work.
3. Log in to your backend of your Magento Administration and go to "System"→ "Configuration" then select "Desgin" Tab under GENERAL. Open the "Themes" section, then enter "mt_sunflo" for "Default" field , and then click "Save Config" button.
4. Disable the Cache in System → Cache Management. Select all options. Then either refresh or disable your cache. Refresh means it will refresh your cache, Disable will disable your cache. We recommend disabling your cache when installing your theme and re- enabling it after you are done installing.

III. Setting up the static block

Footer Static

Copy the whole "media"- folder on the main root of your local magento server (you will need to merge these files), if this files are not merged, you will have installation issues then.
We are now going to install our static blocks for this theme, go to CMS → Static Blocks → Add New Block. Important!: Remember to click in "Show/Hide Editor" in order to Hide the HTML Editor. If not, the code will be displayed wrong.

• Block Title: Footer Static
• Identifier: footer_static
• Status: Enabled
• Content:

<div class="span4">
<div class="accepted">
<h2>We Are Accepted</h2>
<p>For all orders we accept VISA, MasterCard, Discover, and American Express credit cards, as well as "check cards" (debit cards) that display the Visa or MasterCard logo. We now also accept payment via PayPal for mail orders.</p>
</div>
<div class="card">
<ul>
<li><a href="#"><img src="{{media url="wysiwyg/paypal.png"}}" alt="" /></a></li>
<li><a href="#"><img src="{{media url="wysiwyg/visa.png"}}" alt="" /></a></li>
<li><a href="#"><img src="{{media url="wysiwyg/mastercart.png"}}" alt="" /></a></li>
<li><a href="#"><img src="{{media url="wysiwyg/amex.png"}}" alt="" /></a></li>
<li><a href="#"><img src="{{media url="wysiwyg/visa2.png"}}" alt="" /></a></li>
</ul>
</div>
<div class="contact ">
<h2>Contact Us</h2>
<p>Please send a email to:demo@9magentothemes.com or call hotline: 19001089 if you want to support.</p>
</div>
</div>
<div class="span4">
<h2>About Us</h2>
<p>Fusce fringilla; lacus sed iaculis congue, neque metus lacinia diam, at interdum mauris arcu eget turpis. Proin condimentum, elit quis fermentum auctor, nisl mauris facilisis leo, at pulvinar turpis arcu a nisi. Mauris commodo nunc nec arcu suscipit eu placerat magna dapibus.</p>
<div class="img"> </div>
</div>

Social Static

Copy the whole "media"- folder on the main root of your local magento server (you will need to merge these files), if this files are not merged, you will have installation issues then.
We are now going to install our static blocks for this theme, go to CMS → Static Blocks → Add New Block. Important!: Remember to click in "Show/Hide Editor" in order to Hide the HTML Editor. If not, the code will be displayed wrong.

• Block Title: Social Static
• Identifier: social
• Status: Enabled
• Content:

<div class="social">
<h4>Follow Us:</h4>
<div class="mt-social "><a class="face" href="http://facebook.com.vn"> </a></div>
<div class="mt-social "><a class="twiter" href="https://twitter.com/"> </a></div>
<div class="mt-social "><a class="vimeo" href="http://vimeo.com/"> </a></div>
<div class="mt-social "><a class="youtube" href="http://www.youtube.com/"> </a></div>
</div>

IV. Setting up the Home Page

To setup your homepage, you will need to go to (CMS → Manage Pages):

Select "Home Page", with the identifier as "home".

Design: 1 columns

Scroll down and look for "Content", inside that you will have to input your homepage code, inserting the following code:

Important!: Remember to click in "Show/Hide Editor" in order to Hide the HTML Editor. If not, the code will be displayed wrong.

<div class="content-home">
<div class="row-fluid show-grid">
<div class="span4">
<div class="content-home-item"><a href="{{store direct_url="maya-yellow.html"}}"><img src="{{media url="wysiwyg/1.png"}}" alt="" /></a></div>
</div>
<div class="span4">
<div class="content-home-item"><a href="{{store direct_url="suspendisse.html"}}"><img src="{{media url="wysiwyg/2.png"}}" alt="" /></a></div>
</div>
<div class="span4 last">
<div class="content-home-item"><a href="{{store direct_url="dandelion.html"}}"><img src="{{media url="wysiwyg/3.png"}}" alt="" /></a></div>
</div>
</div>
</div>

V. Setting up MT Slideshow Module

1. Unzip and copy the whole "app, js, skin and media"- folders on the main root of your local magento server (you will need to merge these files).
2. Log in to your backend of your Magento Administration and go to "System"→ "Configuration "→"MT SlideShow". Open the "MAGENTHEMES" tab, then setup config like image below, and then click "Save Config".
3. Go to "MagenThemes"→ "MTSlideshow "→"Manage Slideshow", then fill parameter like image below.

Site Information:

• Identifier *: mtslideshow
• Position *: Top Content
• Style: MT OsSlide
• Width*: 1170
• Height*: 348
• Status: Enable

Images:

• browse to your images and upload them. After that fill the detail for each image like the following format:
• Title: the title of your image, ex:  Birthday Flowers & Gifts
• Link: the link which you want image link to, ex: maya-yellow.html
• Demo Link: inputing the link for the SHOW NOW button, ex: maya-yellow.html
• Description: inputing the description for each image

Display on CMS Page: Home Page

VII. Setting up MT Product Thumbnail Scroller, MT Smart Menus & MT Mega Menus

MT Products List

MT Products Thumbnail Scroller

MT Smart Menus

MT Mega Menus

MT Cloud Zoom

• Log in to your backend of your Magento Administration and go to "System"→ "Configuration "→"MT Sunflo Admin"→"Configuration".
• Please see the following screenshot for getting the configuration values

Adding custom menus to Mega menus

Go to CMS → Static Blocks → Add New Block. Important!: Remember to click in "Show/Hide Editor" in order to Hide the HTML Editor. If not, the code will be displayed wrong.

• Block Title: Custom Menus
• Identifier: custom_menu
• Status: Enabled
• Content:

<div class="news custom-menu">
<h4>MT News</h4>
<ul>
<li><a href="#">Elien Bravo </a></li>
<li><a href="#">Just Motion </a></li>
<li><a href="#">Lorem Ipsum! </a></li>
<li><a href="#">Integer Sit </a></li>
<li><a href="#">Nam Lacuss Massa </a></li>
<li><a href="#"> Dollar Motion </a></li>
<li><a href="#">Free Shipping </a></li>
<li><a href="#"> Dollar Motion </a></li>
<li><a href="#">Free Shipping </a></li>
</ul>
</div>
<div class="hot custom-menu">
<h4>MT Birthday</h4>
<ul>
<li><a href="#">Sunflowers </a></li>
<li><a href="#">Lily Flower </a></li>
<li><a href="#">Pinky Flowers </a></li>
<li><a href="#">Sunflowers </a></li>
<li><a href="#">Rose Plants </a></li>
<li><a href="#">Green Plants </a></li>
<li><a href="#">Potted Garden Plants </a></li>
<li><a href="#">Bonsai & Tropical Plants</a></li>
</ul>
</div>
<div class="languages custom-menu">
<h4>MT Languages</h4>
<ul>
<li><a href="#">English</a></li>
<li><a href="#">Vietnamese</a></li>
<li><a href="#">Hongkong </a></li>
<li><a href="#">France </a></li>
<li><a href="#">German </a></li>
<li><a href="#">Italia </a></li>
<li><a href="#">USA</a></li>
</ul>
</div>
<div class="tip custom-menu">
<h4>MT Tip &Tricks</h4>
<ul>
<li><a href="#">How to Flower Arranging ? </a></li>
</ul>
<div style="margin: 25px 0 0;"><iframe src="http://www.youtube.com/embed/rv6oWhG76pQ" frameborder="0" width="240" height="170"></iframe></div>
</div>

Adding a static block to Mega menu item

Example: you want to add a static block to the "WOMEN" mega menu item:

Step 1: Getting URL KEY of the Mega Menu item, see the following image:

Step 2: Creating static block: Go to CMS → Static Blocks → Add New Block. Important!: Remember to click in "Show/Hide Editor" in order to Hide the HTML Editor. If not, the code will be displayed wrong.

• Block Title: Beautiful flowers
• Identifier: family (note: this is URL KEY which you get from step 1)
• Status: Enabled
• Content:

<p><img src="{{media url="wysiwyg/132_by_bo0xvn.jpg"}}" alt="" /></p>
<p>Vivamus gravida purus tellus. Phasellus ut elit quis magna bibendum dapibus. Suspendisse consectetur nisl quis dolor ullamcorper dapibus. Integer non neque mauris. Aliquam tincidunt bibendum ultrices.</p>