Extension - Opencart Mobile Framework v.1.3.0.3 [vQmod]

A true mobile-enabled version of your store, up to 2700%+ faster than your desktop theme. Perfect for slow EDGE & 3G connections.

Live demo: http://www.omframework.com/demo

Features
===============
★ Auto-detection of mobile visitors
★ Up to 2700% faster than the default theme
★ Optimized for small mobile screens
★ Simplified interface
★ Acts as a default mobile theme
★ On average up to 7.5x HTTP request reduction
★ Validates as 94% mobile OK http://j.mp/Afm8GO
★ Uses mobile modules
★ Completely rewritten template files to reduce page size
★ No JavaScript

Speed Optimizations
===============
Knowing that most of the mobile users are in a hurry and not on a high speed connection the size of the generated pages was highly trimmed down. Only the most essential parts are left. This helps visitors focus on browsing, choosing and purchasing your products.

*Comparison
-------------------
Test results show 700% to 2700% faster loading on mobile devices compared to loading the default unoptimized theme that ships with OpenCart. See test table in the Images Section.

Screen size optimizations
===============
Applying the "mobile first" principle this is NOT a scaled down version of the default theme, but a responsive theme designed to fit every smart and featurephone screen out there.

Compatibility
===============
Everything works without JavaScript so this extension opens up your store to every internet enabled device with a browser. I could even checkout with my 8-year old phone!

Peculiarities
===============
This extension is designed to load *mobile* modules only. Mobile modules are adapted versions of the regular ones. That is why the modules on your desktop and mobile site are completely independant from each other.

Live demo: http://www.omframework.com/demo

WARNING: use a mobile browser or you won't see anything but the default opencart theme.

Download Name	Compatibility	Action
OpenCart Mobile Framework v.1.3.0.3	v1.5.1.2, v1.5.1.3	[ Download ]

Table of contents

1. Installation
2. Update
3. Customizing OMF
4. Changes from last version


====================
1. Installation
====================

1. Have vqmod installed
http://code.google.com/p/vqmod/wiki/Install_OpenCart

2. Upload the contents of "upload" folder to the root of your OpenCart installation

Worried about file copying?
http://www.opencart.com/index.php?route=documentation/documentation&path=77_62


--------------------
All categories
--------------------

You need to complete these steps in order for the link "All categories" to work.

At the end of the process you will have a page looking like this:
http://oc.rumendimitrov.com/omf/index.php?route=common/all_categories


1. In the Opencart admin panel go to
System > Design > Layouts

2. Insert a new Layout.
Name it however you want. I like to use the prefix [mobile] for all my mobile related layouts.
For example [mobile] All Categories.

3.Add the correct route
3.1. Click "Add Route"
3.2. If you have more than one store choose the correct one from the "Store" drop down menu.
3.3. On "Route" enter "common/all_categories" without the quotes. This is the route to our new page that will show all the categories available.
3.4 Click Save.

4. Now go to Extensions > Modules.
There you will find two mobile enabled modules, "Category Mobile" and "Slideshow Mobile".
You can use slideshow mobile to create a header/welcome image on your front page. Let's leave that for now.
4.1. Click install on "Category Mobile" or if it is already installed chose "Edit".
4.2. Now click "Add Module".
4.3. Choose the mobile layout you created in the previous step. ([mobile] All Categories).
4.4. Set position to "content bottom"
4.5. Click Save.

5. Test if it is working ok
Now visit your store with your mobile device and under the brief category list you'll see a link titled "All categories". Tap it and you'll be taken to the page listing all of the categories on your site.

====================
2. Updating
====================

--------------------
2.1 Update from 1.0
--------------------

Version 1.1 uses vqmod and acts as a default mobile theme. This leads to the following changes that need to be done so that you can update successfully:

0. Backup your catalog folder
If you haven't done so, back your whole OC installation. Better safe than sorry.

To update:
1. Copy, from the original Opencart 1.5.1.3 installation files, the "controller" folder (found in /catalog/)
2. Paste it in the "catalog" folder of your working opencart installation
This will overwrite all the files modified for v1. It is safe if you haven't done any other core modifications.

3. Delete the lines from 132 to 148 (included) from index.php.
4. Delete line 75 (where it loads mdetect.php) from system/startup.php
5. Go to /catalog/view/theme/[your_theme]/
5.1. Delete mobile.css and common.css from the stylesheet folder
5.2. Go to template folder
5.3. Delete all files ending with _mobile.tpl in all subfolders

6. Install vqmod http://code.google.com/p/vqmod/wiki/Install_OpenCart
7. Copy the *contents* of the upload folder (from the omf_1.3.zip)
8. Paste it in the root of your opencart installation (where the index.php is)

--------------------
2.2 Update from 1.x
--------------------

Just follow the installation instructions and the files from 1.3 will be copied over the files from version 1.x.

If you have modified the default stylesheets from omf/stylesheet - which I don't advice you to, you have to back it up and later merge your changes.

====================
3. Customizing OMF
====================

Be sure to read this first:
http://www.opencart.com/index.php?route=documentation/documentation&path=77_43_44

The principles outlined for the "default" theme there are the same for the "omf" theme too.

--------------------
Mark-up
--------------------
With its current structure, you can override any part of the default mobile theme just by copying only the file you would like to change to your theme folder. The rest will be loaded from the omf template.


--------------------
Styling
--------------------
If you want to override the default styles you have to copy the common.css or mobile.css file and use it as a base for you future work.

You can use #switch_mobile to style the mobile link in your desktop theme.


====================
4. Changelog
====================
[Version 1.3]
• Added user registration and login
• users can change their password and details
• Contact Us page added
• Minor fixes on the checkout forms
• "One Page Checkout" extension support
• Now works on OpenCart 1.5.1.2


[Version 1.2.1]
• vqmod patching is now installed module-friendly (patching only the needed folders and only the _mobile.php files in module folder)
• fixed errors on multiple store languages. Only default language shows up.
• Reduced the excessive log notices during adding product to cart

[Version 1.2.0.1]
• Added the needed search controller I missed to ship in 1.2

[Version 1.2]
• Checkout works with all payment and shipping gateways
• Search is working
• Vouchers and coupons fully functional
• Products with options don't go into cart without having options set
• Error messages on adding products with options
• Links fixed
• Numerous visual fixes
• Updated mdetect.php to the latest version (Aug 22, 2011)

[Version 1.1.1]
• Checkout bugfixes

[Version 1.1]
• move to vqmod
• omf now acts as a default mobile theme
• easily extend OMF by copying needed files in your active theme
• switch mobile and desktop view if needed on mobile and desktop

[Version 1.0]
• Initial release
• Browsing of products works
• Guest checkout without payment GWs

Log in to comment or register here.