HJS Visual Option Picker (OpenCart 3)

Visual product options for OpenCart 3, on top of OpenCart's own option system

HJS Visual Option Picker turns standard OpenCart product options into visual, mobile-friendly choices without replacing OpenCart's native option IDs, pricing, stock or add-to-cart logic. The selection your customer makes is still OpenCart's own option value, so the cart, the order and every other extension see exactly what they always did.

Visual choices

• Automatic colour swatches derived from option names, plus a merchant-editable colour mapping.
• Image swatches using OpenCart's own option-value images.
• Text buttons for sizes, materials and any other choice.
• Radio, Checkbox and Select option types supported.
• Auto / Image / Colour / Text display modes, swatch size control, and square, rounded or circle swatches.
• Selection ring, tick, or both; tooltips; the selected value shown beside the option heading.
• Inline/wrapped or stacked layout, mobile-friendly controls, optional keyboard-focus accessibility.
• OpenCart's own option price text is preserved.

Stock and availability

• Native unavailable-option handling is respected - this does not invent its own stock rules.
• Choose whether an unavailable choice is hidden, or disabled and crossed out.

Dependent options

• Product-specific parent-to-child rules: choosing a parent value filters which child values are offered.
• Multiple allowed child values per parent value, and several child options can depend on one parent.
• Invalid child values are hidden or disabled, your choice; an invalid child selection is cleared when the parent changes.
• Optional auto-select when exactly one child value remains.
• A dependency editor with Add Rule and Duplicate Last Rule, and upgrade-safe dependency table creation.

What was live acceptance tested, and what was not

Stated so expectations are right before purchase. Live acceptance on OpenCart 3.0.3.8 covered installation and admin settings, colour swatch rendering, Select-to-visual-button rendering, the native select being hidden after enhancement, parent-to-child dependency filtering, OpenCart stock availability being respected, and the selected Colour and Size plus OpenCart's native option price adjustments reaching the cart correctly.

• Testing used the standard/default option markup. Heavily customised themes may need selector or Twig adjustment.
• Image-swatch code is included but was not separately live acceptance tested.

Compatibility

• Tested: OpenCart 3.0.3.8, default theme.
• Installs as an OCMOD package. No manual OpenCart core-file editing.

Support

HJS Apps - https://hjsapps24.store

Tags: product options, colour swatches, image swatches, option picker, dependent options, variant selector, opencart 3, product page