Hi there! Welcome to the Web-Experiment.info - Customized Web Scraping And Data Extraction Solutions.
You will need to enable JavaScript in your browser to use our Magento themes and extensions store. If you are really stuck, you can email us at support@web-experimen.info and we will do our best to help

Home /
Expert System /
Magento Universal Blue theme installation guide

Magento Universal Blue theme installation guide

You can now free install our themes automatically with Magenting.com - professional Magento hosting.

Initial installation

1. Copy files from the package theme/ dir to your Magento Directory (PSD/ dir in the package holds PSD source files).

2. Navigate to Backend->System->Configuration->Design->Package Tab-> Current Package Name Field and set this field to default value

3. Navigate to Backend->System->Configuration->Design->Themes Tab and set all fields to universal-blue value.

4. Navigate to Backend->System->Configuration->Content Management Tab and set "Enable WYSIWYG Editor" to Disable by Default value.

Now do the following actions from the admin side.

Create category for main navigation menu

In order to get the main navigation visible, you need to create at least one active subcategory in the root folder. Category should be subcategory of the Root (default) category. Category must be active to be showing in the main navigation. Wiki: How to create new categories in Magento

Create new Magento category

Create hidden categories

Create 3 categories as subcategories to your theme default category. They must be inactive to be hidden in the main navigation. These categories will be for "Home page favorites", "Home page product sales" and "Popular products". Remember the IDs of these categories. See the image below.

Once categories are created it is good to add several products to them. Do not forget to keep indexes in touch. System->Index Management

Create Static Block left_info_block

Go to CMS->Static Block to add new static blocks.

Block Title*	left_info_block
Identifier*	left_info_block
Store View*	Select correct store view
Status	Enabled*
Content Do not forget to replace PopularProductsCategoryID with actual category id	<div class="block testimonial"> <div class="block-title"><strong><span>Testimonial</span></strong></div> <div class="block-content"> <div class="dc-widget-postslider" style="height: 85px;"> <div class="slides-wrapper"> <div class="slide"> <p>I am quite impressed with your level of customer service. I am really satisfied with UniversalBlue Magento Template. I will reccomend you to my collegues.</p> <p class="signt">Matthew Bailey, C-Soft</p> </div> <div class="slide"> <p>Excellent work – love it!!! Very nice theme, I am enjoying playing around with it so far. Thanx so much for this wonderful theme – worth every $! Totally love it. Keep up the great work buddy!</p> <p class="signt">Brendon</p> </div> <div class="slide"> <p>UniversalBlue is an outstanding theme. For anyone trying to build a clean e-commerce style, it’s among the best available</p> <p class="signt">Dan</p> </div> <div class="slide"> <p>It works great! Very, very nice work. I’ve played for an hour or so and everything fits together extremely well.</p> <p class="signt">Tim Windsor</p> </div> </div> <div class="btn-bar"><a class="btn-active">1</a><a class="btn">2</a><a class="btn">3</a><a class="btn">4</a></div> </div> </div> <p class="link"><a href="#"><span>View all</span></a></p> </div> <div></div> <div class="dc-widget-postslider" style="height: 120px;"> <div class="slides-wrapper"> <div class="slide"><a href="#" title=""><img src="https://web-experiment.info/media/"universal_blue/sm_ban01.jpg"" alt="" /></a></div> <div class="slide"><a href="#" title=""><img src="https://web-experiment.info/media/"universal_blue/sm_ban02.jpg"" alt="" /></a></div> <div class="slide"><a href="#" title=""><img src="https://web-experiment.info/media/"universal_blue/sm_ban03.jpg"" alt="" /></a> <a class="desc" href="#">A new iPod shuffle</a></div> </div> <div class="btn-bar"><a class="btn-active">1</a><a class="btn">2</a><a class="btn">3</a></div> </div>

Create Static Block footer_links

Go to CMS->Static Block to add new static blocks.

