“Linear” Documentation by “Aldema” v1.0.5


“Linear” OpenCart Theme

Compatible with: OpenCart 1.5.4.1

Created: 9/08/2012
By: Aldema Studio
Email: support@aldemastudio.com

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!


Table of Contents

  1. Installation and upgrades
    1. How to install Linear from scratch
    2. How to install Linear as the demo site
    3. How to contact us if you have installation problems
  2. Layout
  3. How To and FAQ
    1. How can I change text, link colors and background colors?
    2. How can I change patterns?
    3. Why is the dotted line still gray after changing border colors?
    4. Help! A character (or the entire alphabet of my language) is not displayed!
    5. Can category submenus in sidebar stay open?
    6. How can I customize the Facebook Box in the footer?
    7. How can I use my Twitter account with the Twitter Box in the footer?
    8. How can I change the position of the sidebar?
    9. How can I display a category in the horizontal top menu?
    10. Help! Some (or all) manufacturers are not displayed in the top submenu!
    11. How can I change payment images in the footer?
    12. How can I use the featured and latest modules shown on the demo home page?
    13. How can I add banners?
    14. How can I add product sliders (eg: demo home page)?
    15. How can I add the manufacturers slider?
    16. Help! After installing a new language I get an error and HOW TO translate Linear
    17. Help! I want to add a module to a page but that page is not available amongst layouts
    18. Help! I've just installed the bestseller module (or the featured module) but it's empty
    19. How can I add one more level of subcategory in the category module?
    20. How can I add text modules to the sidebar and the main content area?
    21. How can I install a third parts module?
    22. Help the template takes lots of seconds to show up
    23. How can I add special, featured and latest modules to the sidebar?
    24. Can I use bigger images in sidebar modules?
    25. How can I stylize the content of text pages (eg: information pages)?
    26. Can I use a different image displaying system in product page?
    27. How can I customize text (eg: phone number, footer titles, breadcrumb text, etc)?
    28. How can I set grid view as default in category page?
    29. How can I change the background of the sale ribbon?
    30. How can I use the FancyBox overlay?
    31. Can I enable FancyBox titles?
  4. Sources and Credits

A) Installation and upgrades - top

Please, read the whole section before attempting to install this theme.
It is recommended to always backup your system before making upgrades or changes!

After the release of our latest HTML template, Aldema Studio is proud to announce that Linear is finally available for OpenCart 1.5.4.1! Having learnt from the experience of Basico, this time we limited changes to core files and worked mainly on tpl files. These are the only edited core files:

We marked with comments all the edited lines, so that if you have to replace those files (for example, when installing a plugin that overrides header.php or footer.php), you simply need to copy the edited lines inside your overriding files. We customized graphically all the existing OpenCart modules and we also created some new ones to add more features to your shop. Read carefully the documentation and follow the instructions: they will guide you throughout the entire installation process.

ALDEMA STUDIO RECOMMENDS TO USE THIS THEME ON A CLEAN INSTALLATION OR EXISTING SHOPS WITHOUT CUSTOM CORE MODIFICATIONS!

Since there are not heavy changes to core files, Linear should need only small fixes even after major OpenCart version updates. You should not, however, upgrade your OpenCart version or install Linear on a new updated OC version unless we have previously checked files for compatibility and made changes if needed. Usually that takes only few days after the release of a new OpenCart version. Since we can not predict what would change in newer versions it's recommended to install Linear only on the OpenCart versions listed above or on our Themeforest page.

1) HOW TO INSTALL LINEAR FROM SCRATCH

Step 1: Before installing this theme, get first a working OpenCart installation. Please read the official documentation and install OpenCart on your server.

Step 2:  Unzip the files included in the OpenCart_v.yourversionnumber directory of the downloaded zip file, copy and paste them into the OpenCart directory on your server.

Step 3: Activate the theme. Log in the OpenCart administration panel and activate the theme from System > Settings > Edit > Store tab > Template. Select Linear from the list.

