How To Create A Simple Display Module For PrestaShop

In: E-commerce| PrestaShop

15 Jul 2009

Presumably many of you have wondered how to unleash the full power of PrestaShop, a bright light in the dark area of e-commerce platforms. Let’s have a look at the modules subject for PrestaShop and try to create one almost from scratch. This tutorial is of medium difficulty (OOP).

How To Create A Simple Module For PrestaShop

The advantage that PrestaShop has over its competition is definitely a modular structure that allows developers to create their own modules and themes that are scalable and portable. Using SMARTY template system makes it easier to get access to certain variables that certainly are likely to become a ground for our imagination.

The only problem with PrestaShop is its lack of solid documentation. Forum is bursting with questions to which developers are very unlikely to give answers because they simply don’t have time. Recently they have been upgrading the shop, fixing all the bugs that have been reported so it’s not their fault entirely. I hope that one day somebody will release a good info on PrestaShop, but until then I would like you to get cracking with creating your own modules after this tutorial.

Warning! This tutorial requires not only basic knowledge of PHP but also Object Oriented Programming skills (OOP)!

The back-end module file in PrestaShop

Modules in PrestaShop are like extenders to a basic (or should I say complex) shop’s functionality. Each module is stored within “modules” directory in its own folder. In general PrestaShop requires you to create only two files to make the module work:

  • back-end processing script (PHP class-file);
  • front-end display template file (for front-end modules only);

The back-end script is nothing more than a simple class file that is being recognized by the core as a backbone and all the instructions here are processed automatically to certain point. Basically when PS encounters a module file (has to have the same name as folder which the class-file is stored in) it searches for two main functions within it:

  • __construct();
  • install();

