Search code examples
prestashopprestashop-1.7prestashop-modules

Can't register my own modules JS and CSS into the module - Prestashop 1.7.8.4


I cant get my modules CSS and JS to work. The module itself is working correctly, it's turned on, it loads the template file but no matter what I do I just cannot get the css and js to load in.

the css and js are located in:

modules/dksearch/views/js/dksearch.js

modules/dksearch/views/css/dksearch.css

this is the modules php file

if (!defined('_PS_VERSION_')){
exit;
}

class DkSearch extends Module {

    public function __construct() {
        $this->name = "dksearch";
        $this->tab = "front_office_features";
        $this->version = "1.0";
        $this->need_instance = 0;
        $this->ps_version_compliancy = [
            "min" => "1.7",
            "max" => _PS_VERSION_
        ];
        $this->bootstrap = true;
    
        parent::__construct();
    
        $this->displayName = "DKSearch";
        $this->description = "Lorem ipsum";
        $this->confirmUninstall = "Removed";
    }
    
    public function install() {
         return parent::install() && 
         $this->registerHook('registerDKSearch');
         $this->registerHook('actionFrontControllerSetMedia') &&
         Configuration::updateValue('dksearch', 'dksearch');
    }
    
    public function uninstall() : Bool
    {
        return parent::uninstall();
    }
    
    public function hookdisplayDKSearch() {
        return $this->display(__FILE__, 'views/templates/hook/dksearch.tpl');
    }
    
    public function hookActionFrontControllerSetMedia()
    {
        $this->context->controller->registerStylesheet(
            'dksearch-style',
            $this->_path.'views/css/dksearch.css',
            [
                'media' => 'all',
                'priority' => 1000,
            ]
        );
    
        $this->context->controller->registerJavascript(
            'dksearch-javascript',
            $this->_path.'views/js/dksearch.js',
            [
                'position' => 'bottom',
                'priority' => 1000,
            ]
        );
    }

}

The hookdisplayDKSearch.tpl file is displayed in header.tpl by {hook h='displayDKSearch'} I didn't hook ActionFrontControllerSetMedia anywhere in the page i don't know if its necessary. Im using the classic theme if that's worth noting.

I tried following the steps in the presta shop documentation, youtube guides and google but nothing seemed to work, unless i implemented them incorrectly :(


Solution

  • The problem is prestashop now doesn't allow you to register JS and CSS using that hook. You can use displayHeader hook and addJS, addCSS methods.

    $this->registerHook('displayHeader');
    

    And then

    public function hookDisplayHeader() {
        $this->context->controller->addJS("{$this->_path}/views/js/dksearch.js");
        $this->context->controller->addCSS("{$this->_path}/views/css/dksearch.css");
    }
    

    Remember that you have to reset your module to make registerHook get called inside install() function!