Step 4: Install and activate the control panel. Differently from Basico, we decided to not edit directly the OpenCart backend panel and we realized a control panel module. Log in the OpenCart administration panel and install it from Extensions > Modules > Control Panel > click on Install. Once the CP has been installed, click on Edit and then save the settings, even without making any changes. Since this is the first installation, the theme simply need some variables to be set. Warning: YOU CANNOT SKIP THIS STEP.

Step 5: Click on System > Settings > Edit > Image Tab. Set the images dimensions as below then save the settings:

Step 6: Linear is ready to be used. Just install modules, add categories, products, manufactures etc as you would in any other OpenCart shop.

2) HOW TO INSTALL LINEAR AS THE DEMO SITE

There's another way to install Linear: by importing a sql file into your database. This requires the access to the phpmyadmin panel of your database: generally it can be done from your host's website, after loggin in.

Step 1: When installing OpenCart, make sure you type "linear_" as database prefix. If you don't use that table prefix, you won't be able to import the sql file.

Step 2:  Unzip the files included in the OpenCart_v.yourversionnumber directory of the downloaded zip file, copy and paste them into the OpenCart directory on your server.

Step 3: Log in the phpmyadmin of your database, select the current OpenCart database and click on "SQL".

Paste those queries inside the text box and execute them.

        TRUNCATE `linear_banner`;
TRUNCATE `linear_banner_image`;
TRUNCATE `linear_banner_image_description`;
TRUNCATE `linear_category`;
TRUNCATE `linear_category_description`;
TRUNCATE `linear_category_to_layout`;
TRUNCATE `linear_category_to_store`;
TRUNCATE `linear_extension`;
TRUNCATE `linear_information`;
TRUNCATE `linear_information_description`;
TRUNCATE `linear_information_to_layout`;
TRUNCATE `linear_information_to_store`;
TRUNCATE `linear_layout`;
TRUNCATE `linear_layout_route`;
TRUNCATE `linear_manufacturer`;
TRUNCATE `linear_manufacturer_to_store`;
TRUNCATE `linear_product`;
TRUNCATE `linear_product_attribute`;
TRUNCATE `linear_product_description`;
TRUNCATE `linear_product_discount`;
TRUNCATE `linear_product_image`;
TRUNCATE `linear_product_option`;
TRUNCATE `linear_product_option_value`;
TRUNCATE `linear_product_related`;
TRUNCATE `linear_product_reward`;
TRUNCATE `linear_product_special`;
TRUNCATE `linear_product_to_category`;
TRUNCATE `linear_product_to_download`;
TRUNCATE `linear_product_to_layout`;
TRUNCATE `linear_product_to_store`;
TRUNCATE `linear_setting`;

Step 4: Click on "Import" and select "linear-db.sql" included in the zip file. Go ahead and click on "Go" to import the file.

Step 5: Linear is now ready to use. Obviously you'll see white images, since demo sites photos are not included. Do all the changes you need to setup your shop properly: rename categories, add new ones, rename, remove or add products and so on.

3) HOW TO CONTACT US IF YOU HAVE INSTALLATION PROBLEMS

All the info you need are in the "HOW TO AND FAQ" chapter, so make sure you read it carefully to know how to customize Linear. You can contact us direcly on the Linear page on Themeforest, but for installation problems contact us at support@aldemastudio.com and send us:

1) the URL of your shop
2) the admin access of your current OpenCart installation
3) the FTP access to your site
4) the URL and the access to the phpmyadmin panel of your database

All emails will be replied in no longer than 24-48 hours.

Important:


B) Layout - top

Linear gives the user a high level of customization, so we changed the default layout of OpenCart and split the page differently:

Header, footer and content are auto-filled by the OpenCart's code, so don't worry about them. Content top, Column Left, Column Right and Content Bottom are for custom content: modules can be added here. Please notice that the sidebar is always in the Column Right, even when it's placed on the left side of the page.


C) How To and FAQ - top

