GadgetStore Magento Theme Instructions 8theme 1 GadgetStore Magento Theme Instructions
Table of Contents Introduction....3 Features.....4 Installation & Configuration...5 Uploading GadgetStore...6 Homepage...10 Adding Content...14 The SlideShow...19 Footer...22 Follow Us...25 HTML Blocks...29 Theme Option... 24 Using Magento...29 8theme 2 GadgetStore Magento Theme Instructions
Introduction We are happy to present our new GadgetStore Magento Template with integrated online payment facility. We have done our best in bringing perfect color combination and jquery banners to attract an attention of new customers to your online store. We used drop-down menus with transparency effects it is easier for customers to search the store, which will save them time and will make it quicker to find and buy the desired item. We have used the latest technologies and our highly qualified designers used their knowledge and experience for developing this product so that our customers could obtain satisfying return on their investment. This template basically is a quick and easy way to set up and develop your online business independently. 8theme 3 GadgetStore Magento Theme Instructions
Features Highlight Features AJAX Add to Cart Zoom to enlarge product images (Setting from Admin Panel) Product scrollbar (Setting from Admin Panel) Custom DropDown Menu Custom SlideShow Back to top button Social networks bookmarks (Setting from Admin panel) Frontpage New Products Scroll Panel General Features Template is fully compatible with magento verion: 1.5.x.x, 1.6.x.x PSDs file supplied, easy to edit SEO (Search Engine Optimization)-orient in design and development, fast loading 100% Tableless design. 100% HTML /CSS/DIV compliance Valid XHTML and CSS markup Well-structured and commented HTML & CSS for easy customization Cross Browser Support (IE 7+, Safari, Mozilla Firefox, Chrome, Opera 9+) 8theme 4 GadgetStore Magento Theme Instructions
Installation & Configuration Thank you for purchasing the GadgetStore Magento Theme! In this document, you will find step-by-step instructions for installing and using GadgetStore. System Requirements GadgetStore only supports Magento Community Edition 1.6.0.0, 1.6.1.1 and 1.6.2.0 which can be downloaded from http://www.magentocommerce.com/download. It does not support Magento Enterprise Edition and Magento GO. Before downloading Magento, make sure you meet the system requirements and test the compatibility of your server. For help with installing Magento, please refer to the following links: Magento System Requirements Server Compatibility Check Magento Installation Guide 8theme 5 GadgetStore Magento Theme Instructions
Installation & Configuration Uploading GadgetStore Before you begin the GadgetStore installation process, we recommend to back up your Magento installation and database. To upload GadgetStore to Magento: 1. Unzip the downloaded GadgetStore folder. 2. Using an FTP client, copy the app, js, media and skin folders to the Magento software s root directory. If you are working with a Mac, please make sure you are merging the new folders with Magento and not replacing the Magento directory. 3. Log in to the Magento admin panel. 4. Go to 'System > Configuration'. Click Design on the left-hand menu. 5. Under HTML Head, find the Default field and type GadgetStore. 8theme 6 GadgetStore Magento Theme Instructions
Installation & Configuration 6. Scroll down to the Header section. In the Logo Image Scr field, type images/logo.gif. This is a sample logo that can be replaced with your own by uploading the file to the server and entering the new URL in this field. 8theme 7 GadgetStore Magento Theme Instructions
Installation & Configuration 7. You can also enter an alt attribute for the logo in Logo Image Alt and a welcome message in Welcome Text. The welcome message will appear to the right of the logo at the very top of the page. 8. Scroll back to the top of the page and click the Save Config button. 9. Next, go to 'System > Cache Management' from the top navigation menu. You will need to clear the store cache and all cookies. 10. Click Select All on the left side of the page. On the right side, select Refresh in the Actions dropdown menu and click the Submit button. 11. Finally, click the following buttons (in orange): Flush Magento Cache, Flush Cache Storage, Flush JavaScript/CSS Cache, and Flush Catalog Images Cache (optional). Now you are ready to add content to your website. 8theme 8 GadgetStore Magento Theme Instructions
Installation & Configuration Categories and products As to how properly create categories and products you need to go to the link and watch the video carefully http://www.youtube.com/watch?v=l4vn66bjsfs 8theme 9 GadgetStore Magento Theme Instructions
The Homepage This section will help you create а GadgetStore homepage: 8theme 10 GadgetStore Magento Theme Instructions
The Homepage Setting the Page Layout 1. Select the homepage from 'CMS > Pages'. 2. If you haven t done this already, enter a name for the page in Page Title and a fill in the URL Key field. 3. Select Enabled in the Status drop-down menu. 4. Click the Save Page button. 8theme 11 GadgetStore Magento Theme Instructions
The Homepage 5. Select Design from the left-hand menu. The following page will appear: 6. Select 1 column from the Layout drop-down menu. 7. In the Layout Update XML box, either remove the existing content or add the following comment tag around the existing content: <!--<reference name="content"> <block type="catalog/product_new" (existing HTML code is here) --> 8. Click the Save Page button. 8theme 12 GadgetStore Magento Theme Instructions
The Homepage Adding Content To add content to your homepage: 1. Under 'CMS > Pages', click on the homepage. 2. In the left-hand menu, click Content. 3. Click the Show / Hide Editor button to leave WYSIWYG mode and open the content editor. 4. Copy and paste the following code into the content editor to create the homepage: 8theme 13 GadgetStore Magento Theme Instructions
Homepage Adding Content <div id="additional_bg"> <div class="iosslider"><!-- slider --> <div class="slider"><!-- slides --> <div class="slide"><img class="royalimage" src="{{media url="wysiwyg/gadget/slide.png"}}" alt="" /> <div class="text1" style="right: 250px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/new_in.png"}}" alt="" /> <div class="text2" style="right: 10px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/text.png"}}" alt="" /><br /> <br /> <button class="button btncart" onclick="setlocation('http://8theme.com/demo/gadgetstore/cameras/olympus-pen-e-pl1.html')"><span><span>buy IT NOW!</span></span></button> <div class="slide"><img class="royalimage" src="{{media url="wysiwyg/gadget/slide1.png"}}" alt="" /> <div class="text1" style="right: 250px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/new_in.png"}}" alt="" /> <div class="text2" style="right: 10px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/text.png"}}" alt="" /><br /> <br /> <button class="button btncart" onclick="setlocation('http://8theme.com/demo/gadgetstore/cameras/olympus-pen-e-pl1.html')"><span><span>buy IT NOW!</span></span></button> <div class="slide"><img class="royalimage" src="{{media url="wysiwyg/gadget/slide2.png"}}" alt="" /> <div class="text1" style="right: 250px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/new_in.png"}}" alt="" /> <div class="text2" style="right: 10px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/text.png"}}" alt="" /><br /> <br /> <button class="button btncart" onclick="setlocation('http://8theme.com/demo/gadgetstore/cameras/olympus-pen-e-pl1.html')"><span><span>buy IT NOW!</span></span></button> Code continues on the next page... 8theme 14 GadgetStore Magento Theme Instructions
Homepage Adding Content <div class="slide"><img class="royalimage" src="{{media url="wysiwyg/gadget/slide3.png"}}" alt="" /> <div class="text1" style="right: 250px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/new_in.png"}}" alt="" /> <div class="text2" style="right: 10px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/text.png"}}" alt="" /><br /> <br /> <button class="button btncart" onclick="setlocation('http://8theme.com/demo/gadgetstore/cameras/olympus-pen-e-pl1.html')"><span><span>buy IT NOW!</span></span></button> <div class="slide"><img class="royalimage" src="{{media url="wysiwyg/gadget/slide4.png"}}" alt="" /> <div class="text1" style="right: 250px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/new_in.png"}}" alt="" /> <div class="text2" style="right: 10px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/text.png"}}" alt="" /><br /> <br /> <button class="button btncart" onclick="setlocation('http://8theme.com/demo/gadgetstore/cameras/olympus-pen-e-pl1.html')"><span><span>buy IT NOW!</span></span></button> <div class="slide"><img class="royalimage" src="{{media url="wysiwyg/gadget/slide5.png"}}" alt="" /> <div class="text1" style="right: 250px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/new_in.png"}}" alt="" /> <div class="text2" style="right: 10px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/text.png"}}" alt="" /><br /> <br /> <button class="button btncart" onclick="setlocation('http://8theme.com/demo/gadgetstore/cameras/olympus-pen-e-pl1.html')"><span><span>buy IT NOW!</span></span></button> <div class="sliderthumbs"> <div class="thumbs-shadow"> Code continues on the next page... 8theme 15 GadgetStore Magento Theme Instructions
Homepage Adding Content <div class="slidernavi" style="width: 600px; left: 0px;"><span class="naviitem selected"> <div class="thumb_bg" style="background: url({{media url="wysiwyg/gadget/slide_thumb.png"}}) no-repeat center center;">1 </span> <span class="naviitem"> <div class="thumb_bg" style="background: url({{media url="wysiwyg/gadget/slide1_thumb.png"}}) no-repeat center center;">2 </span> <span class="naviitem"> <div class="thumb_bg" style="background: url({{media url="wysiwyg/gadget/slide2_thumb.png"}}) no-repeat center center;">3 </span> <span class="naviitem"> <div class="thumb_bg" style="background: url({{media url="wysiwyg/gadget/slide3_thumb.png"}}) no-repeat center center;">4 </span> <span class="naviitem"> <div class="thumb_bg" style="background: url({{media url="wysiwyg/gadget/slide4_thumb.png"}}) no-repeat center center;">5 </span> <span class="naviitem"> <div class="thumb_bg" style="background: url({{media url="wysiwyg/gadget/slide5_thumb.png"}}) no-repeat center center;">6 </span> <div class="prev"> <div class="next"> <div class="clear additmargin"> <div class="col3-set"> <div class="col-1"> <h2 class="simple_inst">simple installation</h2> Code continues on the next page... 8theme 16 GadgetStore Magento Theme Instructions
Homepage Adding Content <p>there are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p> <div class="col-2"> <h2 class="lot_options">lots of options</h2> <p>there are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p> <div class="col-3"> <h2 class="impr_compap">improved compatibility</h2> <p>there are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p> <div>{{block type="catalog/product_new" name="home.catalog.product.new" alias="product_homepage" template="catalog/product/new.phtml"}} <div class="brands"> <div class="brandscarousel"> <div class="slider"> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/indesit.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/lenovo.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/nokia.png"}}" alt="" /></a> Code continues on the next page... 8theme 17 GadgetStore Magento Theme Instructions
Homepage Adding Content <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/philips.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/gigabyte.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/toshiba.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/sharp.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/indesit.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/lenovo.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/nokia.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/philips.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/gigabyte.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/toshiba.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/sharp.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/indesit.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/lenovo.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/nokia.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/philips.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/gigabyte.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/toshiba.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/sharp.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/indesit.png"}}" alt="" /></a> Code continues on the next page... 8theme 18 GadgetStore Magento Theme Instructions
Homepage Adding Content <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/lenovo.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/nokia.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/philips.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/gigabyte.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/toshiba.png"}}" alt="" /></a> <div class="slide"><a href="#"><img src="{{media url="wysiwyg/gadget/sharp.png"}}" alt="" /></a> <div class="brand-arr prev"> <div class="brand-arr next"> <div>{{block type="core/template" template="sample/brands.phtml" }} Click the Save Page button. 8theme 19 GadgetStore Magento Theme Instructions
Homepage Slideshow The slideshow on the homepage is a jquery slider. Below is the code that generates the slider: 1.<div id="additional_bg"> 2.<div class="iosslider"><!-- slider --> 3.<div class="slider"><!-- slides --> 4.<div class="slide"><img class="royalimage" src="{{media url="wysiwyg/gadget/slide.png"}}" alt="" /> 5.<div class="text1" style="right: 250px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/new_in.png"}}" alt="" /> 6.<div class="text2" style="right: 10px; opacity: 0.8;"><img src="{{media url="wysiwyg/gadget/text.png"}}" alt="" /><br /> <br /> <button class="button 7.btn-cart" onclick="setlocation('http://8theme.com/demo/gadgetstore/cameras/olympus-pen-e-pl1.html')"><span><span>buy IT 8.NOW!</span></span></button> 9. 8theme 20 GadgetStore Magento Theme Instructions
Homepage Slideshow Key lines of code are explained below. Line 1-2: The div class for the slider, <div id="additional_bg"><div class="iosslider"><!-- slider --> Lines 5: elemhover caption fromtop elemtohide slide-head Is responsible for the upper sign "New in". Line 6: elemhover caption frombottom elemtohide slide-slogan Is responsible for the main slide text. Line 7-8: elemhover caption fromright elemtohide slide-button is responsible for the slide button. Here you can name your button. 8theme 21 GadgetStore Magento Theme Instructions
Homepage Slideshow 8theme 22 GadgetStore Magento Theme Instructions
Footer Footer Links At the bottom of every page there is a footer with links (usually to other pages on the Web site) and the company s contact and copyright information. These sections are modified in different parts of the Magento admin. First, let s look at how to add the footer links, which are in a static block. To add footer links: 1. Go to 'CMS > Static Blocks'. Select Footer Links from the list. The identifier should be footer_links. 2. You will come to the following screen: 8theme 23 GadgetStore Magento Theme Instructions
Footer Footer Blocks and Payment Information This footer blocks can be changed in the backend. Go to 'CMS -> Static Blocks', edit footer_shipping or create new if it doesn t exist: <div class="col-1"> <h2>contact Us</h2> <div class="phones"> <div class="icon1"> info@testshop.com<br /> admin@testshop.com <div class="phones"> <div class="icon2"> 30 South Park Avenue.<br /> San Francisco, USA <div class="phones"> <div class="icon3"> (000) 123.456.7890<br /> (000) 123.456.7890 <div class="col-2"> <h2>our Support</h2> <ul> <li><a href="#">returns</a></li> <li><a href="#">delivery</a></li> Code continues on the next page... 8theme 24 GadgetStore Magento Theme Instructions
<li><a href="#">customer Service</a></li> <li><a href="#">gift Cards</a></li> <li><a href="#">mobile</a></li> <li><a href="#">gift Cards</a></li> <li><a href="#">manufacturers</a></li></ul> <div class="col-3"> <h2>shipping Info</h2> <ul> <li><a href="#">your Account</a></li> <li><a href="#">personal information</a></li> <li><a href="#">addresses</a></li> <li><a href="#">discount</a></li> <li><a href="#">orders history</a></li> <li><a href="#">addresses</a></li> <li><a href="#">search Terms</a></li></ul> <div class="col-4">{{block type="newsletter/subscribe" template="newsletter/subscribe.phtml"}}<br /> <img class="left" src="{{media url="wysiwyg/gadget/secure1.png"}}" alt="secure" /> <img class="left" src="{{media url="wysiwyg/gadget/secure2.png"}}" alt="secure" /> <img class="left" src="{{media url="wysiwyg/gadget/secure3.png"}}" alt="secure" /> <div class="clear"> <div style="padding-top: 2px;"><img style="margin-right: 3px;" src="{{media url="wysiwyg/gadget/pay1.png"}}" alt="paypal" /> <img style="margin-right: 3px;" src="{{media url="wysiwyg/gadget/pay2.png"}}" alt="visa_straight" /> <img style="margin-right: 3px;" src="{{media url="wysiwyg/gadget/pay3.png"}}" alt="aex" /> <img style="margin-right: 3px;" src="{{media url="wysiwyg/gadget/pay4.png"}}" alt="mastercard" /> <img src="{{media url="wysiwyg/gadget/pay5.png"}}" alt="maestro" /> Click the Save Page button. 8theme 25 GadgetStore Magento Theme Instructions
Footer Follow Us This product additional information blocks can be changed in the backend. Go to 'CMS -> Static Blocks', edit follow_us or create new if it doesn t exist: <div class="twitter left"><a href="http://twitter.com"><img style="float: left;" src="{{media url="wysiwyg/gadget/twitter.png"}}" alt="twitter" /></a> <div class="rss left"><a href="http://www.facebook.com"><img style="float: left; margin-left: 15px;" src="{{media url="wysiwyg/gadget/facebook.png"}}" alt="facebook" /></a> <div class="facebook left"><a href=" http://feedburner.com"><img style="float: left; margin-left: 15px;" src="{{media url="wysiwyg/gadget/rss.png"}}" alt="rss" /></a> Click the Save Page button. 8theme 26 GadgetStore Magento Theme Instructions
Product page Product Additional Information This product additional information blocks can be changed in the backend. Go to 'CMS -> Static Blocks', edit productview or create new if it doesn t exist: <p><img src="{{media url="wysiwyg/gadget/sample.png"}}" alt="" /></p> <p><img src="{{media url="wysiwyg/gadget/sample2.png"}}" alt="" /></p> Click the Save Page button. 8theme 27 GadgetStore Magento Theme Instructions
Navigation Custom Block This navigation custom blocks can be changed in the backend. Go to 'CMS -> Static Blocks', edit nav_block1 or create new if it doesn t exist: <div class="col2-set"> <div class="col-1"> <h3>custom HTML</h3> <img style="float: left; margin: 0 20px 20px 0;" src="{{media url="wysiwyg/gadget/blok2_1.png"}}" alt="" /> Augue mid egestas magna ac? Augue integer hac, amet porttitor turpis. Massa! Enim amet non. Urna purus tincidunt augue montes? Adipiscing diam quis adipiscing, augue dolor massa? Elementum, aliquam elit. Mus eu lacus habitasse. Arcu, risus pulvinar eu, cursus enim scelerisque natoque, rhoncus integer. Vel ridiculus lundium vel, massa! Ac.Elementum, aliquam elit. Mus eu lacus habitasse. Arcu, risus pulvinar eu, cursus enim scelerisque natoque, rhoncus integer. Vel ridiculus lundium vel, massa! Ac. <div class="col-2"> <h3>editable in Admin</h3> <img style="float: left; margin: 0 20px 20px 0;" src="{{media url="wysiwyg/gadget/blok2_2.png"}}" alt="" /> Augue mid egestas magna ac? Augue integer hac, amet porttitor turpis. Massa! Enim amet non. Urna purus tincidunt augue montes? Adipiscing diam quis adipiscing, augue dolor massa? Elementum, aliquam elit. Mus eu lacus habitasse. Arcu, risus pulvinar eu, cursus enim scelerisque natoque, rhoncus integer. Vel ridiculus lundium vel, massa! Ac.Elementum, aliquam elit. Mus eu lacus habitasse. Arcu, risus pulvinar eu, cursus enim scelerisque natoque, rhoncus integer. Vel ridiculus lundium vel, massa! Ac. Click the Save Page button. 8theme 28 GadgetStore Magento Theme Instructions
Navigation Custom Block2 This navigation custom blocks can be changed in the backend. Go to 'CMS -> Static Blocks', edit nav_block10 or create new if it doesn t exist: <div class="col4-set"> <div class="col-1"> <h3>custom Block</h3> Augue mid egestas magna ac? Augue integer hac, amet porttitor turpis. Massa! Enim amet non. Urna purus tincidunt augue montes? <div class="col-2"> <h3>your HTML</h3> <img style="float: left; margin: 0 20px 20px 0;" src="{{media url="wysiwyg/gadget/blok1_2.png"}}" alt="" /> Augue mid egestas magna ac? Augue integer hac, amet porttitor turpis. Massa! Enim amet non. Urna purus tincidunt augue montes? <div class="col-3"> <h3>editable in Admin</h3> <img style="float: left; margin: 0 20px 20px 0;" src="{{media url="wysiwyg/gadget/blok1_3.png"}}" alt="" /> Augue mid egestas magna ac? Augue integer hac, amet porttitor turpis. Massa! Enim amet non. Urna purus tincidunt augue montes? <div class="col-4"> <h3>cms->static Blocks</h3> <img style="float: left; margin: 0 20px 20px 0;" src="{{media url="wysiwyg/gadget/blok1_4.png"}}" alt="" /> Augue mid egestas magna ac? Augue integer hac, amet porttitor turpis. Massa! Enim amet non. Urna purus tincidunt augue montes? Click the Save Page button. 8theme 29 GadgetStore Magento Theme Instructions
HTML Block This navigation custom blocks can be changed in the backend. Go to 'CMS -> Static Blocks', edit left_block1 or create new if it doesn t exist: <div class="category-block-1-img" style="padding-bottom: 15px; border-bottom: 1px solid #e1e1e1; text-align: center;"><img src="{{media url="wysiwyg/gadget/category_static_block_banner.png"}}" alt="" /> <div class="category-block-1-txt" style="color: #575757; padding-top: 10px;"> <p>you can add this block from admin panel via CMS Blocks</p> Click the Save Page button. 8theme 30 GadgetStore Magento Theme Instructions
HTML Block This Editable in Admin blocks can be changed in the backend. Go to 'CMS -> Static Blocks', edit left_block2 or create new if it doesn t exist: <div class="category-block-2-content" style="border-bottom: 1px solid #e1e1e1;"> <p>lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p> <div class="category-block-2-txt" style="margin-top: 10px;"> <p>you can add this block from admin panel via CMS - Blocks</p> Click the Save Page button. 8theme 31 GadgetStore Magento Theme Instructions
HTML Block This HTML blocks can be changed in the backend. Go to 'CMS -> Static Blocks', edit right_block1 or create new if it doesn t exist: <div class="category-block-1-img" style="padding-bottom: 15px; border-bottom: 1px solid #e1e1e1; text-align: center;"><img src="http://8theme.com/demo/gadgetstore/media/wysiwyg/gadget/category_static_block_banner.png" alt="" /> <div class="category-block-1-txt" style="color: #575757; padding-top: 10px;"> <p>you can add this block from admin panel via CMS - Blocks</p> Click the Save Page button. 8theme 32 GadgetStore Magento Theme Instructions
HTML Block This left block without design blocks can be changed in the backend. Go to 'CMS -> Static Blocks', edit left_block_without_design1 or create new if it doesn t exist: <p><img src="{{media url="wysiwyg/gadget/banner_left.png"}}" alt="" /></p> Click the Save Page button. 8theme 33 GadgetStore Magento Theme Instructions
HTML Tab This HTML Tab without design blocks can be changed in the backend. Go to 'CMS -> Static Blocks', edit product_custom_tab or create new if it doesn t exist: <div class="col2-set"> <div class="col-1"> <h3>custom HTML</h3> <img style="float: left; margin: 0 20px 20px 0;" src="{{media url="wysiwyg/gadget/blok2_1.png"}}" alt="" /> Augue mid egestas magna ac? Augue integer hac, amet porttitor turpis. Massa! Enim amet non. Urna purus tincidunt augue montes? Adipiscing diam quis adipiscing, augue dolor massa? Elementum, aliquam elit. Mus eu lacus habitasse. Arcu, risus pulvinar eu, cursus enim scelerisque natoque, rhoncus integer. Vel ridiculus lundium vel, massa! Ac.Elementum, aliquam elit. Mus eu lacus habitasse. Arcu, risus pulvinar eu, cursus enim scelerisque natoque, rhoncus integer. Vel ridiculus lundium vel, massa! Ac. <div class="col-2"> <h3>editable in Admin</h3> <img style="float: left; margin: 0 20px 20px 0;" src="{{media url="wysiwyg/gadget/blok2_2.png"}}" alt="" /> Augue mid egestas magna ac? Augue integer hac, amet porttitor turpis. Massa! Enim amet non. Urna purus tincidunt augue montes? Adipiscing diam quis adipiscing, augue dolor massa? Elementum, aliquam elit. Mus eu lacus habitasse. Arcu, risus pulvinar eu, cursus enim scelerisque natoque, rhoncus integer. Vel ridiculus lundium vel, massa! Ac.Elementum, aliquam elit. Mus eu lacus habitasse. Arcu, risus pulvinar eu, cursus enim scelerisque natoque, rhoncus integer. Vel ridiculus lundium vel, massa! Ac. Click the Save Page button. 8theme 34 GadgetStore Magento Theme Instructions
New Product Blocks New arrivals product in this month on homepage Edit a product and set certain value for attributes Set Product as New from Date and Set Product as New to Date. 8theme 35 GadgetStore Magento Theme Instructions
Theme Options For easing the template configuration it has been created small module. You can see the template configurations on the page 'System -> Configuration'. I have provided a few options, which you can manage from admin panel without editing template: 1. General Options Menu type: Available Options: Wide Menu, Superfish Menu By Default: Wide Menu Additional Navigation Link: Available Options: Text By Default: Clearance Additional Navigation Link URL Available Options: Text By Default: # Header Phone Available Options: Text 2. Slideshow Options Use Slideshow: Available Options: Enable, Disable By Default: Enable Speed: By Default: 8000 8theme 36 GadgetStore Magento Theme Instructions
Theme Options 3. Background Options Background-color: Available Options: Enable, Disable By Default: Enable Background-image: Available Options: Text Background-repeat Available Options: no-repeat, repeat-x, repeat-y By Default: select Background- attachment Available Options: fixed, scroll By Default: select Background-position (X) Available Options: left, center, right By Default: select Background-position (Y) Available Options: top, center, bottom By Default: select 4.Product List Page Shopping options: Available Options: Opened, Collapsed By Default: Opened 8theme 37 GadgetStore Magento Theme Instructions
Theme Options Ajax "Add to cart": Available Options: Enable, Disable By Default: Enable "New product" label: Available Options: Enable, Disable By Default: Enable "Product on sale" label: Available Options: Enable, Disable By Default: Enable 5.Product Page Use zoom for product images: Available Options: Enable, Disable By Default: Enable Use product scrollbar: Available Options: Enable, Disable By Default: Enable Ajax "Add to cart": Available Options: Enable, Disable By Default: Enable 6. Share Options Use Share Links: Available Options: Enable, Disable By Default: Enable 8theme 38 GadgetStore Magento Theme Instructions
Share Code: Available Options: Text By Default: <div style="clear: both;"> <div class="addthis_toolbox addthis_default_style "> <a class="addthis_button_preferred_1"></a> <a class="addthis_button_preferred_2"></a> <a class="addthis_button_preferred_3"></a> <a class="addthis_button_preferred_4"></a> <a class="addthis_button_compact"></a> <a class="addthis_counter addthis_bubble_style"></a> <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa- 4ee497253584a61e"></script> 8theme 39 GadgetStore Magento Theme Instructions
Troubleshooting 1. I'm getting 404 not found when trying to open theme admin pages. Log out from Magento admin panel, clear the store cache under var/cache, and log in again. 2. After the extension installation the store gives an error, or blank page. Log out from Magento admin panel. Change the owner of the extracted extension files to the web server user and set 775 permissions on them. Clear the store cache and try again. 3. My configuration changes do not appear on the frontend. Clear the store cache under var/cache, clear all browser cookies for your store domain and refresh the page in your browser. 4. If you have more questions you need to make a request via our website and we will help you 8theme 40 GadgetStore Magento Theme Instructions
Using Magento Helpful Resources There are tutorials, articles, forums and screencasts to help you learn how to use Magento and its features. This section provides helpful links to instructions on commonly used Magento features, but you can learn even more by exploring these resources: Knowledge Base Screencasts Magento Wiki Magento Forum 8theme 41 GadgetStore Magento Theme Instructions
Using Magento Categories To help customers browse your online store efficiently, you will most likely need to organize your products into categories and sub-categories. Please read the following documentation to learn how to create and manage categories. Tutorial: Creating and Managing Categories Admin Panel > Categories > Manage Categories 8theme 42 GadgetStore Magento Theme Instructions
Using Magento Adding Products to Your Online Store You will, of course, need to know how to add products to your online store. The following links will help you set up, organize and manage your products, and add images and product descriptions. Tutorial: Creating Products Magento Screencast: Creating a Simple Product Adding a New Product 8theme 43 GadgetStore Magento Theme Instructions
Additional Help For more information on using Magento, please use the resources mentioned in the Using Magento section of this documentation. Thank you for purchasing GadgetStore for Magento! 8theme 44 GadgetStore Magento Theme Instructions