Step 1: Install Magento

Complete an installation of Magento on your site and create a Website, Store, and Store View.

Step 2: Upload Your Theme

After installing Magento on your site, upload your theme files to the appropriate folders, following the folder structure in which the theme is provided.

Step 3: Activate Your Theme

1. Access the Admin Panel and navigate to System > Configuration.

2. Select your Store View from the Current Configuration Scope drop-down menu in the upper left corner.

3. Click on "Design" under the "General" section of the left side navigation.

4. Under the "Themes" section, uncheck all of the check boxes titled "Use website."

5. In each text field, enter the name of the folders containing the theme you wish to use.

   In this case, enter "ion" (without quotes).

Step 4: Set Up Your Homepage

1. From the top navigation, navigate to CMS > Pages.

2. Click on the "+ Add New Page" button.

3. Enter your desired page title.

4. For the home page, be sure to set your URL Key as "home" and select your store view.

5. Select "Design" from the left side navigation and set Layout to "1 column."

6. Select "Content" from the left side navigation and enter the content for your home page in the text area.

   To make your homepage appear as the example on our site, click the "Show/Hide Editor" button and enter the following code:

   {{block type="core/template" template="home/flash.phtml"}}
   
   <div style="margin-top:8px;">
   	<div class="quicklinks">
   		<h2>Quick Links</h2>
   		<ol>
   			<li>&#9658; <a href="furniture.html">Clearance Specials</a></li>
   			<li>&#9658; <a href="customer-service">Returns &amp; Exchanges</a></li>
   			<li>&#9658; <a href="about-magento-demo-store">Gift Certificates</a></li>
   			<li>&#9658; <a href="catalog/seo_sitemap/category/">Site Map</a></li>
   			<li>&#9658; <a href="customer-service">Store Locations</a></li>
   			<li>&#9658; <a href="contacts">Contact Us</a></li>
   		</ol>
   	</div>
   	<a href="#" style="float:left; margin-right:12px;"><img src="{{skin url=""}}images/media/home_ad_2.jpg"/></a>
   	<a href="#" style="float:left; margin-right:12px;"><img src="{{skin url=""}}images/media/home_ad_3.jpg"/></a>
   	<a href="#" style="float:left;"><img src="{{skin url=""}}images/media/home_ad_4.jpg"/></a>
   	<div style="clear:both;"></div>
   </div>

7. Set the Status to "Enabled" and click on the "Save Page" button in the upper right corner to save and activate your homepage.

That's it! Congratulations

Just set up your categories and products, and you now have a beautiful, fully functioning ecommerce website!

Step 1: Prepare product images

For each of the products you wish to display on the homepage, prepare a thumbnail image sized to 125x125 pixels. For best results, save these images as a transparent PNG-24 image. Then upload them to /skin/frontend/default/ion/flash/images/

For simplicity, you may wish to give your images the same name as the example images (1.png, 2.png, etc) as a method of keeping them in order.

Step 2: Edit data file

1. Locate and open the file /skin/frontend/default/ion/flash/data.xml

2. Find where product information begins (line 3). The image below displays all information pertaining to the first item in the list and may be used for reference in the proceeding steps:
   

3. First, the image field contains the location of your thumbnail image. You may input the location of your thumbnail image here. If you saved over the example images in Step 1, no change is necessary here.

4. The heading field refers to the upper text field (the product title). Input the title of your product here.

5. The price field refers to the middle text field (the price field). Input the price of your product here.

6. The next field, linkText refers to the lower text field in red. Input the message of your choice or leave as-is.

7. Lastly, the linkURL field contains the page address that the item links to. Copy and paste the URL to your first product between the quotation marks as seen in the example. Any further information on this line should not be edited.

8. Your first item is now complete! Repeat these steps for the remaining items.

Step 3: Refresh your cache

Once you have uploaded your edited data file, refresh your browser's cache and then refresh the page to see the changes. If no changes can be seen, you may also need to refresh Magento's cache (via System > Cache Management in the admin panel).

That's it! Congratulations

Your flash element is now complete! Enjoy your site.