This brief "How To" guide will save you (and us) a lot of time by explaing how to make a basic customization of the theme. So please, before asking for help on Themeforest or via email, make sure you have read the following chapter.

1) HOW CAN I CHANGE TEXT, LINK COLORS AND BACKGROUND COLORS?

It can be achieved from the Control Panel Module. Log in the OpenCart administration panel and click on Extensions > Modules > Control Panel > Edit. Use the input boxes below "TEXT, BORDERS AND BACKGROUNDS" and use the color picker to choose amongst available colors.

2) HOW CAN I CHANGE PATTERNS?

Log in the OpenCart administration panel and click on Extensions > Modules > Control Panel > Edit. Find the line "Patterns for header and footer" and enable patterns by switching the select box on "Yes". Click on the square with grey borders to open the Image Manager: select one of the existing backgrounds or upload a new one. We provide 7 different patterns:

3) WHY IS THE DOTTED LINE STILL GRAY AFTER CHANGING BORDER COLORS?

We're talking about this:

It happens because that's an image, so if you want to change it, log in the OpenCart administration panel and click on Extensions > Modules > Control Panel > Edit. Find the line "Dotted Line" and click on the existing image to replace it with an existing or a new one.

4) HELP! A CHARACTER (OR THE ENTIRE ALPHABET OF MY LANGUAGE) IS NOT DISPLAYED!

This was absolutely the most common problem of our previous release. Unfortunately, a font chosen by the developer could not support every language and character. If you don't see your alphabet properly or it's not displayed at all (as it may happen to chinese, russian, turkish, vietnamese, etc, users) you need to replace our font with your language's one. First, find a cool font that supports your language, than load it here. Make sure you type "Open Sans" in this input-box:

Even if it's not the correct name of your font, this will prevent you from editing more files, since that line pretends that the OpenSans font is still used by the template. Download the new font, rename it "open-sans-latin.js" and replace the file with the same name in catalog/view/javascript.

5) CAN CATEGORY SUBMENUS IN SIDEBAR STAY OPEN?

Yes. This was one of the most frequently asked questions, but it has to be done manually if needed. Open catalog/view/theme/Linear/template/module/category.tpl. Remove the "hoverable" class from the submenu <ul> tag in these lines:

		<ul <?php if ($category['category_id'] != $category_id) { ?> class="hoverable"
<?php } ?> >
<?php foreach ($category['children'] as $child) { ?>
<li>
<?php if ($child['category_id'] == $child_id) { ?>
<a href="<?php echo $child['href']; ?>" class="active"><?php echo $child['name']; ?></a>
<?php } else { ?>
<a href="<?php echo $child['href']; ?>"><?php echo $child['name']; ?></a>
<?php } ?>
</li>
<?php } ?>
</ul>
This is how the category menu with submenu always open should look like:
		<ul <?php if ($category['category_id'] != $category_id) { ?>
<?php } ?> >
<?php foreach ($category['children'] as $child) { ?>
<li>
<?php if ($child['category_id'] == $child_id) { ?>
<a href="<?php echo $child['href']; ?>" class="active"><?php echo $child['name']; ?></a>
<?php } else { ?>
<a href="<?php echo $child['href']; ?>"><?php echo $child['name']; ?></a>
<?php } ?>
</li>
<?php } ?>
</ul>

6) HOW CAN I CUSTOMIZE THE FACEBOOK BOX IN THE FOOTER?

Log in the OpenCart administration panel and click on Extensions > Modules > Control Panel > Edit. Find the line "Facebook Account Id" under "Social Boxes". The number is the ID number of the current Facebook page account linked to the box: replace it with the one of your fanpage. If you don't know how to get your page ID, read this. Also, do not forget that the Facebook box works ONLY with Facebook PAGES and not with a common USER account. For example, if you have created a normal USER account for your shop, as if it was a real person, don't expect that it will work in the Facebook Box. Instead, create a fan page from that account and put its ID in the box.

