To show/display the modules on each page in PrestaShop, we need to create new Hooks and CMS pages.
Here are the steps to create a new Hook
1. Create CMS page in Preferences / Cms
2. Create new Hook in file module.php
3. Declare the created Hook in file cms.tpl
4. In module, select CMS Hook in the listbox
2 CREATE SMS PAGE - Back to top
Login your back-office then navigate to: Preferences>> CMS.
Click “Add new CMS page” button.
Fill the form with your information. Two required fields are Meta title and Friendly URL, set Displayed = yes. Click save button to save the information.
You will see the message “Successful update”.
Created page will appear on the list of pages. Note: Remember ID of the page to use in the next step
3 DECLARE A FUNCTION - Back to top
Steps 1: You find the original installation directory of PrestaShop.Then go to the folder Module -> Name module. Ex: SP Search Pro module
Steps 2: Find the file named module.php. Ex: spsearchpro.php
Steps 3: Find $default_hook and add CustomCMS to it. Do the same thing to function_construct with $this->registerHook(‘customCMS’) at the end of function __construct
Steps 4: You declare function hookcustomCMS right after function hookDisplayHome
Copy and paste the following code:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
if(Tools::getValue('id_cms') && Tools::getValue('id_cms') ==7)
{
$smarty = $this->context->smarty;
$smarty_cache_id = $this->getCacheId ('spsearchpro_displayHome');
$n = abs((Tools::getValue('n', Configuration::get('PS_PRODUCTS_PER_PAGE'))));
if (!$this->isCached ('default.tpl', $smarty_cache_id))
{
$list = $this->getItemInHook ('customCMS');
$smarty->assign (array(
'list' => $list,
'n' => $n
));
}
return $this->display (__FILE__, 'default.tpl', $smarty_cache_id);
}
|
You need to change 4 values in the above code:
- 1 - CustomCSM page ID you created at the first step
- 2 - Name of module. Ex: Here
- 3 + 4 - Name of hook.
Then save the file.
Steps 5: Open file cms.tpl in the original installation directory of PrestaShop with the url prestashop\themes\default-bootstrap. Copy and paste the following code:
|
1
2
3
4
|
{hook h='customCMS'}
<div class="rte{if $content_only} content_only{/if}">
{$cms->content}
</div>
|
Steps 6: Login your back-office then navigate to: Modules>>Modules. Find the module that you want to create customCMS hook. You will see customCMS in Hook Into
End, you will get the results in the font-end look like image below:
Wish you success !