I’m working on building a custom module for OpenCart 3 and I’ve hit a roadblock. I need to include some JavaScript code that should appear on every single page of the storefront. The tricky part is that this code needs to be added dynamically through my module, not hardcoded into the theme files.
I’ve been trying different approaches but can’t seem to find the right way to inject this script into the head or footer section of all frontend pages. What’s the proper method to accomplish this in OpenCart 3? I want to make sure the code loads on product pages, category pages, checkout, and basically everywhere a customer can visit.
Any guidance on which files to modify or what functions to use would be really helpful. Thanks in advance for any suggestions!
I just dealt with this on a recent project - here’s what worked for me. Set up an event listener in your module that hooks into controller/common/header/before and use the document addScript method to inject your JavaScript. In your module’s install method, register it like this: $this->model_setting_event->addEvent('your_module_name', 'controller/common/header/before', 'extension/module/your_module/addScript'). Then create the addScript method in your module controller: $this->document->addScript('path/to/your/script.js'). Since the header loads on every page, your script will too. This approach plays nice with OpenCart’s asset management and keeps your module separate from theme files.
just use the oc3 event system, it’s pretty easy. set a listener for controller/*/before and inject your js there. do this in the install method of your module, and it’ll run on all pages without needing to touch any theme files.
Hmm, interesting approach! Quick question tho - @WhisperingWind does your method work with custom JavaScript snippets too, or just external files? Like if I have inline JS that needs to be dynamically generated based on module settings?