7) HOW CAN I USE MY TWITTER ACCOUNT WITH THE TWITTER BOX IN THE FOOTER?

Log in the OpenCart administration panel and click on Extensions > Modules > Control Panel > Edit. Find the line "Twitter Account Name" right below "Social Boxes". Replace "WPNewsStation" with the name of the Twitter account you want to use. Lately the Twitter box was off for several hours due to a problem with the Twitter API. This also makes the site very slow (something like 20 seconds to load a page). It's not our fault, we cannot do anything to fix this problem. Anyway, things usually get fixed after some hours. If, in case of emergency, you want to "shut down" the Twitter box, open "catalog/view/theme/Linear/template/common/footer.tpl and replace this line:

		 <script type="text/javascript" src="http://twitter.com/statuses/user_timeline/
<?php echo $twitter_name; ?>.json?callback=twitterCallback2&amp;count=2"></script>

with:

		 <!-- <script type="text/javascript" src="http://twitter.com/statuses/user_timeline/
<?php echo $twitter_name; ?>.json?callback=twitterCallback2&amp;count=2"></script> -->

By wrapping the Twitter's code in a HTML comment, you'll temporarily turn off Twitter from your site

8) HOW CAN I CHANGE THE POSITION OF THE SIDEBAR?

Log in the OpenCart administration panel and click on Extensions > Modules > Control Panel > Edit and use the select box next to "Sidebar Position", in the Sidebar section. As already written here, if you want to display a module in the sidebar you always have to set its position to "Column Right", even if you want the sidebar on the left. Just put each modules in Column Right and then change the sidebar position from the Control Panel.

9) HOW CAN I DISPLAY A CATEGORY IN THE HORIZONTAL TOP MENU?

This is how OpenCart works and it's not a custom feature of our theme. But since we got asked so many times, here's how to do it:

Log in the Administration Panel and click on catalog > categories. Find the category you want to show in the top menu and click on Edit. Just make sure the "Top" checkbox in the "Data" tab is checked.

10) HELP! SOME (OR ALL) MANUFACTURERS ARE NOT DISPLAYED IN THE TOP SUBMENU!

You have just added a new product, assigned it to a category, but the brand of that product is not displayed in the top submenu, below "categoryname Manufacturers". Each product should ALWAYS be assigned to the first level parent category and not only to a subcategory. Let's assume you have a "Kitchen" main cateogory that contains a "Cabinets" subcategory. If you assign only the "Cabinets" subcategory to a product, that product's brand won't be shown in the manufacturers list in the top submenu. Assign also the main parent category (Kitchen) to the product and the problem will be fixed.

11) HOW CAN I CHANGE PAYMENT IMAGES IN THE FOOTER?

Log in the OpenCart administration panel and click on Extensions > Modules > Control Panel > Edit and find the "Footer Payment Images" section. Use the select box to choose the number of images to display, then Save the settings. Re-open the Control Panel, click on the added payment images to open the Image Manager: choose an image or upload a new one and save the settings again. You can find more images here.

12) HOW CAN I USE THE FEATURED AND LATEST MODULES SHOWN ON THE DEMO HOME PAGE?

They are common modules, so they can be found in Extensions > Modules.

The latest module is called "Latest Content" and shows the latest products (their number is customizable from the "Limit" input box.

If you need to products to be displayed in grid view, disable the jCarousel plugin, which makes all the products scrollable in a slider:

When the jCarousel plugin is active, you're able to choose the numbers of products to slide on click: type it in the "Scroll" input box.

The featured module works exactly as the latest one: its name is "Featured Content". Both are meant to be placed in "Column Left" or "Content Bottom". If you need to change the heading title, simply edit catalog/language/yourlanguage/module/featured_content.php or catalog/language/yourlanguage/module/latest_content.php.

13) HOW CAN I ADD BANNERS?

It's the normal OpenCart way to do it. First, open System > Design > Banner and click on Insert. Add a banner name and click on Add Banner, give it a title, a link and select an image, then save the settings. You can use only one image for banner.

