How easy is it to theme prestashop?

[jamesjeffery]

I work as a web developer and graphic design and have worked a lot with wordpress themes and my own custom stuff.

I was just wondering how easy is it to theme PrestaShop? Is it just dealing with stylesheets? And playing with the .tpl files to customize the layout of modules etc?

I don't really want to be messing about with any core files.

[rocky]

Writing themes in Prestashop is very easy and clean compared to other shopping carts, since it uses Smarty templating, which allows you to modify the theme without modifying any PHP files. Modifying the TPL files and CSS files should be all you need to do to create a theme. Prestashop achieves this by allowing the theme to override any module's TPL file, which allows you to link to theme-specific CSS and JS. You do this by mirroring the directory structure inside the theme's directory. For example, you could create a file called themes/prestashop/modules/blockuserinfo/blockuserinfo.tpl to override modules/blockuserinfo/blockuserinfo.tpl to change the content and appearance of the "User info block" for that theme only. This allows you to have multiple themes installed on the same Prestashop with completely different looking modules, while having the same module code.

Unfortunately, since the documentation of Prestashop is lacking, there are not many themes that have taken full advantage of Prestashop's theme system. There are quite a few themes that are very similar to the default Prestashop theme. Many of the themes are also incompatible with the latest version of Prestashop. I'd like to create some themes that do take full advantage of Prestashop's theming system, but unfortunately I'm not creative enough to do it. I have the technical knowledge required to do it, but not the graphic design skill required.

[QuadDamage]

Thanks for explaining the Theme override feature Rocky. That helps me allot.

[PPUK]

Yes the above post is true. Here at Presta Pixel we have started to release themes compatible with 1.2.5 and had good response but most people on the forum will help you out. Depends on the level of theme design you require. We can maybe help with this if you get in touch.

[starscream1999]

Writing themes in Prestashop is very easy and clean compared to other shopping carts, since it uses Smarty templating, which allows you to modify the theme without modifying any PHP files. Modifying the TPL files and CSS files should be all you need to do to create a theme. Prestashop achieves this by allowing the theme to override any module's TPL file, which allows you to link to theme-specific CSS and JS. You do this by mirroring the directory structure inside the theme's directory. For example, you could create a file called themes/prestashop/modules/blockuserinfo/blockuserinfo.tpl to override modules/blockuserinfo/blockuserinfo.tpl to change the content and appearance of the "User info block" for that theme only. This allows you to have multiple themes installed on the same Prestashop with completely different looking modules, while having the same module code.

Unfortunately, since the documentation of Prestashop is lacking, there are not many themes that have taken full advantage of Prestashop's theme system. There are quite a few themes that are very similar to the default Prestashop theme. Many of the themes are also incompatible with the latest version of Prestashop. I'd like to create some themes that do take full advantage of Prestashop's theming system, but unfortunately I'm not creative enough to do it. I have the technical knowledge required to do it, but not the graphic design skill required.

Hi, this method is very good for the default modules- I tried using the method for third party modules and this doesn't have any effect. The third party module only works in the /presetashop/modules/ folder and not in /themes/prestashop/modules/.

Any steps did i missed out on?

[rocky]

It should work. I just tried copying modules/jbx_menu/menu.tpl to themes/prestashop/jbx_menu/menu.tpl and the file was correctly overriden. It should work with any module that uses:

$this->display(__FILE__, 'template.tpl');

[starscream1999]

thank you for the info.

I have two questions :

1. I noticed that editorial module does not have this. i have to upload the homepage logo again when i wnt to use the same theme elsehwhere. Let me know how to automatically update the homepage logo in the editorial when i use a theme without using the BO. Where do I add this line or is there anything else i need to add so it can be set to work like the other module

2. I have also used the blocktopmenu module and copied it to /themes/xyztheme/modules/ but it doesn't show on the BO..when i moved it to the /modules/ it appears!!! The module has those lines

public function hooktop($param)
 {
       global $smarty;
       $this->makeMenu();
       $smarty->assign('MENU_SEARCH', Configuration::get('MOD_BLOCKTOPMENU_SEARCH'));
       $smarty->assign('MENU', $this->_menu);
       $smarty->assign('this_path', $this->_path);
   return $this->display(__FILE__, 'blocktopmenu.tpl');
 }

Any idea how to get this to appear as i want all my modules file within my theme folder.

[rocky]

1. You can't override images, only TPL files. You could change line 256 of modules/editorial/editorial.php from:

'homepage_logo' => file_exists('modules/editorial/homepage_logo.jpg'),

to something like this to make the image overridable:

'homepage_logo' => (file_exists(_PS_THEME_DIR_.'modules/editorial/homepage_logo.jpg') ? _PS_THEME_DIR_.'modules/editorial/homepage_logo.jpg' : (file_exists('modules/editorial/homepage_logo.jpg') ? 'modules/editorial/homepage_logo.jpg' : false)),

and then change line 4 of modules/editorial/editorial.tpl from:

{if $homepage_logo}body->$title|escape:'htmlall':'UTF-8'|stripslashes}" />{/if}

to:

{if $homepage_logo}body->$title|escape:'htmlall':'UTF-8'|stripslashes}" />{/if}