__construct() defines all the information about the module that will be displayed in the admin panel like version number, a name or description, etc. install() function aims to register the basic hook the one of the parts of the page. In the front-end of PS it is possible to use these hooks:

  • hookHeader (hooks content of the template file to heading of the page between <head></head> tags;
  • hookTop (hooks content of the template file to the top of the page, above the main content;
  • hookLeftColumn or hookRightColumn (hooks content of the template file to one of the side panels);
  • hookHome (displays the content on the homepage only);
  • hookFooter (hooks content of the file to the footer);

The structure of the module is very simple, it looks like a simple class file:

Class functionName extends Module {
	Function __construct()
	{
		$this->name = 'SampleModule';
		$this->tab = 'Blocks';
		$this->version = '1.0';
		Parent::__construct();
		$this->displayName = $this-> l(‘displayName’);
		$this->description = $this->l(‘description’);
	}
	Function install()
	{
		//registers the basic hook
	}
	Function (hookName)($params)
	{
		//hooks the mod
	}
}

Below this code you can add your own functions (well, you have to), so the module would come to life. A sample of the hook function is just here:

function hookHome($params)
	{
		global $smarty;
		$category = new Category(1);
		$nb = intval(Configuration::get('HOME_FEATURED_NBR'));
		$products = $category->getProducts(intval($params['cookie']->id_lang), 1, ($nb ? $nb : 10), 'date_add', 'DESC');
		$smarty->assign(array(
			'allow_buy_when_out_of_stock' => Configuration::get('PS_ORDER_OUT_OF_STOCK', false),
			'max_quantity_to_allow_display' => Configuration::get('PS_LAST_QTIES'),
			'category' => $category,
			'products' => $products,
			'currency' => new Currency(intval($params['cart']->id_currency)),
			'lang' => Language::getIsoById(intval($params['cookie']->id_lang)),
			'productNumber' => sizeof($products)
		));
		return $this->display(__FILE__, 'ourcontent.tpl');
	}

As you can see we can call PS configuration variables and use them within smarty to define variables for HTML template file so we won’t have needs for using PHP directly. If you’d like to hook the content to different areas but there would be no change in the content just create a second function with different hook that refers to our main hook, like:

	function hookRightColumn($params)
	{
		return $this->hookHome($params);
	}

To display a configuration page within admin panel we need to use a different pre-defined function called displayform(). This is a function that should render our desired content on the config page for our module. It might look like this one:

public function displayForm()
	{
		$output = '


			
'.$this->l('Settings').'

'.$this->l('In order to add products to your homepage, just add them to the "home" category.').'

				




'.$this->l('The number of products displayed on homepage (default: 10)').'



			

		


';
		return $output;
	}

In order to process the content of the config form we need to use another pre-defined function, that is getcontent(). It will make sure that the form will be processed:

public function getContent()
	{
		$output = '

'.$this->displayName.'


';
		if (Tools::isSubmit('submitHomeFeatured'))
		{
			$nbr = intval(Tools::getValue('nbr'));
			if (!$nbr OR $nbr <= 0 OR !Validate::isInt($nbr)) 				$errors[] = $this->l('Invalid number of product');
			else
				Configuration::updateValue('HOME_FEATURED_NBR', $nbr);
			if (isset($errors) AND sizeof($errors))
				$output .= $this->displayError(implode('
', $errors));
			else
				$output .= $this->displayConfirmation($this->l('Settings updated'));
		}
		return $output.$this->displayForm();
	}

TPL template module display file in PrestaShop

To conclude this tutorial it will be wise to display the content of our back-end script on the website. Since we hooked the content to the homepage the only thing we need to do is create a file with content called “ourcontent.tpl“:





Content:


{if isset($products) AND $products}

{$product.name|escape:'htmlall':'UTF-8'}


{$product.description_short|strip_tags}
	{/if}

Now it’s just a matter of saving the files, uploading the whole module to the server and testing it until it works. Later on I will try to come up with the tutorial about using smarty variables in your modules and themes, as this is a very important issue that needs to have some light shed on it.

Until then good luck with your modules!

download

11 Responses to How To Create A Simple Display Module For PrestaShop

Avatar

Shai

July 21st, 2009 at 1:01 am

Thank you for the informative tutorial. I was looking to start writing a module for PS and this is a great start!

Thank you again for taking the time to post this!

Avatar

Shai

July 21st, 2009 at 1:48 am

Is there downloadable version of this sample?

Avatar

Matt

July 21st, 2009 at 9:29 am

I am currently working on downloadable PDF version but it might take a little bit, so please be patient ;). Also, are you interested in any more PrestaShop tutorials?

Avatar

Shai

July 21st, 2009 at 11:22 pm

I’m working on a module http://bit.ly/IExjZ so a tutorial on hooking into PS functions would help

Avatar

Shai

July 21st, 2009 at 11:40 pm

I followed your display tutorial and uploaded. Clicking modules now comes up blank under tabs. my php file http://bit.ly/Mt5UU

Avatar

Matt

July 22nd, 2009 at 9:21 am

This was just an informative tutorial with few examples, it wasn’t meant to be working without some adjustments. And in your code you forgot about preparing the install() function which determines whether the mod will be seen in the back-end (if there is no install function PS will can’t display the install button, etc.).

Avatar

starboune

July 27th, 2009 at 12:50 am

Very great, thank you for taking time to write it its very useful. I am interested to read a tutorial how to create an completely new table in database and retrieve the data.
Thank you again.

Avatar

Matt

July 28th, 2009 at 9:38 am

Thanks for your comments, of course I will be posting more and more articles about PrestaShop as there are still people struggling to get it to work as they want it to, so stay tuned. If it comes to the database table creation will you need it for storing some custom settings?

Avatar

Midhun Girish

November 8th, 2009 at 6:25 am

Hey that was a great tut ….. Really ps lacks docs… and this tut made it up for a start… Now atleast i can start cracking the code and learn it… thanks man..i am loking forward to see more from you… mail me if i can be of any help..im new in ps but im working in php smarty mysql for 1yr… hope i will be able to get into the core of this one….

Avatar

elrond

December 25th, 2009 at 8:58 pm

Thanks for the tutorial. Would you mind sharing how to create Prestashop theme? I can only find tutorial which teach how to change color with css on internet :(

Avatar

Matt

December 25th, 2009 at 10:26 pm

I will soon try to post a tutorial on full aspects of creating the PrestaShop theme and styling it up. Thanks for your comments :)

Comment Form

Welcome

Here you can find web design related tips and tricks as well as industry news and articles, and of course tutorials. There will be plenty of stuff to download, like ready designs and files for tutorials, PrestaShop modules and other content. I hope to start building here a small but quality knowledge base, so if you have some thoughts about it give me a shout by commenting on my blog. I think we could all benefit from the knowledge we have so why not give it to the other people?

Don't forget to subscribe to my RSS feed to get the latest headlines!

Photostream

Categories

Archives

  • Guest: Thanks so much for the info [...]
  • Rahman: Where's link for download ?..... [...]
  • Matt: I will soon try to post a tutorial on full aspects of creating the PrestaShop theme and styling it u [...]
  • elrond: Thanks for the tutorial. Would you mind sharing how to create Prestashop theme? I can only find tuto [...]
  • Midhun Girish: Hey that was a great tut ..... Really ps lacks docs... and this tut made it up for a start... Now at [...]