After designing the banner, open Extensions > Modules > Banner and click on Add Module. Select the added banner from the "Banner:" select box and fill the form. Banners can be added both in the sidebar (Column Right) and in the main content area (Column Left, Content Bottom or even in Content Top if you need too).

In sidebar the width of the banner should never be more than 142px.

For modules in the main content area, the maximum width of a banner is 742px. However, smaller consecutive banners in the content area will position one next to the other with a 33px margin (eg: the "free shipping" and "linear offers" on the demo home page).

14) HOW CAN I ADD PRODUCT SLIDERS (eg: demo home page)?

In Linear there are three sliders: one with jCarousel Lite, one with Nivo Slider (both working with banners) and a third with jCarousel Lite but with featured products. For the first two sliders, you should first create a new banner: open System > Design > Banner and click on Insert. Add a banner name and click on Add Banner, give it a title, a link and select an image, then save the settings. Since product sliders are modules you can find them in Extensions > Modules.

To add the jCarousel slider, open Extensions > Modules > Slideshow jCarousel Lite.

Add a new module, select the banner previously created and fill the whole form. Then, save the setting.

The "What's new" line and the link of the "Fixed Text Here" caption can be edited in catalog/language/youlanguagedirectory/module/slideshow2.php

To add the NivoSlider slider, open Extensions > Modules > Slideshow NivoSlider. Add a new module, select the banner previously created and fill the whole form. Then, save the setting. Here's the result:

The "What's new" line can be edited in catalog/language/english/module/slidershow.php. Differently from the jcarousel slider, the link on the NivoSlider's caption is dynamic and points to the product currently displayed. Eg: if the slider is showing "Product A", the line after "What's new" is linked to Product A's page.

To add the jCarousel slider with featured products, you don't need to create a banner. Just open Extensions > Modules > Slideshow jCarousel Lite - Featured Products, add a new module, set image dimensions at 400px x 258px, type some products and select them as they appear in the drop down menu.

After saving the settings, this is the result:

15) HOW CAN I ADD THE MANUFACTURERS SLIDER?

First create a new banner: open System > Design > Banner and click on Insert. Add a banner name and click on Add Banner, give it the manufacturer name's as title, a link to the manufacturer's page and select the brand's logo as image. Click again on Add Banner and repeat the process for all the manufacturers you want to display, then save the settings.

Now click on Extensions > Modules > Carousel and click on Add Module. Select the banner you've just created and fill the rest of the form. The image dimensions should be: 118px and 78px.

Save the settings, and this is the result:

16) HELP! AFTER INSTALLING A NEW LANGUAGE I GET AN ERROR AND HOW TO TRANSLATE LINEAR

Linear has an additional file for its custom text: "catalog/language/english/linear.php". When you install another language in your OpenCart, make sure you copy linear.php file in the new language directory. For example, if you install the spanish language, copy linear.php from the english root to:

catalog/language/spanish/

You also need to copy the content of "catalog/language/english/module/" and "admin/language/english/module/" in the same paths of your new language. If you don't copy those files, Linear will give you the annoying error "Could not load language etc etc".

If you have installed a new language and some elements still appears untraslated, open the file "catalog/language/yournewlanguage/linear.php" and manually translate the content you want, then save the file.

17) HELP! I WANT TO ADD A MODULE TO A PAGE, BUT THAT PAGE IS NOT AVAILABLE AMONGST LAYOUTS

If the page you're looking for is not within the "layout" select box (for example "product/search"), click on "System > Design > Layout" to add a new layout position.

Then click on "Insert", type a layout name and click on "Add Route". Type the page's route and click on "Save".

18) HELP! I'VE JUST ADDED THE BESTSELLER MODULE (OR THE FEATURED MODULE) BUT IT'S EMPTY

Yeah, we've been asked even this! The bestseller module is empty because... well, you haven't sold a product yet! And this is how the featured module works. We suggest you to read carefully the OpenCart documentation.