2. I'm not sure why it isn't working. I see that the function name is incorrectly written as "hooktop" when it should be "hookTop". Try upgrading to the latest version of the module (the jbx_menu one that's working for me).

[starscream1999]

sorry i have not been responding - I was kinda busy - it was a good tip you gave.. one little spelling error on "{$hompage_logo}" which should be "{$homepage_logo}". I got the rest working after doing that changes. Thanks rocky.

[rocky]

Thanks, I've fixed my code above.

[Billy]

Very nice rocky thanks for this share as well... This works just like impresscms and xoops. I am glad I stumble on this tonight! Again any themes available for download with these examples in them already?

[rocky]

No, I'm not aware of any themes that let you override the homepage logo within the theme.

[shacker]

1. You can't override images, only TPL files. You could change line 256 of modules/editorial/editorial.php from:

'homepage_logo' => file_exists('modules/editorial/homepage_logo.jpg'),

to something like this to make the image overridable:

'homepage_logo' => (file_exists(_PS_THEME_DIR_.'modules/editorial/homepage_logo.jpg') ? _PS_THEME_DIR_.'modules/editorial/homepage_logo.jpg' : (file_exists('modules/editorial/homepage_logo.jpg') ? 'modules/editorial/homepage_logo.jpg' : false)),

and then change line 4 of modules/editorial/editorial.tpl from:

{if $homepage_logo}body->$title|escape:'htmlall':'UTF-8'|stripslashes}" />{/if}

to:

{if $homepage_logo}body->$title|escape:'htmlall':'UTF-8'|stripslashes}" />{/if}

2. I'm not sure why it isn't working. I see that the function name is incorrectly written as "hooktop" when it should be "hookTop". Try upgrading to the latest version of the module (the jbx_menu one that's working for me).

Hi. At this point, you can overrides the entire module with the image. You need to upload the editorial module with your own image to

themename/modules/editorial

all the modules contained in the modules folder of the theme, overrides the modules in root folder of presta.

[Billy]

Let me grasp this idea / feature correctly then. Are you saying a complete module with all the php code, css, images & templates can be overridden thru the theme folder?

If this is true there is no need to hack anything except the core and i have been doing this wrong for two sites now.

[shacker]

Let me grasp this idea / feature correctly then. Are you saying a complete module with all the php code, css, images & templates can be overridden thru the theme folder?

If this is true there is no need to hack anything except the core and i have been doing this wrong for two sites now.

Yeap. All the module overrides the default module. But you cant use a non default module in the theme folder or a module that not have in root/module folder

[Billy]

Yeap. All the module overrides the default module. But you cant use a non default module in the theme folder or a module that not have in root/module folder

Hum that's interesting...

So say I have a custom module purchased by me for some funky feature in presta. Your saying that I cannot install this module in the presta module folder then put a copy of that module in the themes folder to override/customize?

I think that is cool that I can override the original php code just by placing a copy of that code in the themes folder. That has to be one of the best features I have ever seen.

So how does this work? I know rocky said something about smarty which I know about because of xoops and impresscms. You can only override the module templates with those systems not the php code.

So how does presta override the php code? Surly this is not smarty...

[Billy]

Err... double post! Sorry

[shacker]

Yeap. All the module overrides the default module. But you cant use a non default module in the theme folder or a module that not have in root/module folder

Hum that's interesting...

So say I have a custom module purchased by me for some funky feature in presta. Your saying that I cannot install this module in the presta module folder then put a copy of that module in the themes folder to override/customize?

I think that is cool that I can override the original php code just by placing a copy of that code in the themes folder. That has to be one of the best features I have ever seen.

So how does this work? I know rocky said something about smarty which I know about because of xoops and impresscms. You can only override the module templates with those systems not the php code.

So how does presta override the php code? Surly this is not smarty...

I explain bad. You overrides the TPL (and called to other files in the tpl like JS, or css) , not the php files.

[Billy]

Yeap. All the module overrides the default module. But you cant use a non default module in the theme folder or a module that not have in root/module folder

Hum that's interesting...

So say I have a custom module purchased by me for some funky feature in presta. Your saying that I cannot install this module in the presta module folder then put a copy of that module in the themes folder to override/customize?

I think that is cool that I can override the original php code just by placing a copy of that code in the themes folder. That has to be one of the best features I have ever seen.

So how does this work? I know rocky said something about smarty which I know about because of xoops and impresscms. You can only override the module templates with those systems not the php code.

So how does presta override the php code? Surly this is not smarty...

I explain bad. You overrides the TPL (and called to other files in the tpl like JS, or css) , not the php files.

No issues I thought it was only the the .tpl files but I was gonna run with the idea until I was told no. Thanks for clearing that up. That would have been bad arse you must admit! lol

[CalloSmart]

I work as a web developer and graphic design and have worked a lot with wordpress themes and my own custom stuff.

I was just wondering how easy is it to theme PrestaShop? Is it just dealing with stylesheets? And playing with the .tpl files to customize the layout of modules etc?

I don't really want to be messing about with any core files.

Hi

I have over 13 years of software development in Microsoft based software development technologies. But I am a newbie to PHP and especially to Prestashop framework. I am learning the framework and in the process, started to write a series of posts(Creating a Prestashop 1.4 theme from scratch) to outline the creation of a new Prestashop theme using Visual Studio and other tools. The posts primarily are targeted towards a PHP/Prestashop newbie.

Please visit Creating a Prestashop 1.4 theme from scratch and share my experiences through my learning phase. I hope active participation from other novice Prestashop programmers like me and advices from Prestashop experts to make the posts helpful for others who require it.

[rajarun]

how to add multiple seller in prestashop

[vekia]

you need some custom module like agile multiple sellers.

by default prestashop hasn't got this feature so you need some plugin that will add this feature.