The Accelerated Mobile Pages (AMP) is a way by which developers can create mobile-optimized content once and have it load instantly everywhere. In today’s era smartphones and tablets have revolutionized the way we access information over the internet. Webstore owners are trying every bit to reach to maximum users but every time a webpage takes too long to load, they lose a user and with it the opportunity to generate more revenue.
Accelerated Mobile Pages aims to dramatically improve the performance of the mobile web by decreasing the webpage loading time and hence keeping the user intact to the webstore. Using AMP, the web pages load instantaneously across multiple platforms and devices so that content can appear everywhere in an instant, no matter what type of phone, tablet or mobile device user is using.
AMP relies on AMP HTML, a new open framework built entirely out of existing web technologies, which allows websites to build light-weight webpages.
Using AMP for web pages will not only load that webpage faster but it will also give a higher ranking to that webpage in the Google result list. All the pages that are accelerated mobile pages will have a small thunder icon on the google list, as shown in the screenshot below. Another great benefit of using AMP for your webstore is that, even when the data connection of user is slow, the AMP web pages will load faster irrespective of the connection speed.
Features – OpenCart Accelerated Mobile Pages
- Admin can customize color themes for AMP pages.
- Sharing of products on various social media platforms.
- Home Page Image Slider.
- Display the footer links on the AMP page.
- Display the Related products on the AMP page.
- Set the Side Bar color.
- Enable/Disable the various Background color.
- Enable/Disable the Background expanded color.
- Faster loading page for mobile users.
- Improved search engine ranking.
- Increase visibility.
- Better user experience.
- Less bounce rate.
- An increase in sales conversions.
- The admin can set a cronjob for fetching CDN URL for their website.
- Admin can configure this module for different stores.
Note- The Module support Simple Products and Products with Options Only.
Installation – OpenCart Accelerated Mobile Pages
Installation of the Opencart Accelerated Mobile Pages module is very simple. After you unzip the downloaded zip file. You need to select the folder according to your opencart version. And then in your selected folder, you will find admin, catalog, image and ocmod folders. You just need to move admin, catalog and image folders into the root directory of your opencart website.
Now, navigate to Extensions>Extension Installer. Click the Upload button and browse the XML file, this file is in the ocmod folder. Please select the correct ocmod folder according to Opencart version installed on your system.
After uploading the file navigate to Extensions>Modification and click on Refresh button.
After that, in Admin panel go to System->Users->User Groups and edit ‘Administrator’ and choose to select all for both Access and Modify Permission and save it.
After that under Extension > Module install the module as shown below in the snapshot.
Admin Configuration – OpenCart Accelerated Mobile Pages
Admin can edit module and then below page will open. Here Admin can set the Opencart Accelerated Mobile Pages configuration as per their need. Admin can enable/disable the Opencart Accelerated Mobile Pages module. Admin can enable/disable sub-menus for categories and category images. Admin can also enable the footer link for the amp pages, display the related products, set up the Image sliders for the home page of the store and can provide the title and URL link which will be used to redirect the customer to that link. Admin can set up as many sliders as he wants and he can enable or disable any slider and can even delete it. Admin can set-up the Facebook App ID and can allow sharing the products on various social media platforms.
Select Store: The admin can configure this module for each Opencart store that the admin has created. The admin just needs to select the store from the dropdown list.
Get Cron Log: The admin can enable or disable this feature. If it is enabled then the cron log will be generated and it will fetch CDN(content delivery network) URL from the website. This cron log will be sent to the server user email address.
Google API Key: The admin needs to enter google API key for fetching URL for the website. The admin can find API key from their google developer account. Please note it will work only if “get cron log” is enabled.
Under the General configuration, the admin will be able to –
- Enable/Disable the Module from here.
- Enable/Disable to show only the parent categories which are marked as top in the categories section.
- Enable/Disable to show the special price of the product.
- Enable/Disable the Sub-Categories in the category tab of the amp pages.
- Enable/Disable the footer Links on the amp pages.
- Enable/Disable to show the Related products.
- Admin can Add/Remove images to the Homepage slider.
- Admin can mention Facebook App ID.
- The admin will select/allow the social sharing platforms using which the customers can share the products.
Admin can also customise the AMP page as per their store theme and choose various colors for different features.
The admin can set the color for –
- Page Background Color
- Header Color
- Anchor Text Color
- Anchor Text Hover Color
- Footer Color
- Footer Text Color
- Button Background Color
- Button Text Color
- Button Border Color
Also, Structured Data is implemented so you can test it by visiting https://search.google.com/structured-data/testing-tool and then you can enter the AMP page URL and can test it. You can preview that how it’s going to display on Google search results.
How to Get Google API
The admin needs to have Google API for sending the URL to the Google. The admin will go to the link: https://console.developers.google.com/flows/enableapi. The admin needs to click on “Select A Project” as per the screenshot.
After clicking on this link, the admin needs to click on the “+” button to create a new project or the admin can select a project from the project list.
After this, the admin needs to enter project name here and click create button.
After that, the admin will redirect to the dashboard page. Here the admin can create credentials by clicking on “create credentials” button.
After clicking on it, the admin can see “API key” link. The admin needs to click on API key to create the API key.
After clicking on API key, a popup will appear with API key. Just copy this key and paste it to the Google API key section of configuration.
Accelerated Mobile Pages for OpenCart
An Opencart e-commerce store allows its customers to surf through the home page of the store, navigate through the various categories present in the store, go to any product page either from home page, or by navigating through categories or simply by searching in the Webstore, and various other features. But the most important thing or feature for any Webstore is that whether it is user-friendly & mobile-friendly or not. If a Webstore takes more time to load up then it’s sure that the users will abandon the page.
So implementing AMP for the most visited pages will attract more users to your Webstore and provides the store owner with the opportunity to earn revenue.
OpenCart has implemented AMP on Home Page, Category Page and on Product Page.
The home page is like the welcome page for your users. So implementing AMP on the home page is a brilliant idea to engage the users on your Webstore. If the home page loads up instantly then users will be able to surf through the page without any delay. The customers will be able to see the Image Sliders that the admin has set and if they click on it, they will be redirected to another page.
After the home page, users generally go to the categories present in the store and implementing AMP in category page allows the users to quickly navigate through the categories. This module will support categories up to two levels only.
After the home page, users generally go to the categories present in the store and implementing AMP in category page allows the users to quickly navigate through the categories.
Here, one must remember if the Display Parent Category is set to disable and the category is not set on Top then list of category will have no highlighted category they will all appear the same way.
The most important thing for every e-commerce store are the products that are present in it. If everything is fast and working great in the Webstore but the product page is slow in loading up the product image, its description, and all other information, and is clunky then it’s frustrating to the user and the user might leave the page or not go for the purchase. So implementing AMP on a product page is super useful, as a user can go to a product page from anywhere, from the home page, category page, or even from the google or any other search engine’s results page. A faster loading and mobile optimized webpages for the products of the Webstore will attract and engage more users and henceforth it will generate more purchases from the users.
Opencart Accelerated Mobile Pages module also provides an option for sharing the product across different social media platforms. The customer just have to click on the social media icon on which he/she wants to share the product and then the customer will be redirected to that social media platform with the product shareable link and from there he/she can easily share the link.
The customer can search products from search bar with the auto search suggestion feature. Search bar will appear on product page, category page, and home page.
Every store owner needs to specify few of the mandatory policy and share the information about the respective store. This can be done by entering details on CMS pages. The admin can enter this information in CMS pages for the customer to read through. Post implementation of the module in your website these pages will appear as AMP pages. The pages here may vary from-
- About Us
- Delivery Information
- Terms and Conditions
- Return Policy
- Contact Us
**Note: It totally depends upon the Google crawlers for getting your website AMP pages to be displayed on the SERP page. Usually, it takes to around 12 to 24 hrs or more for the crawlers to crawl/index your pages.
That’s all for the Opencart AMP module if you have any issue feel free to add a ticket and let us know your views to make the module better http://webkul.uvdesk.com/.
Current Product Version - 188.8.131.52
Supported Framework Version - OpenCart 2.0.x.x, 2.1.x.x, 2.2.x.x, 2.3.x.x, 3.x.x.x