SmartAddons Emarket - Joomla Template
SJ Emarket is a versatile Joomla template designed specifically for creating an online store. It offers a comprehensive array of features and functionalities, making it suitable for various types of e-commerce websites. The templates flexibility allows it to cater to different industries and niches, providing users with the tools they need to establish a successful online presence.
Template Description
With its responsive design, SJ Emarket ensures that your website will look great on any device, including desktops, tablets, and smartphones. This is particularly important in todays digital landscape, where mobile usage is on the rise. By optimizing your site for mobile devices, you can reach a wider audience and provide an excellent user experience.
One of the standout features of this template is its integration with VirtueMart, a popular Joomla e-commerce extension. VirtueMart allows you to easily manage your products, inventory, and orders, providing a seamless shopping experience for your customers. Moreover, this Joomla template also offers support for other essential e-commerce extensions, giving you the flexibility to customize your online store to meet your specific needs.
In terms of design, SmartAddons Emarket offers a clean and modern layout that is visually appealing and easy to navigate. It provides a range of pre-designed pages and customization options, allowing you to showcase your products in the best possible way. Additionally, this template offers multiple homepage variations, giving you the flexibility to create a unique and engaging online store.
Furthermore, this template is built on the latest Joomla framework, ensuring optimal performance and security. It also includes a variety of useful features such as social media integration, SEO optimization, and a powerful admin panel that allows you to easily manage and customize your website.
In conclusion, SJ Emarket is an excellent choice for anyone looking to create a professional and feature-rich online store using Joomla. Its responsive design, integration with VirtueMart, and customizable options make it a powerful tool for building a successful e-commerce website. Whether youre a small business owner or a seasoned entrepreneur, this template provides everything you need to establish a robust and visually appealing online presence.
Template Features:
- Compliance with W3C XHTML 1.0 Transitional and W3C CSS Valid standards.
- Support for JavaScript and CSS scripts compression to speed up the website performance.
- Thanks to the use of the latest versions of PHP and MySQL, the template code is current and secure.
- A large number of positions for placing modules and several color suffixes.
- Several built-in color schemes of the template for individual design of your project.
- The template supports Google fonts and RTL/LTR languages.
- Multiple menu types, Mega Menu, Dropline Menu, CSS Menu, with smooth animation effects.
- Integrated support for popular extensions, expanding the functional capabilities of the site.
- QuickStart demo package with support for CMS version Joomla! 4.x.
Specifications:
| Release date: | 02-01-2024 | |
| Last updated: | 17-04-2024 | |
| Type: | Premium | |
| License: | GPL | |
| Subject: | Online Shopping Universal VirtueMart | |
| Compatibility: | J3.x J4.x | |
| QuickStart: | Joomla! 4.x | |
| Color schemes: |
||
| Developer: | SmartAddons | |
| Rating: | ||
Share with your friends!
General Features:
Powerful Framework
The framework provides an easy access to hundreds of powerful features and tools for more flexible customization and create amazing websites based on Joomla.
Responsive Design
Fully flexible layout template perfectly adapts to the users browser width. And great is displayed on your PC, iPad, iPhone and other mobile devices.
HTML5 & CSS3
Template has a wide range of benefits, since only uses modern web technologies: HTML5, CSS3, LESS, JQuery and Bootstrap 4 & 5.
Quick Start
Install Joomla! website containing demo content, styles and preconfigured extensions and get started in minutes.
Cross-Browser
Impeccable work in all modern browsers, such as Firefox, Chrome, Safari, Opera, Netscape, Yandex Browser and Internet Explorer 10+.
SEO optimization
Code template database is fully optimized to ensure good indexing and the presence of your site by Joomla Search Engine.
How to Set Up SmartAddons Emarket for a Joomla Store
SmartAddons Emarket is best treated not as a simple visual refresh, but as a ready-made storefront for a Joomla-based online store, where the template, VirtueMart, Helix Ultimate, SP Page Builder, and a set of modules are meant to work together. This guide walks through how to approach the installation with minimal risk, which packages to choose, which settings to verify after activation, and how to bring the homepage to a state where visitors can clearly see categories, promo sections, products, the cart, and intuitive navigation.
This article is written for site owners, Joomla administrators, and developers who need more than a basic "install the template" walkthrough. The goal is to understand how it actually works: where the template style is assigned, which modules control the header and homepage, how SP Page Builder pages are imported, why VirtueMart needs to be configured before you evaluate the storefront, and which symptoms point to incorrect positions, menu assignments, or caching issues.
This guide does not cover purchasing, licensing, or bypassing archive access restrictions. It assumes you already have a legitimate template package and access to its documentation. If the archive came from an unclear source, verify the package origin and scan the files first, because a store template reaches into critical parts of the site: the cart, product pages, orders, modules, page layouts, and user data.
The main outcome of this guide is a controlled test storefront: the template is enabled, the demo structure makes sense, the homepage is assembled from the right modules, VirtueMart products appear in the correct sections, the mobile menu does not break the buying journey, and common issues can be diagnosed without randomly reinstalling the entire site.
What This Template Actually Does in the Joomla Ecosystem
SmartAddons Emarket is designed for a Joomla store with a visually strong homepage. According to the developer's official product page, the template relies on VirtueMart, Helix Ultimate, SP Page Builder, Bootstrap, modular product blocks, a mega menu, lazy image loading, RTL support, and settings for colors, fonts, menus, and layout. You can see that immediately in the demo: a utility bar with currency and language at the top, then the logo, category search, account, help, mini cart, horizontal menu, vertical category list, a large promo slider, product carousels, Flash Sale blocks, Hot Promotions, Limited Stock Deals, Shop by Collections, and a lower section with newsletter signup and contact information.
That is a key difference from a generic template "for any page." Emarket is closer to a fully assembled demo store, where the template sets the pace of the storefront while the actual data comes from different parts of Joomla. The main menu lives in the Joomla menu system, products and categories come from VirtueMart, parts of the homepage are imported through SP Page Builder, and many storefront sections are output through separate site modules. That means setup cannot stop at Site Template Styles. You can enable the style and still end up with an empty homepage if the modules are unpublished, sp-hompage.json was not imported, no menu item was assigned, or your VirtueMart categories are empty.
The official Emarket documentation describes two installation paths. The first is Quickstart, where the template is deployed together with demo data so the site immediately resembles the demo. The second is installing the template and extensions into an existing Joomla site, where you install the template archive separately, import options.json, install the modules, enable the plugins with the keys sj, ytshortcode, and System - Helix Ultimate Framework, and then assemble the pages and menus. In practice, the second path is the one that usually raises more questions: it is safer for an existing site, but it requires a clear understanding of the dependencies.
For the end user, the template solves four practical problems. First, it gives you a dense storefront quickly without building everything from scratch. Second, it connects promo sections to VirtueMart product categories. Third, it gives the store familiar marketplace-style navigation: categories on the left, search, cart, discount blocks, collections, and brands. Fourth, it keeps appearance settings in the admin panel instead of forcing direct edits to the template files.
The most common first-time mistake is assuming Emarket creates the store for you. It does not. The template styles and connects the storefront, but products, categories, pricing, images, shipping, payments, the VirtueMart safe path, and Joomla system settings are still your responsibility. If that data is missing, some sections will stay empty or show only demo content.
Who Emarket Is a Good Fit For, and When Another Approach Makes More Sense
This template works best when the store needs to feel like a large product marketplace: electronics, accessories, household goods, apparel, health and beauty, sports, automotive products, groceries, gifts, and home goods. The demo shows many categories and different kinds of product sections for a reason. That kind of layout works well when visitors need to browse a broad catalog quickly, spot promotions, jump into categories, compare sections, and return to the cart without scrolling through a long landing page.
Emarket is a strong match for a new project where the owner is ready to start from Quickstart, replace the demo products, and gradually adapt the storefront to a specific niche. That path is especially convenient if there is no legacy menu structure, no old overrides, no heavy stack of extensions, and no unusual cart setup. You get an almost complete homepage framework, then replace the logo, contact details, categories, banners, product sources, menu, footer, and contact page.
You can also use the template on an existing store, but the process needs to be more cautious. Start by checking which Joomla version the site is running, which extensions are tied to the current template, whether VirtueMart overrides are in place, how the menu items are structured, where product images are stored, and whether third-party CSS/JS optimizers are already in use. If you simply swap the template on a live store, you may not break the data, but you can easily break the presentation: the cart still exists, but the mini-cart module is unpublished; the categories exist, but the product carousel points to a different category; the page exists, but the menu item is not assigned as the homepage.
The template may not be the right fit if you want a minimalist catalog with 10 products, a marketing site without a full cart, a store with a deeply customized checkout flow, or a project on the newest Joomla branch where up-to-date compatibility matters more than a ready-made demo storefront. The official Emarket product page lists compatibility with Joomla 4.x and a specific dependency stack. That does not mean the template cannot be adapted further, but anything beyond the confirmed setup should be tested separately on a copy of the site.
Another key factor is whether you are comfortable with Joomla's module-driven architecture. If you are used to builders where the entire homepage lives inside one editor, Emarket may feel fragmented. Here, part of the visible page is managed in Components -> SP Page Builder, part in System -> Manage -> Site Modules, part in System -> Templates -> Site Template Styles, and part in VirtueMart. That is not a weakness; it is one of Joomla's typical strengths: different elements can be enabled, assigned to pages, and reused independently. But the administrator needs to understand where each layer lives.
What to Check Before Installation, and Why Quickstart Is Not Always the Best Choice
Before installing anything, do not start with the Upload & Install button. First define the scenario: a new site or an existing store. Quickstart is meant for a clean installation where you are willing to deploy the full demo structure. In the SmartAddons documentation, it is presented as the path that gives you a site close to the demo, complete with sample data and configured extensions. That makes it useful for a quick launch, learning, and feature evaluation.
On a production site, Quickstart usually is not what you want. It deploys not just the template, but a full demo package, so it can conflict with existing content, menus, components, and settings. For an existing Joomla site, use the template and extensions package instead: template first, then modules and plugins, then import the settings and pages. This path takes longer, but it avoids replacing the whole site with a demo state.
Minimum Technical Checklist
The official Emarket details point to a setup built around Joomla 4.x, VirtueMart, Helix Ultimate, SP Page Builder, and Bootstrap. Before installation, check the following:
- Your Joomla version matches the range declared by the template developer.
- The server has the PHP extensions required by Joomla and VirtueMart, and the upload limits are high enough to install the archives without interruption.
- You have admin access with Super User privileges, because you will need to install extensions, enable plugins, and assign the default template.
- You have a backup of both files and database, especially if the site already contains products and orders.
- VirtueMart is installed or ready to be installed, and its core store settings are not left blank.
- SP Page Builder is installed in a compatible branch, and importing pages will not overwrite an existing live page you still need.
- Aggressive CSS/JS optimizers and file combiners are disabled during the first round of troubleshooting, so you do not mistake a cache issue for a template problem.
If the site is already running, make a copy on a subdomain or in a local environment. Joomla's extension installation documentation specifically notes that some packages may need to be unpacked locally when they include multiple extensions, while the individual installable files still need to remain ZIP archives. That matters for Emarket because the package includes the template itself, quickstart, extensions, and import files.
Checking Your VirtueMart Data
Emarket's homepage actively displays products. Before you judge the appearance, make sure VirtueMart already has published categories, products with images, prices, a currency, and basic store settings. VirtueMart documentation emphasizes that categories can be hierarchical and a product can belong to multiple categories. For the Emarket storefront, that is not just theory: a product block such as SJ Extra Slider for VirtueMart or SJ Deals for VirtueMart reads from a selected source. If the source is empty, the template looks broken even though the real problem is the data.
Check the VirtueMart safe path separately. If the system warns that Safe Path is empty, do not ignore it. That path is used for protected files, invoices, and downloadable materials, and VirtueMart documentation recommends placing it outside the public site directory whenever the hosting environment allows it. Even if your store currently sells only physical goods, it is better to resolve that warning before the public launch.
Practical rule: first make sure VirtueMart can correctly display a category page and a product page on a basic template or a test page. Then enable Emarket and start shaping the storefront. That makes it much easier to see whether a problem comes from the store itself or from the visual layer around it.
Installation: Quickstart, Template, and Extensions Without the Chaos
How you install Emarket depends on the outcome you want. If the site is new and a demo-based setup is acceptable, Quickstart saves time: it deploys the template, modules, plugins, demo pages, and sample products so the result resembles the official demo. If the site already exists, use the Template Package and Extension Packages, and bring over the demo structure selectively.
Path for a New Site
For a new site, it is easier to deploy Quickstart into a clean directory and an empty database. After installation, do not leave the demo untouched. Immediately create your own Super User account, verify the site URLs, enable the required language, replace the demo products, and configure the store, payments, shipping, email, and legal pages. Quickstart is valuable because it shows how the authors connected positions, modules, and pages. But you should never launch a public store with demo products, test contact details, and someone else's banners still in place.
After deploying Quickstart, save yourself a map of the demo settings. Open the homepage in one tab and the admin panel in another. For each major block, find the module or page that outputs it: the vertical category menu, the promo slider, Top Selling Products, Flash SALE, Hot Promotions, Limited Stock Deals, Shop by collections, the footer, newsletter, and contact details. That walkthrough is far more useful than blindly editing the first module you happen to open.
Path for an Existing Site
For an existing Joomla site, the sequence should be stricter:
- Create a copy of the site and database, then work only on that copy.
- Install the template package through
System->Install->Extensionsby selecting the template ZIP archive. - Open
System->Templates->Site Template Stylesand assign thesj-emarketstyle to a test menu item, or temporarily make it the default style on the site copy. - Import
options.jsonintoTemplate Optionsif it is included in the package and matches your version of the template. - Unpack the extensions package and install the required modules one by one instead of uploading the master archive to the installer when it contains multiple separate ZIP files.
- Enable the modules and plugins that the Emarket documentation tells you to find using the keys
sj,ytshortcode, andSystem - Helix Ultimate Framework. - Verify that VirtueMart and SP Page Builder are installed and available under
Components. - Import
sp-hompage.json,sp-contactpage.json, andsp-aboutpage.jsoninto new pages only, so you do not overwrite existing content. - Create or update the menu items and assign the correct homepage type:
SP Page Builder->Page: Home.
After every major step, open the front end in an incognito window or another browser. If you wait until the very end, you may end up with ten different possible causes at once. If you verify things step by step, it becomes much easier to see what broke after enabling a specific module or importing a particular page.
What to Do About Cache During Installation
During the first round of setup, keep caching and file combination as simple as possible. Helix Ultimate and many Joomla templates can optimize CSS/JS, and Emarket advertises optimization and merge features on its product page. But during initial setup, those can get in the way of troubleshooting: you change a color or a module, and the browser still shows the old file. First make sure the output is correct without aggressive caching, then enable optimization and compare the before-and-after behavior.
Template Options: Logo, Menu, Contact Details, Colors, and Mobile Navigation
Once installed, the template should not stay branded with the demo identity. In Emarket, core header and footer elements are configured partly through System -> Templates -> Site Template Styles -> sj-emarket -> Template Options. The documentation points to separate areas: Basic for the logo, contact details, social links, and footer; Menu for choosing the main menu; and Helix Ultimate settings for the logo, menu, mega menu, off-canvas panel, custom code, and other parameters.
Start with the logo. In the Basic section, upload the main logo and, if needed, a mobile version. For a store, the logo should not inflate the header height or break the search row. If the image is wide, define its height and check it in three states: desktop, tablet, and mobile. Do not try to fix a logo with CSS hacks when the real solution is the correct source file size.
Next, configure the contact strip and utility elements. In the demo, the upper right area includes language and currency, while the header contains account, help, and cart, with a hotline below. These elements help the store feel functional, but on a real site they should lead somewhere meaningful. If you do not have a help section, do not leave a placeholder Help link in place. It is better to temporarily hide that module or replace it with a shipping and returns page.
Main Menu and Mega Menu
In Emarket, the main menu is selected in Template Options -> Menu. Helix Ultimate lets you manage the menu structure, enable mega menus, add rows and columns, insert modules into dropdown areas, and control width and animation. That is especially useful for stores with many categories. But a mega menu should not turn into a warehouse of links. Group the top level into clear sections: Joomla for system pages, Shop for the store, Blog for articles, and About Us and Contact Us for trust-building pages.
If you are migrating the demo menu into a real store, remove system demo items that are not useful to shoppers. Items such as Login form, Registration Form, and Category Layout are helpful for testing, but they do not always belong in public navigation. It is usually better to place account and registration links in the account area and keep the top menu focused on product and informational paths.
Off-Canvas Menu on Mobile
The mobile menu in Helix Ultimate is configured separately. Make sure it opens and closes properly, does not cover the cart, and does not hide important categories. If the desktop mega menu is complex, do not copy it wholesale into the mobile version. On a small screen, it is better to show 6-8 main categories, search, and a clear path to the cart than to dump the entire demo navigation into one long list. After saving the settings, open the front end at roughly mobile width and follow this path: category -> product -> add to cart -> cart. If that path is harder than it is on desktop, the menu needs to be simplified.
Colors and Fonts
The official Emarket product page advertises unlimited colors and support for multiple fonts. Use that carefully. In its original reference design, the template depends on a light storefront, orange accents, green and red discount states, and clean product cards. If you replace everything with one loud color, the store becomes harder to scan. Stick to one primary accent for buttons and active elements, one color for promo status markers, and a neutral base for the product cards.
How to verify the outcome: after changing the color scheme, open the homepage, a category page, a product page, the cart, and the mobile menu. Do not judge a single block in isolation. Look at usability instead: are prices visible, are discounts readable, do the Add to Cart buttons stand out, are active menu items clear, and are footer links still legible? If button text is only readable on a large screen, the color setup has not passed the test.
The Homepage as a Set of Positions: Categories, Sliders, Deals, and Collections
The strongest part of SmartAddons Emarket is its dense homepage. It is also the most demanding part to configure. In the Emarket documentation, the homepage positions listed after the header and footer include Position-1 for SJ Mega Menu, Slider for a custom slider built with yt_content_slider, Position-2 for SJ Categories for VirtueMart, Position-3 and Position-7 for SJ Extra Slider for VirtueMart, Position-4 and Position-5 for SJ Deals for VirtueMart, Position-6 for categories, Position-8 for brands, Position-9 for testimonials, and Position-10 for news.
That does not mean you have to keep every block. But it is still best to preserve the setup order. Start with the header and navigation, then the top storefront area, then product selections, and finally the footer. If you begin with the bottom testimonial or brand sections and then go back to change the categories, you will keep looping back to the data sources.
Vertical Categories and the Data Source
In the demo, the left side shows a category list: Men Fashion, Women Fashion, Health & Beauty, Home & Office, Phones & Tablets, and so on. On a live site, that block should lead to your own VirtueMart categories or a menu you intentionally chose, not to the demo structure. If you are using SJ Categories for VirtueMart, open the module and check Source Options, Category Options, and Image Options. The goal is to show the top level of the catalog in a way that genuinely helps shoppers, rather than mirroring your internal warehouse structure.
A practical approach is to create 6-10 public top-level categories, assign images to them, make sure the products are published and linked to those categories, and then test the module. If one category is empty, do not hide the problem behind a nice banner. An empty category in the main navigation hurts trust more than simply omitting an unnecessary item.
Promo Slider and Banners
In the documentation, the Emarket slider is built as a Custom module using the yt_content_slider shortcode and images such as images/banners/slide_1.jpg. That is a fast way to reproduce the demo, but for a live store it is better not to leave the shortcode as an unexplained chunk of text. Document which slides exist, where the images are stored, where the links go, and what text is visible on the banner. Every slide should have a purpose: a new collection, a category, a sale, a seasonal selection, or a product line. A slide with no click target and no clear offer wastes the most valuable area of the page.
When replacing banners, keep the proportions consistent. In the original demo, the top area is built around a wide central banner and two vertical promo images on the right. If you upload images with a different aspect ratio, the module may crop an important product or stretch the layout. Prepare images with the same visual weight first, then test the layout on desktop and tablet. For mobile, make sure the text on the banner does not become microscopic.
Product Carousels and Deal Blocks
SJ Extra Slider for VirtueMart and SJ Deals for VirtueMart pull products from VirtueMart and display them in a storefront format. The official template page specifically highlights Flash Sale with a timer, sale label, pricing, and product blocks. In the demo, that helps create the feel of an active store. To keep those blocks from becoming pure decoration, configure the product source, item limit, sorting, price display, images, discounts, and buttons.
You should not populate Top Selling Products with random items if the store does not yet have sales data. In that case, it is better to use a manually curated category such as "popular," "new arrivals," or "recommended." For Flash Sale, create a dedicated category or product set tied to a genuine limited-time promotion. If the timer shows a long-expired date or an endless sale, users stop trusting it very quickly.
Brands, Testimonials, and News
Lower-page blocks such as brands, testimonials, and news should not simply duplicate the demo. In the Emarket documentation, brands use yt_content_slider, testimonials use yt_testimonial, and news uses SJ Extra Slider for Content. If the store does not have real customer testimonials, do not publish fictional ones. It is better to temporarily replace that block with service advantages such as shipping, returns, consultation, or warranty information. News only makes sense if you actually maintain a blog or a product update section.
Quick takeaway: Emarket gives you a strong storefront grid, but every block needs a real data source, a real purpose, and a verifiable outcome. Otherwise the homepage looks busy without actually helping anyone buy.
How Emarket Connects to VirtueMart: Products, Categories, Mini Cart, and Safe Path
Emarket uses VirtueMart not only as a catalog, but also as the data source for many modules. That means the quality of the storefront depends on the quality of the store data. Start with categories. VirtueMart documentation explains that categories should group similar products, and products can belong to more than one category. That works well in Emarket: you can show the same product in its main category and also place it in a promo category if it is part of a sale. But do not remove it from its main category, or shoppers may lose track of it when browsing the catalog normally.
Product Images and Storefront Performance
The template advertises lazy image loading and optimization, but that does not replace proper media preparation. VirtueMart documentation describes the media library as a system where a file can have a name, title, alt text, CSS class, and role. That matters in a store: good images help product carousels look consistent, and alt text improves accessibility and search understanding. If one carousel mixes white-background product shots, dark cover images, and tiny low-impact pictures, the visual rhythm Emarket depends on starts to fall apart.
Prepare consistent image proportions for your product blocks. If a product is meant to appear in a catalog grid, do not use random tall photos with no padding. You can create a separate cover image for the category view and use multiple detailed images for the product page. After uploading them, do not check only the product page itself. Open every homepage block where that product appears.
The Mini Cart and the Path to Checkout
The Emarket header uses a mini cart. SmartAddons documentation for SJ Minicart Pro for Virtuemart describes settings such as displaying the product list, list height, the coupon form, the Go To Cart and Checkout buttons, total price display, image parameters, and link opening behavior. In a real store, the mini cart should stay compact and predictable. A customer adds a product and should immediately see the quantity, subtotal, and next step. If the dropdown becomes too tall or overlaps the menu, adjust the maximum height and the field display.
Be sure to test the mini cart with several products. One product often looks fine, but five products reveal the real issues: overflow, tiny text, cropped attributes, or a broken checkout button. Test a product with variants, a discounted product, a product without a discount, and a product with a long name. If a long name breaks the header, limit its display length in the module settings or prepare a shorter storefront-facing product name.
Safe Path and Store Files
If VirtueMart reports an empty Safe Path, configure it before launch. VirtueMart documentation recommends creating a folder outside the public web root, or, if the hosting environment does not allow that, using an acceptable secure location inside the admin area. Do not use a relative path. Enter the full server path and verify that the warning disappears. For a store that uses invoices, downloadable files, or protected documents, this is not a cosmetic setting; it is part of a proper configuration.
After configuring VirtueMart, run this test: open a category, open a product, add the product to the cart, go to the cart, change the quantity, return to the homepage, and verify that the mini cart updated. If Emarket still shows an outdated quantity at any step, temporarily disable caching and optimization, then repeat the test. Do not start editing template files directly until you have ruled out caching, module settings, and a JavaScript conflict.
Practical Example: Building an Electronics Store Homepage
Imagine you need to launch an electronics store: smartphones, laptops, accessories, gaming devices, smart home products, and office gear. That is close to the Emarket demo, but we are not going to copy the demo wholesale. The goal is to create a homepage where visitors immediately see categories, a promo offer, product selections, and a clear path to the cart.
Goal and Preparation
Goal: create a SmartAddons Emarket homepage where the top area leads into the main categories, the central banner promotes the primary offer, the Top Selling Products block shows selected items, Flash SALE displays discounted products, and the mini cart updates correctly after an item is added.
Preparation:
- The
sj-emarketstyle is installed and enabled in Joomla. - VirtueMart, SP Page Builder, Helix Ultimate, and the SmartAddons modules required for the demo structure are installed.
- VirtueMart categories have been created: "Smartphones," "Laptops," "Accessories," "Gaming," "Smart Home," and "Office."
- Each category contains at least several published products with images and pricing.
- A separate category or tag has been created for sale items if the deals block is supposed to show a limited promo selection.
- Aggressive CSS/JS merging is disabled on the test site so you can see real changes.
Setup Steps
- Open
Components->SP Page Builder, create a page namedHome, and import thesp-hompage.jsonfile into that new page. Save the page after the import. - Go to
Menus->Main menu, create aHomemenu item, choose the typeSP Page Builder->Page: Home, and assign it as the homepage. - Open
System->Templates->Site Template Styles->sj-emarket. InTemplate Options, importoptions.json, then set the logo, main menu, and contact information. - In
System->Manage->Site Modules, find the category module assigned toPosition-2. Point it to VirtueMart and select the store's top-level categories. - Open the top slider module in the
Sliderposition. Replace the images and links with your own promo pages. If it uses theyt_content_slidershortcode, only change the image paths and URLs without breaking the shortcode structure. - Configure
SJ Extra Slider for VirtueMartfor the featured products block. InSource Options, choose the correct category or source. InItem Options, set the number of products. InImage Options, verify the image dimensions. - Configure
SJ Deals for VirtueMartfor Flash Sale. The source should include only products that genuinely belong in a promotional block. Make sure an old demo date or placeholder is not creating a misleading timer. - Check
SJ Minicart Pro for Virtuemartin the header. Enable subtotal display, cart navigation buttons, and a reasonable height for the product list. - Clear Joomla cache and browser cache, then open the homepage as a regular visitor.
Verifying the Outcome
The expected state is this: the homepage loads without empty modules, the categories on the left lead to real sections, the promo slider no longer contains demo links, the product cards display images and prices, Flash Sale does not look outdated, and the mini cart responds when a product is added. The critical check is to add a product from a homepage block and confirm that the cart path works without a routing error.
Check the mobile width as well. Emarket uses many horizontal blocks, so the mobile layout should not just shrink. It should keep a clear order: menu, search, main categories, promo area, products, cart. If the product carousels feel too long, limit the number of products or adjust how many items appear at different breakpoints.
A Common Pitfall
If you imported the SP Page Builder page but did not assign it to a menu item, it may look as if the import failed. Joomla renders the page through the menu item, and template styles and module assignments are often tied specifically to that menu item. So after every import, create or update the menu item and then verify the module assignments. Without that, a module can be published and still fail to appear on the page where you expect it.
Responsive Behavior, RTL, and a Multilingual Store
The official Emarket product page lists a responsive layout, RTL layout, and a multilanguage tag. The demo also shows language and currency switching in the top bar. That is useful on a real store, but only if Joomla, VirtueMart, and the modules are configured correctly. You cannot turn on a language switcher and call the store multilingual if the products, categories, menus, pages, and emails remain in a single language.
Multilingual Setup in Joomla
The Emarket documentation points to System -> Manage -> Languages and then Content Languages. For a store, that is only the beginning, but it is the right place to start. After installing the language, you need to create the content language, link the menu items, configure the Language Switcher module, prepare translations for categories and products, and verify that VirtueMart handles multilingual data correctly.
If the store currently runs in a single language, do not display a language switcher that does not actually work. It creates the expectation that every page is available in another language. It is better to hide the module until the translations are complete. Once they are ready, test more than just the homepage: check search, categories, products, the cart, the checkout page, emails, and system messages.
Currencies and Pricing
In the demo, the top bar displays a currency selector. On a live store, that currency behavior should not be decorative; it needs to be tied to VirtueMart settings. Check the store's base currency, rounding rules, tax display, discounts, the currency module, and cart behavior. If the currency selector is present but prices inside the cart behave unpredictably, keep the store on a single currency for now and fix the store settings before going public.
RTL and Visual Validation
RTL mode is useful for right-to-left languages. But enabling RTL affects more than text direction; it changes the entire visual balance of the page: menus, arrows, carousels, spacing, icons, discount blocks, sliders, and the mini cart. If you need that language setup, test a separate set of pages. Do not stop at the homepage; open a category, a product page, the cart, and the contact page as well.
Responsive Testing Without Extra Tools
A minimum responsive test should include:
- Desktop: the header does not wrap onto two lines, search remains readable, the cart is visible, and the menu opens correctly.
- Tablet: the vertical categories and slider do not collide, and the product carousels do not crop the cards.
- Mobile: the
Off-canvasmenu opens, search is accessible, the cart button stays visible, and products can still be added to the cart. - Slow network conditions: images load progressively, and lazy-loaded images do not leave the above-the-fold area empty.
- Long product names: the cards do not end up with such uneven heights that the grid loses its order.
The demo includes a lot of products and promo graphics. On a real site, do not try to solve mobile overload just by shrinking the fonts. Sometimes the right fix is to hide a secondary carousel on small screens or reduce the item count, rather than forcing shoppers to scroll through dozens of products before they reach the core content.
Safe Improvements Without Editing the Template Core
Emarket includes settings at the template, module, and Helix Ultimate levels. That makes the admin panel your first customization layer. Direct edits to template.css, template core files, VirtueMart files, or Joomla system files are best avoided. Helix Ultimate specifically recommends using Custom CSS or the custom.css file for small changes instead of modifying the main CSS files, because a template update can overwrite those edits.
When a Small CSS Tweak Makes Sense
For example, after changing the color scheme, the promo buttons may no longer have enough contrast, or the active item in the mobile off-canvas menu may be hard to read. That is a good case for a small CSS adjustment, as long as you verified the classes in developer tools and are not changing store behavior. Place the code in Template Options -> Custom Code -> Custom CSS or in /templates/sj_emarket/css/custom.css if that file exists and is loaded by the template.
.offcanvas-menu .offcanvas-inner ul.menu > li.active > a,
.offcanvas-menu .offcanvas-inner ul.menu > li.current > a {
color: #ff6a00;
font-weight: 700;
}
.sj-emarket-checkout-note {
border-left: 4px solid #ff6a00;
padding: 10px 14px;
background: #fff7ef;
}
This example is not meant to be a universal selector for every build. It demonstrates a safe approach: a small color adjustment and a visual cue, without touching PHP, the cart, or order data. Before pasting it in, verify the real classes used by your template. After adding it, clear the cache, open the mobile menu, check the active item, and make sure the CSS did not affect other menus. Rolling it back is simple: remove the block and clear the cache again.
Language Overrides Instead of File Edits
If you need to change interface text in Joomla, VirtueMart, or a module, look for a language constant first and use Language Overrides. That is safer than editing strings directly inside the extension files. In Emarket, this is useful for the header, cart, buttons, messages, contact form, and module text. If the text is inside a Custom module, edit the module itself. If it is a system string, use an override.
The post-edit check is simple: open the page as a guest, open it again as a logged-in user, add a product to the cart, and see whether the old text still appears in a different state. On a multilingual site, the override has to be created separately for each language, or one language will be fixed while the other still shows the original string.
Template Overrides
For more substantial output changes, Joomla usually relies on template overrides. That is appropriate when you need to change the markup of a component or module without editing the original extension. But with Emarket, do not start with an override. First check the module settings, layout options, alternative layouts, module class suffixes, and the built-in Helix capabilities. An override is justified when the desired outcome cannot be achieved through settings and the change is genuinely important to the store.
Good practice: one override, one task. For example, adjusting a small element in the product card output or adding a clearer label in one specific location. Bad practice is copying the entire VirtueMart layout and changing everything at once without documentation. That makes updates and troubleshooting much harder.
Performance, SEO, and Storefront Maintenance After Initial Setup
Emarket gives you many visual blocks, which means that after the appearance is set up, you should separately review performance and search hygiene. On the demo homepage, you can immediately see multiple product carousels, large banners, categories, promo graphics, brands, testimonials, and news. For visitors, that works well if the page loads quickly and does not shift when images appear. For search engines, it works if the blocks contain meaningful links and the content is not made up of repeated demo headings.
Start with images. The official template page mentions lazy loading, but lazy loading is not an excuse for heavy files. Prepare banners in the correct proportions, avoid uploading oversized source files, fill in alt text for products and categories in VirtueMart, and verify that the key above-the-fold area does not stay empty until scripts finish loading. If the top promo slider contains an important offer, that message should be visible in the image or next to it and should not depend entirely on a late-loading effect.
Then review duplicated product blocks. On the homepage, it is easy to show the same product in Top Selling Products, Flash SALE, Limited Stock Deals, and Featured Products. Sometimes that is justified if the product truly deserves the spotlight. But if half the homepage repeats the same product set, shoppers stop understanding the difference between the sections. Give each block a distinct role instead: new arrivals, limited-time discounts, popular categories, seasonal picks, brands, or fast-shipping products.
SEO Structure for the Homepage and Categories
The template does not do SEO by itself. It simply creates a structure where you can place products, links, and content blocks in a clean way. For the homepage, check the title and meta description in the menu item or in SP Page Builder settings if those are in use. For VirtueMart categories, fill in the names, descriptions, and images. For products, verify readable names, short descriptions, images, pricing, and the correct category. If a product appears in multiple categories, use VirtueMart's features intentionally and keep an eye on canonical behavior if that matters to your catalog.
Do not fill homepage headings with keyword-stuffed phrases just to target search queries. Emarket already has many repeating sections. If every block is labeled "best cheap products to buy," the page becomes worse for both users and search engines. Clear sections are much more useful: "Best Sellers," "Deals of the Week," "New Arrivals," "Popular Categories," "Office Solutions." Long-tail keyword targeting belongs in articles, blog posts, or landing pages. The homepage should help people navigate.
Caching and File Combination
Once the storefront has been verified without optimization, you can begin enabling caching and file combination. Do it one setting at a time. Start with Joomla cache, then module cache, then CSS optimization, then JS optimization if it does not break the cart or sliders. After each change, test the homepage load, menu opening, slider behavior, adding a product, the mini cart refresh, and the path to the checkout page. If you enable everything at once, you will not know which setting caused the conflict.
For stores, stale cart behavior is especially dangerous. If cache serves an outdated quantity or subtotal, the user loses trust. So the cart, mini cart, account area, checkout page, and any AJAX-driven states should be excluded from aggressive caching whenever the optimization extension allows it. If that option does not exist, keep a simpler cache strategy and preserve correct purchase behavior.
Maintenance Checklist
After launch, create a short internal maintenance guide. It only needs to cover where to change the logo, where to update banners, what image sizes are needed for the slider and product cards, which modules control the product blocks, which category powers the sale section, how to clear cache, where to check Safe Path, how to roll back a CSS tweak, and where the backup is stored. That document can be shorter than a page, but it can save hours during the next update or when an administrator changes.
Run updates on a copy of the site. Update Joomla and core system extensions first, then VirtueMart, SP Page Builder, Helix Ultimate, SmartAddons modules, and only after that your custom adjustments. If the template has not been updated in a long time, do not try to upgrade the whole stack on a live store in a single evening. Compare the official changelog and requirements, make a backup, test compatibility, and prepare a rollback plan. A production store needs more than a polished storefront. It also needs a clear maintenance procedure.
Troubleshooting Common Issues After Installation
Problems in a Joomla template rarely have a single cause. The same symptom can come from a missing module, the wrong position, an incorrect menu item, an empty VirtueMart category, caching, an optimization conflict, or an incomplete page import. That is why Emarket troubleshooting works best as a chain: symptom -> site area -> data source -> module assignment -> cache -> conflict.
The Homepage Does Not Look Like the Demo
Symptom: the template is enabled, but the homepage is empty, looks like a generic page, or shows only part of the expected blocks.
Likely causes: sp-hompage.json was not imported, the home menu item does not point to the SP Page Builder page, modules are unpublished, the positions do not match, or the template style is not assigned to that menu item.
What to check: open Components -> SP Page Builder and confirm that the Home page exists. Then check Menus -> Main menu and verify the menu item type. After that, open System -> Manage -> Site Modules and filter the modules by Slider, Position-1, Position-2, and the other homepage positions.
How to fix it: assign the correct menu item, publish the modules, check the menu assignment, and clear the cache. If the page was imported into an already populated page and overwrote its content, restore that page from backup and re-import into a new page object.
Product Blocks Are Empty or Still Show Demo Products
Symptom: Top Selling Products, Flash SALE, or a product carousel does not display your products.
Likely causes: the module points to a demo category, the selected source has no published products, the products have no prices or images, the category is hidden, VirtueMart is not configured, or cache is still serving an old state.
What to check: open the relevant module and review Source Options, Product Options, Category Options, and the product limit. Then open the selected category in VirtueMart and verify that it contains published products.
How to fix it: choose the correct source, publish the products, assign images, update pricing, and clear the cache. If the module is meant to show a promotion, create a separate working category for sale items so it does not get mixed into the standard catalog.
The Mini Cart Does Not Update After Adding a Product
Symptom: a product is added, but the header still shows the old quantity, or the cart link behaves inconsistently.
Likely causes: HTML caching, a JavaScript merge conflict, incorrect SJ Minicart Pro for Virtuemart settings, or a disabled or misconfigured VirtueMart cart flow.
What to check: temporarily disable JS/CSS merging and minification, clear Joomla cache and browser cache, then review the mini-cart module settings: list display, buttons, link opening mode, and list height. After that, add several different products.
How to fix it: rule out cache and optimization first, then tune the module settings. If the conflict remains, disable third-party optimization plugins one by one on a site copy. Do not edit the template JavaScript directly until you understand the cause.
The Mega Menu Works on Desktop but Fails on Mobile
Symptom: the menu feels fine on a large screen, but on a phone it becomes too long, covers the content, or does not lead to the right categories.
Likely causes: the desktop mega menu was pushed into the off-canvas menu without adaptation, there are too many levels, Helix mobile menu settings were not configured, or important items are hidden.
What to check: open Template Options -> Menu and review the off-canvas setup. Then open the site at mobile width and walk through the path to a category, a product, and the cart.
How to fix it: simplify the mobile structure, move important categories higher, remove demo items, and verify the contrast of active items. If necessary, add a small CSS tweak for readability only, without changing the menu behavior.
Settings Changes Do Not Appear on the Site
Symptom: you replaced a logo, color, banner, or module source, but the front end still shows the old version.
Likely causes: Joomla cache, browser cache, module cache, Helix optimization, a CDN, or a different template style assigned to the current menu item.
What to check: clear Joomla cache, open the page in a private window, verify the template style assignment, and make sure you edited the exact module that is published on that page.
How to fix it: disable cache during setup, verify the menu assignment, and then re-enable optimization gradually. If the problem disappears when optimization is turned off, re-enable features one by one until you identify the one that causes the stale output.
The Layout Breaks After Updating an Extension
Symptom: after updating SP Page Builder, VirtueMart, Helix, or a SmartAddons module, part of the layout changes or stops working.
Likely causes: version incompatibility, an outdated override, a changed CSS/JS structure, or the template not having been tested against the new dependency branch.
What to check: compare the changes on a copy of the site, review the extension changelog, temporarily disable custom overrides and custom CSS, and inspect the browser console for JavaScript errors.
How to fix it: roll the update back from backup if the public storefront was affected. On the test copy, update one component at a time and note exactly after which step the symptom appeared. For questionable compatibility, it is better to contact the developer or wait for a confirmed template update.
Final Checks Before Publishing the Store
Once the homepage already resembles the storefront you want, do not jump straight into advertising and indexing. A store template has several areas where issues only show up in a real user journey. Run a final walkthrough as a shopper, an administrator, and a content editor.
Shopper Journey
Open the site as a guest. Find a product through the vertical categories, through search, through a promo block, and through a product carousel. Add a product to the cart, return to the homepage, add a second product, open the cart, change the quantity, and move to checkout. Check more than whether the buttons technically work. Watch the microstates too: does the subtotal update, does the mini cart remain visible, do messages appear correctly, and does the sticky header cover any form fields?
Administrator Journey
Open the admin panel and locate every visible block on the homepage. You should end up with a map like this: "this banner is a Custom module in the Slider position," "this product carousel is SJ Extra Slider for VirtueMart," "this Flash Sale is SJ Deals for VirtueMart," "this page is SP Page Builder Home," "this menu comes from Template Options Menu." If you cannot find the source of a block now, the next administrator will not be able to find it a month from now either.
Editor Journey
Ask the person who will be adding products to create a test product with a long name, multiple images, a discount, and a category assignment. Then check how that product appears inside Emarket modules. If the editor has to remember 12 hidden rules, the workflow needs to be simplified: prepare sale categories, a naming pattern, image rules, and a short instruction sheet.
Technical Final Checklist
- No demo contact details, demo addresses, or empty
#links remain in important public-facing blocks. - The home menu item points to the correct SP Page Builder page.
- Modules are assigned only to the pages where they belong instead of appearing randomly across the site.
- VirtueMart categories and products are published, include images, and do not lead to empty sections.
- The mini cart updates after a product is added.
- The mobile menu does not block the path to search, categories, and cart.
- Cache and optimization are enabled only after the site has passed verification without them.
- A backup has been created for the state that is considered ready for publication.
If every item passes, you can move on to public testing, analytics, SEO metadata, performance checks, and catalog population. If even one critical item fails, it is better to fix it before launch, because storefront errors quickly turn into lost orders.
Questions to Answer Before Downloading and Testing
Can I install SmartAddons Emarket on top of an existing store?
Yes, as long as the store runs on a compatible Joomla version and you install the template and extensions on a test copy instead of deploying Quickstart over the live site. For an existing store, it is safer to use the template package, install the modules, import the settings, and assign the style gradually. Quickstart is better reserved for a new site or a lab copy.
Why does my homepage not look like the demo after installation?
Because the demo view depends on more than the template itself. You also need the SP Page Builder page, the correct menu item, published modules in the right positions, enabled plugins, VirtueMart data, and imported settings. If you install only the template ZIP, you get the shell, not the full demo storefront.
Do I have to use VirtueMart?
For Emarket's store logic, yes, because the official product page and documentation describe it as a Joomla/VirtueMart template, and many storefront modules pull products directly from VirtueMart. You can still use the template as a general Joomla shell, but a large part of the store-oriented blocks will lose their purpose.
Can I update the site to a newer Joomla branch and keep Emarket?
Official sources confirm Emarket as a Joomla 4.x template with a specific dependency stack. Anything beyond that confirmed setup needs to be tested on a copy: Joomla, VirtueMart, SP Page Builder, Helix Ultimate, SmartAddons modules, and your overrides all need to remain compatible at the same time. Do not update a production store without a backup and a test run.
What is better to start with: Quickstart or installing the template and extensions?
For a clean new site, Quickstart gets you to a working structure faster. For an existing site, installing the template and extensions is safer. Quickstart is also useful as a learning copy even for developers: you can inspect which modules and positions are used in the demo and then bring only the necessary pieces into the working build.
Where is the best place to change colors and minor styling?
Start in Template Options. If those settings do not cover a small appearance tweak, use Helix Ultimate Custom CSS or the custom.css file if the template includes one. Do not edit the main template CSS and PHP files unless there is no other reasonable option, because updates can overwrite those changes.
Why is the product carousel showing the wrong products?
Usually the source configuration is the problem. Open the relevant SJ Extra Slider for VirtueMart or SJ Deals for VirtueMart, check the selected category, sorting, limit, published-product filter, and image availability. Then check the products themselves in VirtueMart. If the products are correct but the site still shows the old state, clear the cache.
Do I need a separate designer after installing Emarket?
Not always. The template already provides a strong visual framework. But a designer or a careful content manager is still valuable for banner design, product image proportions, color discipline, mobile verification, and replacing the demo graphics. Even a good template looks weak when it is filled with random images of different sizes and leftover test text.
When SmartAddons Emarket Is the Right Choice
SmartAddons Emarket is worth using if you need a Joomla store with a dense homepage, a large catalog, promo blocks, product carousels, category navigation, a mini cart, and a clear VirtueMart connection. The template's main strength is its ready-made storefront structure. Its main challenge for beginners is that it depends on several Joomla layers at once: the template style, SP Page Builder, modules, menus, and VirtueMart. When those layers are configured deliberately, Emarket quickly becomes a solid store foundation.
Before going public, do not stop at a good-looking homepage. Check the categories, products, images, cart, mobile menu, multilingual setup, currency behavior, cache, VirtueMart safe path, and backup process. For an existing store, work on a copy first. For a new project, use Quickstart as a starting map, but replace all demo data with your own.
If, after testing, you decide that VirtueMart, a marketplace-style storefront, and Joomla's modular structure are the right fit for your project, you can download the Joomla version and deploy a test build. The best approach is not to change the live site immediately, but to assemble a controlled version, walk through the customer journey, and only then move the settings into production.
If instead you need the newest Joomla branch, a different store component, or a minimalist catalog without a large promo-driven homepage, compare Emarket with alternatives first. A template should match not only your taste, but also the store architecture. That is what makes setup predictable and the storefront genuinely useful for shoppers, rather than simply demo-like.
Nearby Materials | ||||
|
SmartAddons BeautyZone - Joomla Template | SmartAddons GoStore - Joomla Template |
|
|