Block Title*	footer_links
Identifier*	footer_links
Store View*	Select correct store view
Status	Enabled*
Content	<div class="bott_banners"> <div class="bot_left"> <ul class="pic_links"> <li class="delivery"><img src="https://web-experiment.info/media/"universal_blue/icon_car_g.png"" alt="" />Simple returns and quick delivery</li> <li class="payments"><img src="https://web-experiment.info/media/"universal_blue/icon_lock_g.png"" alt="" /><img src="https://web-experiment.info/media/"universal_blue/payments.png"" alt="" />Secured Transactions</li> <li class="guarantee"><img src="https://web-experiment.info/media/"universal_blue/icon_heart_g.png"" alt="" />Money-back <br /> Satisfacion guarantee</li> <li class="phone"><img src="https://web-experiment.info/media/"universal_blue/icon_phone_g.png"" alt="" /><span>Mon-Fri 9.00 - 17.00</span><strong>8-800-800-800</strong></li> <li class="sp"><span>clear</span></li> </ul> <h3>SEO text goes here</h3> <ul class="bottom_links"> <li><a title="" href="#">Premium Magento template</a></li> <li><a title="" href="#">Electronics Magento template</a></li> <li><a title="" href="#">Wireless Accessories Magento template</a></li> <li><a title="" href="#">Laptops, Tablets < Netbooks Magento template</a></li> <li><a title="" href="#">Laptop Computers Magento template</a></li> <li><a title="" href="#">Tablets Magento template</a></li> <li><a title="" href="#">Chromebooks Magento template</a></li> <li><a title="" href="#">Netbooks Magento template</a></li> <li><a title="" href="#">Desktop computers Magento template</a></li> <li><a title="" href="#">Monitors Magento template</a></li> <li><a title="" href="#">Printers Magento template</a></li> <li><a title="" href="#">Software Magento template</a></li> <li><a title="" href="#">Computers < Accessories Magento template</a></li> </ul> <div class="sp"><span>clear</span></div> </div> <div class="bot_right"><img src="https://web-experiment.info/media/"universal_blue/offers_subscribe.png"" alt="" /></div> <div class="sp"><span>clear</span></div> </div>

Create Static Block quick_access_links

Go to CMS->Static Block to add new static blocks.

Block Title*	quick_access_links
Identifier*	quick_access_links
Store View*	Select correct store view
Status	Enabled*
Content	<ul class="top_links"> <li><a href="#">Testimonials</a></li> <li><a href="#">Blog</a></li> <li><a href="https://web-experiment.info/"contacts"/">Contact Us</a></li> </ul>

Create Static Block search_block_content

Go to CMS->Static Block to add new static blocks.

Block Title*	search_block_content
Identifier*	search_block_content
Store View*	Select correct store view
Status	Enabled*
Content	<h3><strong>Free Shipping!</strong> On all U.S. Order over $50</h3>

Create Static Block right_info_block

Go to CMS->Static Block to add new static blocks.

Block Title*	right_info_block
Identifier*	right_info_block
Store View*	Select correct store view
Status	Enabled*
Content	<h2>Static testimonial block</h2> <div class="block testimonial"> <div class="block-title"><strong><span>Testimonial</span></strong></div> <div class="block-content"> <p>I am quite impressed with your level of customer service. I am really satisfied with UniversalBlue Magento Template. I will reccomend you to my collegues.</p> <p class="signt">Matthew Bailey</p> <p class="link"><a href="#"><span>View all</span></a></p> </div> </div>

Edit home page

Go to CMS->Pages and Edit/Add home page