19) HOW CAN I ADD ONE MORE LEVEL OF SUBCATEGORY IN THE CATEGORY MODULE?

Maybe this could help you. The top menu, instead, currently supports 3 levels of subcategories.

20) HOW CAN I ADD TEXT MODULES TO THE SIDEBAR AND THE MAIN CONTENT AREA?

Click on Extensions > Modules >Text Widget. Add a new module, type the title and the content of the widget, then select a layout amongst Column Right (if you want it in the sidebar), Column Left and Content Bottom. The widget dimensions will adjust automatically.

21) HOW CAN I INSTALL A THIRD PARTS MODULE?

Obviously we cannot provide assistance for third parts modules. However to guarantee a better compatibility with such products, we decided to limit core files editing. There are some changes only in catalog/controller/common/header.php and catalog/controller/common/footer.php. If you're going to install an OpenCart plugin that may replace those files, before installing additional modules make first a backup of header.php and footer.php. The edited lines are wrapped around php comments, so all you need to do is copy those lines inside the replaced files, at the same position.

22) HELP THE TEMPLATE TAKES LOTS OF SECONDS TO SHOW UP

It may be caused from the Twitter API. For more information read here.

23) HOW CAN I ADD SPECIAL, FEATURED AND LATEST MODULES TO THE SIDEBAR?

From the administration panel, click on Extensions > Modules > Special/Featured/Latest. Dimensions should always be both of 54px. Set "Column Right" as Position.

24) CAN I USE BIGGER IMAGES IN SIDEBAR MODULES?

Yes, you can, but you should use only fixed image dimensions. The first thing to do is to activate the sidebar image floating. To do so, log in the administration panel, click on Extensions > Modules > Control Panel > Edit. Find "Sidebar Image Float" and select "Yes". Then click on Extensions > Modules > Special/Featured/Latest. Now change image dimensions to 143px. Here's the result:

 

25) HOW CAN I STYLIZE THE CONTENT OF TEXT PAGES (EG:INFORMATION PAGES)?

We provided some basic styles inside the About Us page, including a column grid. Take a look at the HTML code of that page from the admin panel.

26) CAN I USE A DIFFERENT IMAGE DISPLAYING SYSTEM IN PRODUCT PAGE?

Yes you can choose between CloudZoom and FaancyBox. Log in the OpenCart administration panel and click on Extensions > Modules > Control Panel > Edit. Use the select box below "PRODUCT PAGE IMAGE DISPLAYING SYSTEM" to choose the current one.

27) HOW CAN I CUSTOMIZE TEXT (eg: phone number, footer titles, breadcrumb text, etc)?

You can find text in catalog/language/yourlanguagefolder/linear.php

28) HOW CAN I SET GRID VIEW AS DEFAULT IN CATEGORY PAGE?

Open catalog/view/theme/Linear/template/product/category.tpl and replace this:

        if (view) {
    display(view);
} else {
    display('list');
}
with:
        if (view) {
            display(view);
} else {     display('grid'); }

Restart your browser and clear your cache to see the changes.

29) HOW CAN I CHANGE THE BACKGROUND OF THE SALE RIBBON?

It's an image and you can find it in catalog/view/theme/Linear/image/sale.png.

30) HOW CAN I USE THE FANCYBOX OVERLAY?

Log in the admin panel and click on Extension > Modules > Control Panel. Set the FancyBox overlay on "Yes". If you want to change the color and the opacity of the overlay, edit catalog/view/theme/Linear/template/product/product.tpl and edit the following lines:

	'overlayColor'  :   '#000', //overlay color
    'overlayOpacity':   0.7 //overlay opacity

31) CAN I ENABLE FANCYBOX TITLES?

Log in the admin panel and click on Extension > Modules > Control Panel. Set the FancyBox titles on "Yes"


D) Sources and Credits - top

We have used some third parts images and files, so we'd like to thank:

A special thanks also to the creators of used jquery plugins.


Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

Aldema

Go To Table of Contents