If you want to move default prestashop module named "block reinsurance" to top (yes, it's a module for footer icons "money back", "exchange in store", "payment upon shipment", "Free shipping", "100% secured payment") this guide is exactly for you. In this paper i will show you the easiest way to do this.
Block reinsurance modification
We have to modify module core. It's beccause this addon by default doesn't support displayHeader (yes, we will use displayHeader hook instead of displayTop). We must add support of this hook manually. We have also to modify module CSS stylesheet file.
1. displayHeader hook support
Open main module file named blockreinsurance.php, you can find it of course in module directory: /modules/blockreinsurance/. Before last closing bracket } add this code:
public function hookDisplayHeader($params){ return $this->hookFooter($params); }
You can see whole modified file on my pastebin resource (you can see new function hookDisplayHeader(); at the end of the file): modfied blockreinsurance.php on pastebin
2. Transplant module to new hook
Now we have to transplant our modified blockreinsurance module to the new hook. In this case open modules > positions tab in your back office and click on green transplant button:
transplantation of prestashop module
You will see form with several fields. From "module" dropdown select "Customer reassurance block" and from "Hook into" dropdown selection select "displayHeader" hook, exactly as i show on image below. You don't have to define other fields, only these two. After that, just hit green Save button.
transplantation of customer reassurance block
You will see message that you correctly transplanted customer reassurance module to new hook. You can go to the third step now.
3. Remove block reassurance module from displayFooter
It's time to unhook module from old position. In this case on modules > positions back office page search for "displayFooter" modules list and hit thrash icon near block reassurance module on that list. Exactly as i show on image below:
customer reassurance block - remove module from displayFooter modules list
After that action our block reassurance module will be removed from its original position: Footer. After that you can go to fourth step.
4. Changing styles of block reassurance module
Now we have to modify styles of module. We want to create full width reassurance block with icons in the middle of the device screen. In this case we must modify style.css stylesheet. This file is located in module directory /modules/blockreinsurance.css. Remember that if this file exists in your theme /modules/css/ directory - you have to modify this file instead of original one.
Clear file contents and paste there this CSS code:
/* BLOCK #reinsurance_block ******************************************************************** */ #reinsurance_block {display:block; clear:both; background:url(../blockreinsurance/img/bg_reinsurance_block.gif) repeat-x 0 0 #c3c7cb} #reinsurance_block ul {list-style:none; width:980px; margin:auto;} #reinsurance_block li { float:left; padding:15px 10px !important; font-size:13px; color:#333; text-transform:uppercase; text-shadow:0 1px 0 #fff } #reinsurance_block .width1 li {width:960px} #reinsurance_block .width2 li {width:470px} #reinsurance_block .width3 li {width:305px} #reinsurance_block .width4 li {width:224px} #reinsurance_block .width5 li {width:175px} #reinsurance_block li img{ float:left; margin-right:10px; } #reinsurance_block li span { float:left; padding-top:12px; width:65%; }
Just save changes. And that's all.
Effect: Customer Reassurance transplanted to top section