SJ Accordion for HikaShop - Joomla Extension
SJ Accordion for HikaShop, the Joomla module, integrated with the amazing support for the functions of the HikaShop component, was released and is compatible with Joomla 4.x and 5.x. A good choice for professional sites.

Extension Description
With the support of the two main layouts, along with the title and the navigation button, the selected one will automatically open with a preview image, a description, an estimate, a price detail and display an additional link if you use Hover. To see more details of each element, you need to click on the selected one, then the information associated with it will immediately appear. In addition, the user-friendly interface in the admin panel is completely easy to manage all the parameters. You can easily enter the number of items to display on the main page, add the appropriate categories, select the type of effect, display / hide the Title, description, price, voice, add to the basket, and so on.
- Support adaptive layout and all versions of HikaShop
- Fully compatible with IE8 +, Firefox 2+, Flock 0.7+, Netscape, Safari, Opera 9.5 and Chrome
- Allows you to select the source to be displayed and sort by any order
- Support for two types of accordion: click and hang
- Allows you to set up open links in: a new window / the same window / pop-up window
- Allows you to display user information: name, description, price, voice, add to cart / add to wishlist
- Support for multiple modules on one page
- Allows you to set the total number of products and which is displayed first
- Allows you to change the width, height, image format
- Allows you to receive images from a product image, description and extended folder
- Allows you to change the maximum length of the product name / description
- Multi-language support
- Support 4 modes for resizing images
- Caching support to speed up the loading of your site
- Support for inserting pre-and post-text with each instance.
Specifications:
| Release date: | 14-05-2014 | |
| Last updated: | 03-07-2024 | |
| Type: | Paid | |
| License: | GPL | |
| Subject: | Specific for HikaShop | |
| Compatibility: | J3.x J4.x J5.x | |
| Includes: | Module | |
| Language packs: |
|
|
| Developer: | SmartAddons | |
| Rating: | ||
Share with your friends!
Guide to Setting Up SJ Accordion for HikaShop for a Joomla Store
SJ Accordion for HikaShop is a module for Joomla stores running on HikaShop that helps display products or product categories in a compact accordion layout. This guide focuses on the actual workflow rather than marketing copy: how to prepare your store, where to enable the module, which settings to review after installation, how to choose a product source, how to avoid breaking product pages, and how to verify the result on the live frontend.
This product belongs to the class of extensions where problems rarely show up as obvious system failures. More often, the module simply does not appear in the right position, shows the wrong category, opens too many products, conflicts with the template, or leaves empty image placeholders. That is why this guide is structured as a practical walkthrough: first check the foundation, then configure the output, then review a real store scenario, and finish with diagnostics.
The exact features available in your build depend on the package version you received from the developer. Publicly available sources include the SmartAddons page, pages for similar HikaShop modules, and HikaShop documentation on product output. Because of that, this guide uses cautious wording in any uncertain area: if a setting exists in your build, enable it as described; if it does not, solve the same task through standard Joomla module settings, HikaShop category settings, or CSS.
The main goal is to create a controlled product block: visitors see product groups, open the tab they need, quickly move to a product, and the administrator clearly understands where to change the source, order, quantity, image, description, price, and link behavior.
Where an Accordion Is Useful in a HikaShop Store
An accordion works well when a standard product grid takes up too much space, while a slider or carousel hides part of the catalog behind motion. In a Joomla store, this is especially noticeable in sidebars, on the homepage, inside a category landing block, on a brand page, and in short showcases such as "new arrivals," "best sellers," "deals," "bundles," or "gift ideas."
In HikaShop, products are typically tied to categories, prices, images, descriptions, navigation buttons, the cart, and custom fields. SJ Accordion for HikaShop adds an expandable panel interface on top of that structure. It does not replace the catalog and should not become the primary navigation method for a large store. Its purpose is to compress a selected set of products or categories into a clear widget that encourages visitors to explore a specific part of your catalog.
Good use cases for the module:
- Display several categories in a sidebar so shoppers can understand the catalog structure without a long menu.
- Show a curated set of products from one category on the homepage without overloading the first screen with a grid.
- Build a "frequently bought" block next to a category description if those products are already grouped in a separate HikaShop category.
- Place a compact promo block inside a Joomla article if the template supports a module position or loading modules into content.
- Show products with a short description and price while leaving the full product page for the next step.
A poor use case is trying to replace a full filter, search, category page, or product page with an accordion. If users need to compare dozens of products by features, sort by price, filter sizes, and read long descriptions, standard HikaShop pages, filters, and dedicated search modules are the better fit.
Practical rule: an accordion should display a small, meaningful set. If one module instance contains more than a few groups and dozens of products, it is usually easier for visitors to open a regular category page.
Who This Module Fits and When Another Format Is Better
SJ Accordion for HikaShop is a good fit for a store owner, webmaster, or content manager who needs to add a compact product block quickly without building a separate template. The module is especially useful on sites where the catalog is already configured in HikaShop, but the homepage or sidebar feels empty: the accordion helps turn existing products into a live navigation block.
The module works well if you manage a limited set of categories, want to control output through Joomla modules, and are not planning advanced personalization. On a typical site, that means choosing a HikaShop category, limiting the number of products, setting the order, enabling the right product elements, assigning the module to pages, and checking it inside the template.
There are also cases where another format is the more honest choice:
- If you need a horizontal promo block with auto-scrolling, a product slider or scroller module is a closer match.
- If you need product comparison, an accordion does not replace a spec table or a standard product page.
- If visitors need to see many product cards at once, a regular HikaShop grid will be easier to understand.
- If the store relies heavily on filters, it is better not to hide product selection behind expandable panels.
- If the site serves a mobile-heavy audience, you need to test carefully whether the panels are comfortable to open by touch and whether content stays inside the screen bounds.
For a developer, the module is useful as a safe layer between HikaShop and the template. You can control the source and output style without modifying the component core. At the same time, it is not realistic to promise full compatibility with every template: the accordion's appearance depends on CSS, the module position, container width, loaded libraries, and how the template styles buttons, images, and headings.
What to Check Before Installing the Extension
Before installation, make sure the site is ready specifically for a HikaShop product module. Preparation mistakes often show up later: the module is published but empty; products exist but do not make it into the source; images exist on product pages but appear as placeholders in the module; or the block is placed in a position that does not exist in the active template.
Basic Joomla and HikaShop Compatibility
First, verify that HikaShop is installed, enabled, and that the store already contains products with categories. The module does not create a catalog from scratch. It uses HikaShop data, so an empty category, unpublished products, or missing images will produce weak results even if the module itself is installed correctly.
On the Joomla side, check three things:
- Whether you have access to install extensions in the admin panel.
- Whether the active template has a position where the accordion can be placed.
- Whether you understand on which menu items the module should appear.
If the site was updated recently, review HikaShop separately. HikaShop documentation recommends keeping the component updated and records changes in release notes, including fixes related to product lists, orders, and security. You do not need to rely on a version number in the article itself, but before working on a live store, make sure the component is not in an obviously outdated state.
The State of Categories, Products, and Images
For an accordion, data quality matters more than the number of settings. Before installation, choose one test category and prepare 5-8 products. Each product should have a name, published status, main image, price, a clear short description, and a link to its product page. If you want to display products from child categories, make sure the category structure is logical: an accordion is not very helpful when categories are named with internal system labels.
It also helps to decide in advance what the main click target should be: the product title, the image, a read more button, or the cart button. If you enable everything at once, a compact block becomes heavy. For a sidebar, the image, title, and price are often enough. For a homepage promo block, you can add a short description and a navigation button.
Position, Menu Assignment, and Cache
A Joomla module does not live only inside its own settings. It also has a template position, publication state, access level, language, menu assignment, and caching. Before installation, open the list of positions in the active template and choose a spot where the accordion will have enough width. A narrow position calls for a minimal element set: a short title, a smaller image, and no long description.
If Joomla cache, template cache, or server-side cache is enabled on the site, it is better to test initial setup in a mode where changes appear immediately. Once configuration is done, you can re-enable caching and verify that an old product set is not still being shown after changing the source.
Installation and Initial Activation in Joomla
Installation works like any standard Joomla module: first through the extension installer, then through the module list. In older SmartAddons guides, the path is often described as Extensions -> Extension Manager or Extensions -> Module Manager. In newer Joomla interfaces, section names may differ, but the logic is the same: install the ZIP package first, then create or open the module instance in the site module list.
- Create a backup of the site, or at least the database and extension folders, before installing.
- Open the Joomla extension installer and upload the module package.
- After a successful installation, go to the site module list.
- Find the SJ Accordion for HikaShop module type or the created module instance.
- Open it, publish it, give it a clear title, and choose a template position.
- Assign the module only to a test menu item so the unfinished block is not shown to all visitors.
- Save and open the public page in a separate tab.
The initial check should be simple. Do not configure every effect, image, and description right away. First, make sure the module appears in the correct position and displays at least one product or category. Only after that does it make sense to fine-tune the accordion's appearance and behavior.
If the module does not appear after installation: do not start with CSS. First check publication state, position, menu assignment, access level, language, and whether the selected category actually contains products.
Module Positions, Menu Items, and Multiple Instances on One Page
For a Joomla extension like SJ Accordion for HikaShop, setup does not end with choosing the product source. The same module can behave very differently in different template positions: a sidebar compresses the card layout, a wide position lets you keep descriptions, a page footer block may conflict with other modules, and a position inside article content depends on how modules are loaded into content. Before fine-tuning, decide exactly where the accordion will live.
In Joomla, a module has three visibility levels: whether the instance is published, whether it is assigned to the needed menu item, and whether the active template outputs the selected position. These levels are independent. You can configure the HikaShop source perfectly and still choose a position that does not exist in the template. You can choose the right position and forget the menu assignment. You can assign the module to all pages and then wonder why the product showcase appears next to checkout or account pages.
How to Choose a Position Without Guesswork
Start with a position that already contains similar content: a category block, a new products list, a promo module, or a sidebar menu. That lowers the risk of the template applying an unexpected width or spacing. If the template has a position preview mode, use it on a test page. If it does not, temporarily enable the module title and give it a short name that makes the output location easy to spot.
For a sidebar, choose a minimal composition: product title, image, price, and link. In a wide position, you can add a short description and more products. For the bottom of a page, blocks like "more from this category" or "popular products" work well, but do not make them too long: by that point the visitor has already reached the end of the page, and an overloaded accordion can get in the way of the next action.
Menu Assignment and HikaShop Context
Assign the accordion where it supports the page's purpose. On a category page, it can show products from a related branch. On a product page, it can lead to similar products if that logic is configured through category structure or synchronization. On the homepage, it can show a prepared promo category. But on checkout, registration, account, or utility pages, the module is often unnecessary.
If the module supports synchronization with the current category, test it on several pages. Context-aware logic is useful, but it also creates different results on different URLs. For an editor, that can look like a bug: the accordion is filled on one category page and empty on another. If the site team is not ready to maintain that kind of dynamic behavior, using a fixed source is usually simpler.
Multiple Instances of the Same Module
SmartAddons mentions support for multiple instances on one page in similar modules. Even if your build supports multiple instances, use that feature carefully. Two accordions side by side should solve different tasks: for example, one shows categories and the other shows sale items. If both blocks pull similar products and differ only by sorting, the page starts to feel noisy.
With multiple instances, Module Class Suffix and cache become especially important. Give each instance a clear internal name in Joomla, scope CSS tweaks to a specific Module Class Suffix, and check whether generated HTML identifiers are being duplicated. If the page starts showing strange expand/collapse behavior, temporarily leave only one instance enabled and see whether the conflict disappears.
Access Rights and Language Versions
If the store is multilingual or uses restricted customer groups, test the module under different conditions. A product may be published but hidden from guests. The module may be assigned to all languages while the products belong to a specific language. The module title may be translated, while the button text inside the extension is not. In those cases, it is often better to create separate instances per language or use standard Joomla/HikaShop language overrides when you need to change a label.
Minimum pre-publish checklist: guests see only allowed products, signed-in users see the expected prices, the Russian and English versions of the site do not mix labels, and utility pages are not overloaded with product showcases.
Source Logic: Categories, Products, and Child Sections
The most important settings block is the data source. In similar SmartAddons modules for HikaShop, you will often see parameter groups such as Source Options, where you choose the category, child category depth, product order, and number of items. In SJ Accordion for HikaShop, the exact labels may differ, but the logic is the same: the module needs to understand which products or categories to pull from HikaShop and in what order to display them.
Choosing the Main Category
For the first launch, select one main category. Do not choose the root of the entire catalog if it contains many different product types. An accordion works best when the panels are tied together by a clear theme: "summer shoes," "accessories," "weekly deals," or "office bundles." If the source is too broad, the block starts competing with the full catalog.
HikaShop includes the concept of a main category for menus and modules, as well as inheritance and synchronization logic tied to the current page. If your module supports synchronization with the current category, use it only where it is genuinely needed. For example, on a "Laptops" category page, you might show child groups or related products from the same branch. On the homepage, it is usually better to choose a fixed category, otherwise the result may become unpredictable.
Child Categories and Depth
Child category settings determine whether the module pulls products only from the selected category or also from nested sections. This is useful for stores with a clean structure: you can choose a top-level section such as "Clothing" and display products from "Dresses," "Skirts," and "Jackets." But if subcategories are used as technical labels, the accordion may start showing products that visitors would not expect to see grouped together.
For a sidebar showcase, it is usually better to limit the depth. On a homepage, pulling several levels can be fine if you want to show a wider slice of the catalog. After changing the depth, always check which products actually appear in the result, not just how the module looks.
Product Count and Sorting
The number of products should match the available page space. In a narrow column, 5-8 items are usually easier to read than a long wall of content. In a wide module block, you can show more, but it is still important to preserve the feeling of a selection rather than a catalog inside a catalog.
Sorting depends on the goal. If the block is meant to show new products, use creation date or an admin-controlled ordering mode. If you need a "best offers" block, it is often better to prepare a separate category in advance and manually place products there in the right order. Random output can make the site feel more dynamic, but it is harder to verify: a product is there today, gone tomorrow, and the content manager is left wondering whether that is a bug or just the configuration.
How to Configure Accordion Panels and Click Behavior
The unique value of SJ Accordion for HikaShop is the accordion presentation itself. This is where you decide which panel opens first, what controls expansion, where links go, and how the block behaves if there are multiple module instances on the page. In SmartAddons documentation for accordion modules, you will typically see settings for the active tab, Click or Hover events, and link targets such as the same window, a new window, or a popup.
Active Panel on Load
The panel opened by default should help the visitor, not simply be the first one technically. If you are displaying categories, make the first panel the one that matters most for sales or is easiest to understand. If you are displaying products, the first item should be one with a strong image, a short name, and a current price. A weak or empty first panel makes the whole block look unconfigured.
If the active panel parameter takes a number, check whether your version counts from one or from zero. The safest approach is to set the first value, save, open the frontend page, and confirm which panel actually expands. Do not rely on guesswork, because different interfaces use different numbering schemes.
Click or Hover
For a store, Click is usually the safer event. Hover works well on desktop but is less predictable on touchscreens. If the site receives a lot of mobile traffic, click-to-expand is generally clearer: the visitor chooses which panel to open, and an accidental finger movement does not change the state of the block.
Hover can still work for a decorative block on a wide desktop layout where the accordion does not contain critical buttons. If the panel includes a product link, a cart button, or a wishlist element, make sure the panel does not close while the user is trying to click an inner control.
Link Target Window
Opening links in the same window is usually better for a store: the customer stays on a normal path of "showcase -> product page -> cart." A new window can be useful for reference material, but in ecommerce it often breaks the purchase flow. Use a popup only if your build and template support it reliably and you have tested it on mobile devices.
If the module has separate settings for the title link, image link, and read more button, keep the behavior consistent. Visitors should not have to guess why the image opens a popup while the title opens the same page.
Product Data: Title, Description, Price, Buttons, and Images
In a compact module, every extra element is noticeable. Product data settings determine whether the accordion feels like a clean showcase or a compressed copy of a product page. In related SmartAddons modules for HikaShop, confirmed settings include title display, description, price, detail link, images, image size, and image sources. HikaShop also has its own display settings for price, cart buttons, wishlist, badges, and links to the product page.
Titles and Text Trimming
The product title should fit inside the panel without wrapping across five lines. If the module supports a maximum title length, start with a moderate limit and test it against real product names. Do not trim so aggressively that the model, size, or key distinction disappears. It is better to clean up product titles in HikaShop than to try to rescue chaos with heavy truncation.
Only enable a short description in wide positions. For a sidebar, 1-2 lines are often enough. If the description is pulled from the full product description, make sure it is not dragging in HTML, a table, a long list, or internal utility text.
Price, Cart Button, and Link to Product
Price is almost always useful when the block displays products. But a cart button inside the accordion is not right for every store. For simple products with one price and no required options, the button can speed up the purchase. If a product has variants, required fields, or more complex configuration, it is safer to send the user to the product page. HikaShop documentation specifically notes that with some custom item field setups, the add-to-cart action may be replaced by a redirect to option selection.
For a standard accordion, use a setup like this:
- Product image - enabled if the products have good-quality images.
- Name - enabled and linked to the product page.
- Price - enabled unless the block is purely category navigation.
- Description - short or disabled in narrow positions.
- Cart button - enabled only for simple products that do not require mandatory selection on the product page.
- Read more link - enabled if the cart button is disabled or the product needs more context.
Images and Placeholders
In modules like this, images can usually be pulled from the product's main image, the description, or an external folder. The most reliable option is the HikaShop main product image. An external folder is only useful if you have disciplined file naming and a clear upload process. Otherwise, the module may show the wrong image or a fallback placeholder.
Set image sizes to match the container. There is no need to load a large image if the module sits in a 300-pixel-wide column. Oversized images increase page weight and can distort proportions. If a crop mode is available, test faces, product packaging, long items, and logos: Fill may fill the block nicely but cut off an important part of the product, while Fit preserves the whole item but may leave empty space.
Post-image-setup check: open 3-4 products with different image proportions. If one looks fine but another is cropped or stretched, the issue is not the product itself but your overall size and crop strategy.
Styling, Responsiveness, and Safe CSS Tweaks
The module's appearance depends on two layers: the extension's own HTML/CSS and the CSS of the active Joomla template. HikaShop includes a documented way to add CSS through component display settings, and the Joomla template may already have its own rules for buttons, links, headings, and columns. Before editing code, use the module settings first: Module Class Suffix, Alternative Layout, Module Style, Header Tag, Header Class, image sizes, and disabling unnecessary elements.
What to Check for Responsiveness
After the basic setup, do not test only the homepage on a desktop monitor. Open the page in a narrow browser window and check the following:
- Whether the panel title stays inside the container.
- Whether the price overlaps the button or image.
- Whether the panel can be opened by touch without accidentally following a link.
- Whether the cart button disappears when the description is too long.
- Whether a fixed image width creates horizontal scrolling.
If the module looks bad only in one position, first try a different position or reduce the amount of displayed data. CSS should come in only when the output logic is correct but the template needs careful adjustment.
A Small CSS Tweak for a Cleaner Look
You will need to inspect your browser to find the exact CSS class used by your build. Do not edit Joomla core, HikaShop core, or module core files. Add a small CSS snippet in a safe place: the template CSS file, a custom CSS field in the template, or the HikaShop CSS editor if it fits your site setup. Below is an example with a neutral wrapper class that you should replace with the real class of your module instance or add through Module Class Suffix.
.sj-hikashop-accordion-guide .item-title,
.sj-hikashop-accordion-guide .product-title {
line-height: 1.35;
overflow-wrap: anywhere;
}
.sj-hikashop-accordion-guide img {
max-width: 100%;
height: auto;
}
.sj-hikashop-accordion-guide .product-price {
font-weight: 600;
}
This tweak solves three focused problems: long titles stop breaking the panel, images stay inside the container, and the price is visually separated from the description. After adding it, clear cache, open the page in both a regular and narrow window, test 3-4 products, and make sure the tweak does not affect other blocks. To roll it back, remove the added snippet or temporarily remove the module's class suffix.
Practical Example: A Seasonal Product Showcase in a Sidebar Position
Let's walk through a scenario that is easy to repeat on a real Joomla store: you want to display a compact block of seasonal products in the sidebar, where shoppers can see grouped items and quickly move to product pages. This example works well for clothing, accessories, cosmetics, electronics, gifts, and any products that can be grouped into a single promo category.
Goal
Create a module in a sidebar position on catalog pages. Inside the accordion, display a limited set of products from the "Seasonal Picks" category. Visitors should see the image, title, price, and a link to the product page. We are not enabling the cart button because some products may have variants or required selections on the product page.
Preparation
In HikaShop, create or choose a category for the collection. Add several published products to it. Verify that each one has an image, a price, and a clear title. If a product belongs both to its main category and to the promo category, that is fine: HikaShop supports multiple categories per product, and the module will pull products from the selected branch.
Configuration Steps
- Open the SJ Accordion for HikaShop module in the Joomla module manager.
- Publish the module and give it a title such as
Seasonal Picksor another site-appropriate English label. - Choose a sidebar position in the active template.
- In the source settings, select the "Seasonal Picks" category.
- Limit the number of products so the block is not longer than the neighboring content.
- Choose the sorting method: manual category order, date added, or another confirmed parameter available in your build.
- Enable the image, title, and price.
- Disable the long description or trim it to a short line.
- Open links in the same window.
- Set the expand event to click if the block should be easy to use on phones.
- Assign the module only to catalog pages or to a specific test menu item.
- Save, clear cache, and open the frontend page.
Expected Result
A compact accordion appears on the page. The first panel is open or ready to open, titles are readable, images are not stretched, the price is visible, and clicks lead to product pages. If a product has variants, the customer lands on the product page and chooses options there instead of trying to complete the purchase inside a small block.
A Common Detail That Gets in the Way
If the module stays empty after selecting the category, do not start by blaming the module itself. Check the data: are the products published, do they belong to the selected category, is access allowed, is the language relationship correct, and is a mode enabled that only pulls products from the current page category? If synchronization with the current item is enabled, the accordion may work on one page and show a different set or nothing at all on another.
How to Verify the Result After Configuration
Verification is not just a checkbox exercise. An accordion may look fine in the admin preview and still break on a category page with a different container width, different products, another language, or another menu item. Build a short testing route and repeat it after every change to the source, template, or cache settings.
Frontend Check
- Open the page where the module should appear while not logged in as an administrator.
- Verify that the module is in the expected position and not duplicated.
- Open each panel and make sure the content does not jump outside the block.
- Click the image, the title, and the read more link if they are enabled.
- Check the page at a narrow window width and on a real phone if one is available.
HikaShop Data
Compare 2-3 products from the accordion against their product pages in HikaShop. The title, image, price, and published status should match what you expect. If the price is hidden, check whether that comes from the module settings, HikaShop settings, a user group restriction, or the product itself.
Menu, Language, and Access
Open a page where the module should not appear. If it shows up there, fix the menu assignment. If the site is multilingual, verify the language of the module and the language of the products. If the site has restricted customer groups, open the page as a guest and as a signed-in user: access to the module and access to the products should match your sales logic.
Quick verification takeaway: a good result is not simply "the module is visible." A good result means the module appears only where it belongs, shows the correct products, sends clicks where shoppers expect, and does not break on mobile.
Speed, SEO, and Shopper Usability
A product module affects how the page feels and sometimes its speed as well. If the accordion displays many images, long descriptions, and several instances on the same page, the load increases. SmartAddons modules usually include caching options, and Joomla and HikaShop each have their own cache mechanisms. But cache will not fix a bad source choice or overly heavy images.
Performance
Limit the number of products and the image dimensions. Do not output dozens of products in the module if the user will only see a few panels anyway. If the module has a cache setting, enable it after configuration is finished and then test how assortment updates behave. For blocks with frequently changing prices or stock status, do not set a long cache lifetime without checking the real refresh behavior.
SEO
An accordion can improve internal navigation if its links point to real product pages or categories. But you should not hide all of the page's important text inside expandable panels. The main SEO work still belongs on category and product pages: titles, descriptions, images, prices, availability, canonical URLs, and a solid menu structure.
If the module is placed on the homepage, use it as a supporting navigation block. Do not repeat long product descriptions that already exist on product pages. A short title, a price, and a clear link are usually more useful than a compressed promotional paragraph.
Usability
For shoppers, three things matter most: understanding that the panels can be expanded, seeing the expected product, and moving forward without friction. Use clear panel headings, do not force users to catch a hover state on mobile, and avoid excessive visual effects. The effect should help with orientation, not distract from the product.
Why SJ Accordion for HikaShop May Not Work and How to Diagnose It
It is best to work through diagnostics from the Joomla layer to the HikaShop data and only then move on to CSS or JavaScript. That way, you do not waste time on styling when the module is simply not assigned to the right menu item or the selected source is empty.
The Module Does Not Appear on the Page
Symptom: the installation completed successfully, but there is no accordion on the frontend. Possible causes include the module not being published, a nonexistent position being selected, no menu assignment, an access level that does not match the current user, a module language that does not match the page, or a template that does not output the chosen position.
Check the publication state, position, and menu assignment. Then temporarily assign the module to a single test menu item and enable the title display. If the title appears but the content does not, move on to source diagnostics. If even the title does not appear, the problem is almost certainly in the Joomla module settings or the position itself.
The Accordion Is Visible but Shows No Products
Symptom: the module frame or title is visible, but no products are displayed. First, check the selected HikaShop category. It must contain published products that are available to the current user and language. Then review the child category settings: if only the direct level is enabled while the products are deeper in the hierarchy, the result will be empty.
If synchronization with the current category is enabled, open another category page. The module may be pulling products relative to the current context rather than from a fixed source. On the homepage, it is usually easier to disable synchronization and choose a specific category.
The Wrong Products Are Displayed
Symptom: the module works, but products from different sections are mixed together or older items appear unexpectedly. Check child category depth, sorting, random output, and cache. If products belong to multiple categories, make sure the promo category has not become too broad.
Fix: create a dedicated showcase category, place only the needed products there, and point the module to that category. That is clearer than trying to build a complex selection from the entire catalog.
Images Are Stretched, Cropped, or Replaced with a Placeholder
Symptom: one product looks fine, another is stretched, and a third shows a placeholder. Check the image source setting in the module: main product image, description, or external folder. Then review the dimensions and crop mode. If some products do not have a main image, fix the product pages in HikaShop first.
If images exist but still look bad, reduce the module image size, choose a softer scaling mode, or add CSS with max-width: 100% and height: auto for images inside that specific module instance.
Panels Do Not Expand or Behave Unreliably
Symptom: clicking does not expand a panel, hover behaves strangely, the popup does not open, or controls inside the panel cannot be clicked. Possible causes include a JavaScript conflict, duplicate jQuery loading, popup mode, script compression, cache, or a template conflict. HikaShop documentation separately describes modal window issues and JavaScript conflicts as a common class of problems around templates, system plugins, and modules.
Check by temporarily disabling questionable effects, switching expansion to click, opening the browser console, and looking for JavaScript errors. Then disable script optimization, third-party system plugins, or the suspicious module one by one on a test copy. If the problem disappears after changing the template, the cause is probably the template or its scripts.
Old Results Still Show After Changing Settings
Symptom: everything is saved in the admin panel, but the frontend still shows old products or the old layout. Check Joomla cache, module cache, template cache, server-side cache, and browser cache. During setup, you can temporarily disable caching for the module or shorten the cache lifetime. After publishing, re-enable cache and test how quickly the block updates when products change.
When It Is Better to Roll Back a Setting
Roll back the last change if it makes the block empty, breaks clicks, hides prices, or damages the mobile layout. Work one change at a time: first the source, then product data, then images, then effects, then CSS. That order makes diagnostics shorter and keeps setup from turning into guesswork.
Questions About Setup and Limitations
Can I use SJ Accordion for HikaShop without a configured catalog?
Technically, you can install the module, but it will provide very little value. First create categories and products in HikaShop, add images and prices, and verify a normal category page. Only then should you configure the accordion as a compact display of already prepared data.
What is better for expansion: click or hover?
For a store, click is usually better. It is more predictable on mobile devices and less likely to interfere with clicking inner links. Hover can work for a decorative block on desktop if there are no important buttons inside the panel.
Why is the price not showing in the accordion?
The cause may be the module setting, HikaShop settings, access level, user group, currency, or the specific product. First check whether the price is visible on the regular product page for the same user. Then review the price display setting in the module and whether it inherits HikaShop settings.
Can I enable an add-to-cart button inside the panel?
If that option exists in your build, enable it only for simple products. If a product requires a variant, specification, or mandatory field selection, it is better to send the visitor to the product page. That reduces the risk of errors and makes the purchase path clearer.
Is this module suitable for a large catalog?
For a large catalog, an accordion works well as a supporting block, but not as the primary interface. Use it for curated selections, categories, promotions, and short showcases. Leave the full catalog to standard HikaShop pages, filters, search, and menu navigation.
What should I do if the panels stop opening after enabling an effect?
Return to a simple mode: click-based expansion, no popup, and no extra effects. Then check the browser console, cache, and JavaScript optimization. If the problem disappears after changing the template or disabling a third-party system plugin, look for the conflict at that layer.
Do I need to add CSS for every site?
No. Start with the module and template settings. CSS is only needed for precise adjustments: wrapping long titles, image sizing, spacing, price weight, and responsiveness. It is best to scope the tweak to a specific class suffix so it does not affect other HikaShop blocks.
Is there an exact video tutorial for SJ Accordion for HikaShop?
No exact, useful video for this module was found in public search. For general orientation, you can watch materials about HikaShop modules and Joomla module assignment, but presenting them as instructions specifically for SJ Accordion for HikaShop would not be accurate.
When SJ Accordion for HikaShop Is the Right Choice
SJ Accordion for HikaShop is worth using when you need a compact product block for a Joomla store: a category selection, a seasonal showcase, sidebar product navigation, a small homepage promo section, or a tidy block next to a category. It is especially useful when your assortment is already configured in HikaShop and the goal is to display a small set of products without building a separate template.
Before publishing, verify the product source, item count, click behavior, mobile layout, images, price, links, and cache. If everything works on a test menu item, you can expand the module assignment to the pages where it belongs. If, however, you need a large catalog, filters, feature comparison, or a complex product page, use the accordion only as an additional navigation block.
Once the preparation is complete and you understand exactly what kind of block you want, you can go to the SJ Accordion for HikaShop download, install it on a test copy of the site, and walk through the checks from this guide before publishing it on the live store.
Nearby Materials | ||||
|
Minitek Responsive Grid for Virtuemart - Joomla Extension | ZL Related Categories Pro - Joomla Extension |
|
|