Page Title*	Any title you want
URL Key	home
Store View	Select correct store view
Status	Enabled*
Content Do not forget to replace FavoriteCategoryID, SalesCategoryID with the ID of one of the created categories	<div class="pure_color"> <div id="col2_slider" class="col2_slider" style="height: 290px; visibility: hidden;"> <script type="text/javascript"> jQuery(document).ready(function() { slider = jQuery('#slider-content'); slider_bottom = jQuery('#slider-bottom'); slider_top = jQuery('#slider-top'); slider_bottom .cycle({ fx: 'fade', timeout:3000, speed: 500, delay:600,pouse:1}); slider_top.cycle({ fx: 'fade', timeout: 3000, speed: 500, delay:600,pouse:1}); slider.before('<div id="stripNav0" class="stripNav">') .cycle({ fx: 'fade', timeout: 3000, speed: 800, pager:'#stripNav0', delay:0 ,pouse:1}); jQuery("#col2_slider").css("visibility","visible"); jQuery("#col2_right").css("visibility","visible"); }); ;</script> <div class="slider-wrap"> <div id="slider-content" class="slider-wrap"> <a title="" href="#"><img src="https://web-experiment.info/media/"universal_blue/laptop_computers_magento_template.jpg"" alt="" width="745" height="290" /></a> <a title="" href="#"><img src="https://web-experiment.info/media/"universal_blue/tv_magento_template.jpg"" alt="" width="745" height="290" /></a> <a title="" href="#"><img src="https://web-experiment.info/media/"universal_blue/printers_magento_template.jpg"" alt="" width="745" height="290" /></a> </div> </div> </div> <div id="col2_right" class="col2_right" style="height: 295px; visibility: hidden;"> <div id="slider-top" class="img_top"><a href="#"><img src="https://web-experiment.info/media/"universal_blue/software_magento_template.jpg"" alt="" width="240" height="160" /></a></div> <div id="slider-bottom" class="img_bt"><a href="#"><img src="https://web-experiment.info/media/"universal_blue/gadgets_magento_theme.jpg"" alt="" width="240" height="125" /></a></div> <div class="sp"><span>clear</span></div> </div> <div class="mid_banners"> <div class="mid_left"> <div><a title="" href="#"><img src="https://web-experiment.info/media/"universal_blue/premium_magento_theme.jpg"" alt="" /></a></div> </div> <div class="mid_center"> <div><a title="" href="#"><img src="https://web-experiment.info/media/"universal_blue/universal_magento_theme.jpg"" alt="" /></a></div> </div> <div class="mid_right"><a href="#"><img src="https://web-experiment.info/media/"universal_blue/simple_magento_theme.jpg"" alt="" width="240" height="145" /></a></div> <div class="sp"><span>clear</span></div> </div> <div class="mid_banners"> <div class="mid_left"> <h3>This Month's Favourites</h3> <div></div> </div> <div class="mid_center"> <h3>Save up to 1/2 price</h3> <div></div> </div> <div class="mid_right"> <h3>Don't Miss Out...</h3> <a href="#"><img src="https://web-experiment.info/media/"universal_blue/electronics_magento_template.jpg"" alt="" width="240" height="145" /></a></div> <div class="sp"><span>clear</span></div> </div> </div>
Layout	1-column*
Layout Update XML	<reference name="header"> <block type="cms/block" name="home_page_header_block"> <action method="setBlockId"><block_id>home_page_header_block</block_id> </action> </block> </reference> <reference name="head"> <action method="addItem"><type>skin_css</type><name>css/slider.css</name><params/></action> <action method="addItem"><type>skin_js</type><name>js/cycle-fade-effect.js</name></action> </reference>

Extensions

Custom Menu

Please load the extension here

Custom Menu Guides

Shipping price calculator and One page checkout

Included in the package.

We also recommend adding Lightbox extension to your Magento

How to change "jQuery Cycle Plugin" effect, for templates without "Total Slider Manager"

If you are using non English language(es):

Video tutorial by Template-help.com: How to install a new language

"Most Popular" sentence is not present in the default language packs. We need to add it manually.
Open file directory where your magento is. Go to "app/design/frontend/default/health-and-beauty/locale/"

There is a "en_US/translate.csv" file there. Copy it to any locale you need (like "da_DK/translate.csv") and edit "translate.csv" file.
It holds this text:
"Most Popular","Most Popular"
You need to change it to:
"Most Popular","[[Most popular in your language]]"

Note that file encoding should be UTF8.

Congratulations! Your magento theme is ready!

Thank you for using this theme.

Customer support

We provide support services through our special form at Web-Experiment.info. If you have any questions, please feel free to email us via our support form here here

Magento How Toes

Useful video tutorials powered by Template-help.com

Magento template customization

Video tutorials powered by Template-help.com

Go to contents Back to previous page

Share on Facebook google icon

Share on Google