Techguide_fr

PrestaShop

Documentation : documentation technique de PrestaShop

v1.0 20 aot 2010

v 1.01/41

PrestaShop

v1.0 20 aot 2010

Documentation Documentation technique de la solution e-commerce open-source PrestaShopDEFINITIONS .................................................................................................................................................... 4 INTRODUCTION GENERALE ET PHILOSOPHIE DU PROJET .................................................................................. 4 PRE-REQUIS TECHNIQUES................................................................................................................................. 5 INSTALLER PRESTASHOP .................................................................................................................................. 5 INSTALLATION LOCALE OU DISTANTE ? .......................................................................................................................... 5 TELECHARGER PRESTASHOP ....................................................................................................................................... 5 COPIER LES FICHIERS D'INSTALLATION ........................................................................................................................... 6 VERIFIER LES PERMISSIONS ......................................................................................................................................... 6 CREER LA BASE DE DONNEES ....................................................................................................................................... 6 SENSIBILISATION A LA SAUVEGARDE ............................................................................................................................. 6 LANCER L'INSTALLATION ............................................................................................................................................ 7 Etape 1 Bienvenue ........................................................................................................................................ 7Dans quelle langue souhaitez-vous effectuer l'installation ? ........................................................................................ 7 Mthode d'installation .................................................................................................................................................. 7

Etape 2 Compatibilit systme ..................................................................................................................... 7Merci de vous assurer que chacun des paramtres ci-dessous est valid .................................................................... 7 Paramtres optionnels .................................................................................................................................................. 8

Etape 3 Configuration systme .................................................................................................................... 8Configuration de la base de donnes ............................................................................................................................ 8 Paramtres d'envoi des emails ................................................................................................................................... 10

Etape 4 Configuration boutique ................................................................................................................. 10Nom de la boutique .................................................................................................................................................... 10 Pays par dfaut ........................................................................................................................................................... 10 Logo de la boutique..................................................................................................................................................... 10 Prnom........................................................................................................................................................................ 10 Nom............................................................................................................................................................................. 10 Adresse e-mail ............................................................................................................................................................. 10 Mot de passe de la boutique ....................................................................................................................................... 10 Confirmez le mot de passe .......................................................................................................................................... 10 Recevoir mes informations par e-mail ........................................................................................................................ 10

Etape 5 Installation termine ! ................................................................................................................... 11 PERSONNALISEZ VOTRE BOUTIQUE ............................................................................................................................. 12 MISE A JOUR DE PRESTASHOP ........................................................................................................................ 13 PRECAUTIONS........................................................................................................................................................ 13 SAUVEGARDE ........................................................................................................................................................ 13 Sauvegarde de vos traductions ..................................................................................................................... 13 Sauvegarde de votre base de donnes .......................................................................................................... 13 Sauvegarde de vos fichiers PrestaShop ......................................................................................................... 14 INSTALLATION DE LA NOUVELLE VERSION ..................................................................................................................... 14 Tlchargement ............................................................................................................................................ 14 Extraction et copie......................................................................................................................................... 14 Restauration des donnes depuis l'ancienne version .................................................................................... 14 Installer la mise jour ................................................................................................................................... 14 ARCHITECTURE GENERALE ............................................................................................................................. 15 GRANDS PRINCIPES (MODULES, THEMES) ...................................................................................................... 15 MODULES............................................................................................................................................................. 15 Le concept ..................................................................................................................................................... 15 Fonctionnement technique d'un module ....................................................................................................... 16 Liste des points d'accroche (hooks) de PrestaShop ....................................................................................... 162/41

PrestaShop

v1.0 20 aot 2010

THEMES ............................................................................................................................................................... 21 Le concept ..................................................................................................................................................... 21 Fonctionnement technique d'un thme ........................................................................................................ 21 La gestion des traductions ............................................................................................................................ 22 Transmettre des informations (donnes) un thme PrestaShop ................................................................ 22 L'ARBORESCENCE DE PRESTASHOP ................................................................................................................ 23 BONNES PRATIQUES A RESPECTER (DEVELOPPEURS, INTEGRATEURS) ........................................................... 24 LA SECURISATION DE VOTRE INSTALLATION PRESTASHOP ............................................................................. 24 OPTIONS DE CONFIGURATION ET FINE-TUNING/PERFORMANCES ................................................................. 25 FICHIER CONFIG.INC.PHP ......................................................................................................................................... 25 FICHIER DEFINES.INC.PHP ......................................................................................................................................... 25 FICHIER SMARTY.CONFIG.INC.PHP .............................................................................................................................. 25 AMELIORATION DES PERFORMANCES DE PRESTASHOP ................................................................................. 25 TRAVAUX PRATIQUES .................................................................................................................................... 26 CREER UN THEME PRESTASHOP................................................................................................................................. 26 Thme par dfaut PrestaShop ....................................................................................................................... 26 Crer un nouveau thme ............................................................................................................................... 26 Arborescence d'un thme .............................................................................................................................. 26 Thme des modules ....................................................................................................................................... 28 Conseils pour l'dition d'un thme PrestaShop ............................................................................................. 28Firebug ........................................................................................................................................................................ 28 JavaScript .................................................................................................................................................................... 28 Fichier preview.jpg ...................................................................................................................................................... 28 Normes W3C et compatibilit inter-navigateurs ........................................................................................................ 29

CREER UN MODULE PRESTASHOP .............................................................................................................................. 29 Principe des modules ..................................................................................................................................... 29 Arborescence des modules ............................................................................................................................ 29 Structure de base d'un module ...................................................................................................................... 29 Configuration d'un module............................................................................................................................ 31 Greffe d'un module........................................................................................................................................ 32 Affichage d'un module .................................................................................................................................. 33 Utilisation de Smarty ..................................................................................................................................... 36 Traduction des modules ................................................................................................................................ 37 CREER UN ONGLET DANS LE BACK-OFFICE, AINSI QUE SA CLASSE....................................................................................... 39 EN CAS DE PROBLEME .................................................................................................................................... 40 FORUM OFFICIEL PRESTASHOP .................................................................................................................................. 40 OUTIL DE RAPPORTS DE BUGS : LE "BUG TRACKER" ....................................................................................................... 40 POSTER SUR LE FORUM ............................................................................................................................................ 41 SOUMETTRE UN BUG DANS LE BUG TRACKER ............................................................................................................... 41 SITES OFFICIELS PRESTASHOP ......................................................................................................................... 41

Pour toute question, suggestion ou correction concernant ce document, merci de contacter PrestaShop : [email protected]/41

PrestaShop

v1.0 20 aot 2010

Documentation Documentation technique de la solution e-commerce open-source PrestaShopDfinitionsBack Office / BO / Panneau d'administration Le Back Office (BO) est la partie d'un site permettant l'administrateur de le grer, par opposition au Front Office qui constitue l'interface avec l'utilisateur. Pour un site d'e-commerce, on peut galement parler d'arrire-boutique. Le commerant peut y grer ses produits, les clients, les commandes, le paramtrage, etc. Front office / FO Le Front Office (FO) est la partie d'un site destine aux utilisateurs, c'est--dire aux clients pour un site d'e-commerce. L'interface destine l'administrateur est quant elle appele Back Office. Open-Source La dsignation Open-Source s'applique aux logiciels dont la licence respecte des critres prcisment tablis par l'Open Source Initiative, c'est--dire la possibilit de libre redistribution, d'accs au code source et de travaux drivs.

Introduction gnrale et philosophie du projetPrestaShop est un logiciel e-commerce Open-source qui est tlchargeable gratuitement depuis l'adresse Internet http://www.prestashop.com. Le logiciel est dit par une socit franaise base Paris, du nom de PrestaShop galement. Une quipe de quinze personnes travaille sans relche pour fournir un logiciel de qualit, le plus complet possible sur les plans fonctionnels et techniques. Le projet est financ par des services spcifiques aux marchands (personnalisation graphique, dveloppements techniques...) et galement par deux projets :

Le projet est financ par : des services spcifiques aux marchands (personnalisation graphique, dveloppements techniques...), des formations de 4 types : dveloppement (PHP, MySQL) avec PrestaShop, intgration (XHTML, CSS, Smarty) avec PrestaShop, optimisation de son rfrencement avec PrestaShop, utilisation du Back-office PrestaShop, et galement par deux projets : www.prestastore.com La boutique officielle pour PrestaShop (thmes, modules, logos). www.prestabox.com Une solution d'hbergement cl en main pour le logiciel PrestaShop. Les matres mots du projet PrestaShop sont : Simplicit4/41

PrestaShop

v1.0 20 aot 2010

Efficacit Souplesse Rapidit Chaque utilisateur du logiciel PrestaShop peut contribuer selon ses envies et ses moyens : En traduisant le logiciel dans de nouvelles langues, En effectuant un don permettant de faire progresser le projet (http://www.prestashop.com/fr/donate/), En participant au forum communautaire (http://www.prestashop.com/forums/), ... PrestaShop regroupe aujourd'hui plus de 40 000 marchands travers le monde et progresse grands pas, fort d'une communaut trs active de plus de 100 000 membres.

Pr-requis techniquesPrestaShop est un logiciel conu avec le langage de programmation PHP 5 et le systme de base de donnes MySQL 5. Pour l'installer vous aurez besoin d'un serveur web (Apache, IIS), vous pouvez galement utiliser un systme "tout-en-un" tel que WAMP, MAMP ou encore EasyPHP. Ces lments techniques sont supports par 99% des hbergeurs Internet, et vous parviendrez donc installer PrestaShop facilement quel que soit votre hbergeur.

Installer PrestaShop Installation locale ou distante ?Pour que votre boutique soit accessible depuis Internet, elle devra tre installe sur un serveur distant, par exemple chez un hbergeur. Dans ce cas, vrifiez avant de souscrire un abonnement que celui-ci propose bien tous les pr-requis techniques cits plus haut. L'hbergeur mettra votre disposition tous les outils ncessaires la gestion de votre site (accs FTP, serveur HTTP, outil de gestion des bases de donnes MySQL tel que PHPMyAdmin, etc.). Nanmoins, avant de se lancer et d'investir dans un tel abonnement, on peut vouloir tester PrestaShop sur sa propre machine (Mac, PC, etc.). Ceci est ralisable rapidement grce des logiciels qui permettent de disposer trs simplement des pr-requis techniques. Ces logiciels "tout-en-un" sont disponibles tant sous Mac, que sous Windows ou Linux. Voici une liste non exhaustive de tels logiciels : Systme d'exploitation Linux Mac Windows Logiciel XAMPP MAMP WAMP EasyPHP URL http://www.apachefriends.org/fr/xampp.html http://www.mamp.info/en/index.html http://www.wampserver.com/ http://www.easyphp.org/

Pour plus d'informations sur l'utilisation de ces programmes, vous pouvez consulter leur documentation respective.

Tlcharger PrestaShopLa dernire archive stable de la solution PrestaShop peut tre tlcharge l'adresse : http://www.prestashop.com/fr/downloads/ Les versions rputes stables utiliser en production comportent le terme "final".5/41

PrestaShop

v1.0 20 aot 2010

D'autres versions en cours de dveloppement peuvent tre mises disposition sur cette page dans un but de tests. Elles sont alors identifies par les mots "alpha", "beta" ou "RC". Il est vivement dconseill d'utiliser ces versions en production.

Copier les fichiers d'installationUne fois l'archive tlcharge, en extraire le contenu. Vous obtenez un dossier prestashop renfermant tous les dossiers et fichiers de la solution. Copiez l'ensemble de ces lments sur votre site, soit la racine, soit dans un sous-dossier. Il est conseill de garder prcieusement l'archive tlcharge ayant servi l'installation de votre boutique. En effet, en cas de problme majeur et en l'absence de sauvegardes, vous pourriez en avoir besoin ultrieurement pour rinstaller ou restaurer un fichier corrompu.

Vrifier les permissionsAssurez-vous que les dossiers suivants aient bien les permissions en lecture/criture, galement appeles CHMOD 666, de faon non rcursive, c'est--dire appliques au dossier lui-mme mais pas aux sous-dossiers : /config /download /tools/smarty/compile /upload Assurez-vous que les dossiers suivants aient bien les permissions en lecture/criture, de faon rcursive : /img /mails /modules /themes/prestashop/lang /translations

Crer la base de donnesLors de la validation de la troisime tape de l'installation de PrestaShop, les tables ncessaires au fonctionnement de la solution seront cres au sein de la base de donnes. Il est donc ncessaire de crer la base de donnes avant cette tape. Le plus simple est de crer la base de donnes avec l'outil fourni par votre hbergeur (par exemple PHPMyAdmin) ds maintenant. Exemple de cration de la base de donnes, en local, avec WAMP Pour crer une nouvelle base de donnes avec WAMP : assurez-vous que les serveurs Apache et MySQL sont lancs, connectez-vous l'adresse http://127.0.0.1/phpmyadmin/ depuis votre navigateur, dans le champ Crer une base de donnes, tapez le nom de la base de donnes crer (sans espace ni caractres spciaux). Par exemple : myshop,

cliquez sur le bouton Crer. La base de donnes est maintenant cre. Retenez le nom de la base de donnes, il devra tre saisi l'tape 3 de l'installation de PrestaShop.

Sensibilisation la sauvegardeParce que l'on n'est jamais l'abri d'un incident (mauvaise manipulation, virus, altration de donnes, etc.), il est judicieux de faire le plus souvent possible des sauvegardes de sa boutique.

PrestaShop

v1.0 20 aot 2010

Une boutique PrestaShop est constitue d'une part de dossiers et fichiers (ceux constituant la solution, mais aussi les images ajoutes par la suite, les fichiers mis disposition pour le tlchargement ou uploads par le client, etc.) et d'autre part, d'une base de donnes qui renferme les informations telles que descriptions des produits, comptes clients, commandes, etc. Il faudra donc bien prendre soin de sauvegarder ces deux parties, pour ne pas risquer de perdre la moiti de sa boutique.

Lancer l'installationLancez l'installation en accdant, depuis votre navigateur, au dossier contenant vos fichiers PrestaShop. Par exemple saisir www.myshop.com s'ils se trouvent la racine de votre site (ou localhost en local), et www.myshop.com/shop/ s'ils se trouvent dans un sous-dossier shop (ou localhost/shop/ en local).

Etape 1 BienvenueDans quelle langue souhaitez-vous effectuer l'installation ?Choisissez la langue qui sera utilise dans l'assistant d'installation. L'assistant d'installation PrestaShop est disponible dans trois langues : anglais, franais, espagnol.

Ce choix dtermine galement quelle sera la langue par dfaut du Front Office et du Back Office aprs l'installation. Des packs de langues vous permettant de traduire la fois le Front Office et le Back Office de votre boutique sont disponibles gratuitement l'adresse : http://www.prestashop.com/fr/downloads/

Mthode d'installationPour lancer une installation neuve de PrestaShop, cochez Installation complte de PrestaShop. Pour effectuer une mise jour d'une boutique PrestaShop existante vers une version plus rcente, cochez Mise jour. Si l'assistant d'installation ne dtecte pas de prcdente installation, seule l'installation complte de PrestaShop est propose.

Cliquez sur

pour valider cette tape et passer la suivante.

Etape 2 Compatibilit systmeMerci de vous assurer que chacun des paramtres ci-dessous est validTous les lments de cette liste doivent tre prcds d'une coche verte.

PrestaShop

v1.0 20 aot 2010

Si un panneau rouge apparait, c'est que la condition correspondante n'est pas respecte ; il faut alors corriger le problme. Les moyens d'y parvenir peuvent tre diffrents d'un hbergeur l'autre. Recherchez sur notre forum (http://www.prestashop.com/forums) les solutions les plus adaptes votre cas.

Paramtres optionnelsTous les lments de cette liste sont optionnels, mais il est recommand de faire en sorte qu'ils soient valids.

Si aprs avoir rsolu l'un des problmes rencontrs vous voulez revrifier votre configuration, cliquez sur le bouton Cliquez sur . pour valider cette tape et passer la suivante.

Etape 3 Configuration systmePour cette tape, la base de donnes doit avoir t cre pour que les tables puissent y tre gnres. Voir le paragraphe "Crer la base de donnes" ci-dessus pour plus de dtails.

Configuration de la base de donnes

PrestaShop

v1.0 20 aot 2010

Les quatre premiers champs Serveur, Nom de la base, Identifiant et Mot de passe permettent de paramtrer l'accs la base de donnes prcdemment cre. Dans le cas d'une boutique installe en local et de l'utilisation d'un logiciel "tout-en-un" du type LAMP (EasyPHP, WAMP, MAMP, etc.) consultez la documentation officielle de celui-ci pour savoir quels paramtres spcifier. Dans le cas d'une installation chez un hbergeur, celui-ci a d vous communiquer tous les paramtres ncessaires (par e-mail ou dans le panneau d'administration de votre compte). Le bouton permet de vrifier la bonne connexion la base de donnes. Il n'est pas possible de passer l'tape suivante tant que ce test choue. Si l'accs au serveur n'est pas possible (serveur non lanc, nom de serveur spcifi incorrect, identifiant ou mot de passe incorrects), le message suivant s'affiche :

Si la base de donnes n'a pas t trouve (base de donnes non cre, nom de base de donnes spcifi incorrect), le message suivant s'affiche :

Si les paramtres entrs sont corrects, le test sera valid par le message :

Le champ Prfixe des tables permet de spcifier le prfixe qui sera affect au nom de toutes les tables cres par l'outil d'installation PrestaShop dans la base de donnes. Ce prfixe permet de diffrencier facilement les tables de plusieurs applications qui utiliseraient cette mme base de donnes. Il est ensuite propos de choisir entre 2 modes d'installation.

Mode complet Les tables de la base sont cres, les modules essentiels installs et des donnes d'exemples (catgories, produits, clients, commandes, etc.) sont ajoutes la base. Idal pour la ralisation de tests ! Mode simple Les tables de la base de donnes sont cres, mais aucun produit exemple n'est inclus et aucun module n'est install. Aprs l'installation, le Front Office apparaitra presque vide. C'est bien entendu le mode utiliser lorsque l'on installe sa boutique dfinitive, afin qu'elle ne soit pas "pollue" par les donnes d'exemples de9/41

PrestaShop

v1.0 20 aot 2010

l'autre mode !

Paramtres d'envoi des emailsPour tester si le paramtrage d'envoi des e-mails est fonctionnel, il est possible de demander l'envoi d'un e-mail de test en spcifiant une adresse e-mail dans le champ situ en bas de page et en cliquant sur le bouton . Par dfaut, la fonction mail() de PHP est utilise pour l'envoi d'e-mails. Les utilisateurs plus avertis pourront spcifier leurs propres paramtres en cochant la case Configurer l'envoi SMTP et en remplissant les champs qui s'affichent alors. Cliquez sur pour valider cette tape. L'outil d'installation procde alors la cration des tables ncessaires au fonctionnement de la solution PrestaShop avant de passer l'tape suivante. Ceci peut prendre quelques instants.

Etape 4 Configuration boutiqueNom de la boutiqueSaisissez le nom de votre nouvelle boutique PrestaShop. Ce nom sera utilis dans la balise et apparaitra donc dans la barre systme du navigateur des visiteurs.

Pays par dfautChoisissez quel sera le pays utilis par dfaut dans votre boutique.

Logo de la boutiqueCliquez sur Parcourir pour choisir sur votre disque dur l'image correspondant au logo de votre boutique. Ce champ est optionnel et vous pourrez ajouter votre logo plus tard, depuis le Back Office (Back Office >> Prfrences >> Apparence).

PrnomPrnom de l'administrateur de la boutique.

NomNom de l'administrateur de la boutique.

Adresse e-mailAdresse e-mail de l'administrateur de la boutique. Cette adresse sera utilise comme identifiant de connexion au panneau d'administration de la boutique.

Mot de passe de la boutiqueMot de passe de l'administrateur de la boutique. Celui-ci doit comporter au minimum 8 caractres, uniquement des lettres, des chiffres ou des tirets : - _ Confirmez le mot de passe Saisissez nouveau le mot de passe de l'administrateur de la boutique pour vrification. Recevoir mes informations par e-mail Si vous dsirez recevoir vos identifiants de connexion par e-mail, cochez cette case.10/41

PrestaShop

v1.0 20 aot 2010

Etape 5 Installation termine !Cette dernire tape vous rcapitule quelques informations fournies prcdemment (nom de la boutique, nom, prnom et e-mail de l'administrateur). Vous pouvez d'ores et dj accder votre boutique en cliquant sur le cadre Front Office. Si vous avez choisi l'installation simple, celle-ci peut avoir l'aspect d'une page presque vide.

Un clic sur le cadre Back Office vous conduit votre panneau d'administration.

Mais pour l'instant celui-ci ne vous permet pas de vous connecter. Il vous invite, pour des raisons de scurit, supprimer le dossier install et renommer le dossier admin.

On vitera un nom trop simple dcouvrir, tel que admin2. Il faut faire ces oprations manuellement dans le dossier d'installation de votre boutique, soit sur votre disque dur pour une installation en local, soit via votre client FTP si l'installation s'est faite sur un serveur distant.11/41

PrestaShop

v1.0 20 aot 2010

Si vous tentez maintenant d'accder votre panneau d'administration en recliquant sur le cadre Back Office, vous obtiendrez une erreur 404 "Page non trouve" car en renommant le dossier, nous avons modifi son chemin d'accs. Pour y accder, il suffit de remplacer dans la barre d'adresse de votre navigateur le dossier admin par le nom que vous lui avez donn. Exemple en local Exemple en ligne Remplacer : http://127.0.0.1/shop/admin par : http://127.0.0.1/shop/admin567 Remplacer : http://myshop.com/shop/admin par : http://myshop.com/shop/admin567

Vous avez alors accs au formulaire de connexion au panneau d'administration de votre nouvelle boutique PrestaShop.

Saisissez alors l'adresse e-mail et le mot de passe spcifis l'tape 4 de l'installation.

Personnalisez votre boutiqueEnfin, cette cinquime tape de l'assistant d'installation vous propose de dcouvrir les multiples faons de personnaliser votre boutique PrestaShop, tant au niveau de l'aspect que des fonctionnalits grce aux nombreuses contributions disponibles sur PrestaStore.com, la place de march de PrestaShop : www.prestastore.com

PrestaShop

v1.0 20 aot 2010

Mise jour de PrestaShop PrcautionsLa mise jour tant une opration dlicate affectant la fois les fichiers et la base de donnes de votre boutique PrestaShop, il est vivement conseill de s'exercer auparavant en effectuer une sur une boutique de tests.

SauvegardeSauvegarde de vos traductionsPour exporter vos traductions, utilisez l'outil du panneau d'administration de PrestaShop prvu cet effet :

Slectionnez la langue exporter puis cliquez sur le bouton Exporter.

Rptez l'opration pour chaque langue exporter.

Sauvegarde de votre base de donnesSauvegardez votre base de donnes en utilisant l'outil de sauvegarde mis disposition par votre hbergeur (phpMyAdmin ou autre).

PrestaShop

v1.0 20 aot 2010

Sauvegarde de vos fichiers PrestaShopSi votre boutique PrestaShop est installe dans un sous-dossier de votre site, la future mise jour sera installe dans ce mme dossier. Pour sauvegarder les fichiers de l'ancienne version de votre boutique, renommez simplement le dossier les contenant. Par exemple, si votre boutique est situe dans un dossier myshop : /myshop renommez-le en : /myshop_old Si les fichiers de votre boutique sont installs directement la racine du site, crez un nouveau dossier : /prestashop_old et copiez y l'ensemble de votre boutique PrestaShop.

Installation de la nouvelle versionTlchargementTlchargez la dernire version finale de PrestaShop l'adresse : http://www.prestashop.com/fr/downloads/

Extraction et copieExtraire l'archive tlcharge sur votre disque dur puis transfrez-les l'aide de votre client FTP sur la racine de votre site ou dans le dossier contenant votre boutique.

Restauration des donnes depuis l'ancienne versionSi vous aviez personnalis certains lments de PrestaShop (langues, templates de mails, etc.), il vous faudra rappliquer ces modifications sur cette nouvelle installation depuis la copie de sauvegarde prcdemment ralise. Les images devront tre restaures depuis le dossier /img de l'ancienne copie vers le dossier /img de la nouvelle installation. Il vous faudra galement rinstaller les modules tiers utiliss dans votre ancienne boutique. Assurez-vous au pralable auprs du dveloppeur que ceux-ci soient compatibles avec cette nouvelle version de PrestaShop. Si vous avez t amen modifier le fichier .htaccess, rgnrez un nouveau fichier .htaccess avec l'outil :

puis ajoutez les informations contenues dans l'ancien fichier .htaccess dans le nouveau en supprimant les doublons ventuels. Si vous utilisez un thme personnalis, copiez le dossier correspondant ce thme depuis l'ancienne version : /myshop_old/themes/montheme vers la nouvelle /myshop/themes/montheme Copiez le fichier : /myshop_old/config/settings.inc.php de votre ancienne boutique vers la nouvelle : /myshop/config/settings.inc.php

Installer la mise jourLancez l'assistant d'installation depuis votre navigateur and ajoutant /install l'adresse de votre boutique :14/41

PrestaShop

v1.0 20 aot 2010

http://www.myshop.com/myshop/install Reprenez le mme processus que pour l'installation mais cette fois en cochant la case Mise jour lors de la premire tape de l'assistant d'installation.

Architecture gnralePrestaShop est un logiciel bas sur une architecture 3-tiers, comme nous le montre le schma ci-dessous :

Ce modle reprend le principe du MVC ("Modle-vue-contrleur"), en le simplifiant et en le rendant accessible tous. Notre quipe technique a fait le choix de ne pas utiliser de Framework PHP (Zend Framework, Symfony, CakePHP...) afin de permettre une plus grande lisibilit du code et une modification plus rapide. Ceci permet galement d'obtenir des performances plus leves car le logiciel contient uniquement le code PHP ncessaire son bon fonctionnement (et non un ensemble de librairies gnriques). Les avantages de l'architecture 3-tiers sont nombreux : La possibilit de comprendre facilement le code source du logiciel, Des modifications rapides et simples mettre en uvre pour les dveloppeurs, La possibilit pour les graphistes/intgrateurs de travailler dans le dossier themes sans avoir comprendre et lire du code PHP, La possibilit pour les dveloppeurs de prparer des donnes et modules complmentaires pour l'intgrateur.

Grands principes (Modules, Thmes) ModulesLe concept

PrestaShop

v1.0 20 aot 2010

Le logiciel e-commerce PrestaShop est articul autour d'un principe de modules qui rend son utilisation, sa personnalisation et son extension trs faciles. Un module est un complment PrestaShop qui permet de raliser les actions suivantes : Apporter une fonctionnalit supplmentaire PrestaShop, Afficher des lments supplmentaires sur le site (slection de produits, etc.), Communiquer avec des acteurs de l'e-commerce (guides d'achat, plateformes de paiement, logisticiens), etc. La socit PrestaShop propose gratuitement avec le logiciel plus de 50 modules vous permettant de lancer rapidement et gratuitement votre activit. Plus de 400 modules complmentaires, sont galement disponibles sur le site www.prestastore.com. Ces derniers ont t raliss par la socit PrestaShop et/ou la communaut PrestaShop et sont commercialiss des cots abordables. En tant que dveloppeur, vous pouvez galement proposer vos modules sur ce site et toucher 70% des montants lis la vente de vos crations.

Fonctionnement technique d'un moduleUn module est compos de : Un dossier du nom du module, situ dans le dossier modules de PrestaShop, Un fichier PHP du nom du module, situ dans ce mme dossier, Un fichier icne, logo.gif, reprsentant ce module, ventuellement : des fichiers .tpl, reprsentant le thme du module, ventuellement : des fichiers de langue, si ce dernier comporte du texte afficher, ventuellement : dans un dossier /themes/modules/, un dossier du mme nom que le module comprenant des fichiers TPL et fichiers de langue le cas chant. Ce dernier dossier est essentiel lors de toute modification d'un module dj existant, afin d'adapter celui-ci sans pour autant affecter les fichiers d'origine, et permet notamment de grer diffremment l'affichage d'un mme module selon le thme utilis. Exemple avec le module blockinfos disponible gratuitement dans PrestaShop :

Chaque module PrestaShop, s'il a t install par le marchand, peut intervenir sur un ou plusieurs "points d'accroche" galement appels "hook" en anglais. Un point d'accroche est la reprsentation dans la vue de l'instant auquel un traitement du module est effectu et/ou des informations affiches (exemple : dans le panier, la fiche produit, aprs la mise jour des stocks). Plus prcisment, le hook est un raccourci vers les diffrentes mthodes de l'objet Module assignes celui-ci.

Liste des points d'accroche (hooks) de PrestaShopVoici la liste des 53 points d'accroche disponibles dans PrestaShop :16/41

PrestaShop

v1.0 20 aot 2010

Front-officeHomepage et contour du siteNom du point d'accroche header Emplacement (fichier) header.php Visible par les internautes Non Description Est appel entre les balises de la page. Idal pour charger vos fichiers Javascript et CSS. Est appel dans l'en-tte de la page. Est appel lors du chargement de la colonne de gauche. Est appel lors du chargement de la colonne de droite. Est appel dans le pied de page. Est appel au centre de la page d'accueil.

top leftColumn rightColumn footer home

header.php header.php footer.php footer.php index.php

Oui Oui Oui Oui Oui

Fiche produitNom du point d'accroche extraLeft extraRight productActions Emplacement (fichier) product.php product.php product.php Visible par les internautes Oui Oui Oui Description Est appel juste au-dessus du lien "Imprimer", sous la photo. Est appel en dessous du bloc contenant le bouton "Ajouter au panier". Est appel l'intrieur du bloc contenant le bouton "Ajouter au panier", sous ce bouton. Est appel l'intrieur du bloc contenant le bouton "Ajouter au panier", en dessous de l'information "Disponibilit :". Est appel au-dessus des onglets. Est appel dans la liste des onglets tels que "En savoir plus", "Caractristiques", "Accessoires" Idal pour ajouter un onglet supplmentaire dont le contenu sera gr par le hook productTabContent. Est appel lorsque l'un des onglets est cliqu, idal pour afficher du contenu correspondant un onglet que vous auriez ajout avec le hook productTab.

productOutOfStock

product.php

productfooter

product.php

productTab

product.php

productTabContent

product.php

PanierNom du point d'accroche cart shoppingCart shoppingCartExtra Emplacement (fichier) Classe : Cart.php order.php order.php Visible par les internautes Non Oui Oui17/41

Description Est appel juste aprs la cration ou la mise jour d'un panier. Est appel en dessous du tableau listant les produits contenus dans le panier. Est appel en dessous du tableau listant les produits contenus dans le panier, en dessous des boutons de navigation.

PrestaShop

v1.0 20 aot 2010

createAccountTop

authentication.php

createAccountForm createAccount

authentication.php authentication.php

Oui Non

Est appel dans le formulaire de cration d'un compte client, au-dessus du bloc "Vos informations personnelles". Est appel dans le formulaire de cration d'un compte client, au-dessus du bouton "S'inscrire". Est appel juste aprs la cration d'un compte client. Est appel sur l'accueil du compte client, en bas de la liste des liens disponibles. Idal pour ajouter un lien au sein de cette liste. Est appel dans le bloc "Mon compte" en colonne de gauche, en bas de la liste des liens disponibles. Idal pour ajouter un lien au sein de cette liste. Est appel juste aprs l'identification d'un client, uniquement si l'identification est valide (adresse e-mail et mot de passe OK).

customerAccount

my-account.php

myAccountBlock

Module : blockmyaccount.php

authentication

authentication.php

RechercheNom du point d'accroche search Emplacement (fichier) Classe : Search.php Visible par les internautes Non Description Est appel aprs chaque recherche. Idal pour analyser et/ou exploiter les recherches (et rsultats de recherche) effectues par vos clients.

Choix d'un transporteurNom du point d'accroche Emplacement (fichier) Visible par les internautes Description Est appel en dessous de la liste des transporteurs disponibles lors du processus de commande. Idal pour ajouter un transporteur ayant t dvelopp sous la forme d'un module (exemple : Transporteur relais colis).

extraCarrier

order.php

PaiementNom du point d'accroche Emplacement (fichier) Visible par les internautes Description Est appel pour constituer la liste des moyens de paiements disponibles lors du processus de commande. Idal pour permettre le choix d'un module de paiement que vous auriez dvelopp. Est appel lors du retour sur la boutique aprs paiement. Idal pour afficher un message de confirmation et/ou des prcisions relatives au paiement. Identique paymentReturn (doublon). Est appel lors du retour sur la boutique aprs paiement. Idal pour afficher un message de confirmation et/ou des prcisions relatives au paiement. Est appel lors de l'affichage de la liste des moyens de paiement disponibles. Idal pour rediriger l'acheteur au lieu de

payment

order.php

paymentReturn

order-confirmation.php

orderConfirmation

order-confirmation.php

backBeforePayment

order.php

Non18/41

PrestaShop

v1.0 20 aot 2010

lui afficher cette liste Checkout 1-click PayPal).

(Exemple :

Retours marchandisesNom du point d'accroche orderReturn Emplacement (fichier) order-follow.php Visible par les internautes Non Description Est appel lorsqu'une demande de retour de marchandises est effectue par le client, uniquement si aucune erreur n'est rencontre. Est appel lors de l'affichage d'une facture au format PDF. Idal pour afficher du contenu dynamique ou statique au sein de cette facture.

PDFInvoice

Classe : PDF.php

Back-office et traitements annexesGnralNom du point d'accroche backOfficeTop Emplacement (fichier) header.inc.php Visible par les internautes Oui Description Est appel dans l'en-tte, au-dessus des onglets. Est appel entre les balises de la page. Idal pour charger vos fichiers Javascript et CSS. Est appel dans le pied de page, au-dessus de la mention "Powered By PrestaShop". Est appel au centre de la page d'accueil.

backOfficeHeader

header.inc.php

backOfficeFooter backOfficeHome

footer.inc.php index.php

Oui Oui

Commandes et dtail de commandesNom du point d'accroche newOrder paymentConfirm updateOrderStatus postUpdateOrderStatus cancelProduct Emplacement (fichier) Classe : PaymentModule.php Classe : Hook.php Classe : OrderHistory.php Classe : OrderHistory.php AdminOrders.php Visible par les internautes Non Non Non Non Non Description Est appel lors de la cration d'une nouvelle commande, aprs la cration. Est appel lorsque le statut d'une commande passe "Paiement accept". Est appel lors du changement de statut d'une commande, avant le changement. Est appel lors du changement de statut d'une commande, aprs le changement. Est appel lorsqu'un produit est supprim d'une commande, aprs la suppression. Est appel sur le dtail d'une commande, avant le bloc relatif aux informations du client. Est appel sur le dtail d'une commande, aprs le bloc relatif aux informations du client. Est appel lors de la cration d'un avoir, aprs la cration.

invoice

AdminOrders.php

adminOrder orderSlip

AdminOrders.php AdminOrders.php

Oui Non

Produits19/41

PrestaShop

v1.0 20 aot 2010

Nom du point d'accroche addproduct updateproduct deleteproduct

Emplacement (fichier) AdminProducts.php AdminProducts.php Classe : Product.php Classe : PaymentModule.php Classe : Product.php AdminProducts.php

Visible par les internautes Non Non Non

Description Est appel lorsqu'un produit est cr ou dupliqu, aprs la cration/duplication. Est appel lorsqu'un produit est mis jour avec l'ajout d'une nouvelle photo, aprs la mise jour. Est appel lorsqu'un produit supprim, avant la suppression. est

updateQuantity

updateProductAttribute watermark

Non Non

Est appel lors de la validation d'une commande dont le statut n'est pas "Annul" ou "Erreur de paiement", pour chaque produit de la commande. Est appel lors de la mise jour d'une dclinaison de produit, aprs la mise jour. Est appel lors de l'ajout d'une image sur un produit, aprs l'ajout.

StatistiquesNom du point d'accroche GraphEngine GridEngine AdminStatsModules Emplacement (fichier) Classe : ModuleGraph.php ModuleGridEngine.php AdminStatsTab.php Visible par les internautes Oui Oui Oui Description Est appel lors de l'affichage d'un graphique de statistiques. Est appel lors de l'affichage d'une liste de donnes statistiques. Est appel lors de l'affichage de la liste des modules de statistiques.

ClientsNom du point d'accroche adminCustomers Emplacement (fichier) AdminCustomers.php Visible par les internautes Oui Description Est appel sur le dtail d'un client, aprs la liste des groupes de clients auxquels il appartient.

TransporteursNom du point d'accroche updateCarrier Emplacement (fichier) AdminCarriers.php Visible par les internautes Non Description Est appel lors de la mise jour d'un transporteur, aprs la mise jour.

Lorsqu'une page du site e-commerce est affiche, pour chacun des points d'accroche qui la composent, le moteur PrestaShop vrifie quels sont les modules appeler.

PrestaShop

v1.0 20 aot 2010

Voici un rcapitulatif de l'architecture modulaire de PrestaShop :

ThmesLe conceptLe logiciel e-commerce PrestaShop propose un systme de thmes afin de permettre aux marchands une personnalisation leurs couleurs. Ce systme est articul autour d'un moteur de templates appel Smarty (http://www.smarty.net). Ce dernier permet aux intgrateurs de dvelopper facilement, sans connaissances techniques particulires, leur propre thme. PrestaShop propose en standard un thme neutre, aux tons gris, permettant aux marchands de dmarrer facilement et gratuitement, quel que soit leur secteur d'activit. Plus de 100 thmes PrestaShop sont galement disponibles sur le site www.prestastore.com. Ces derniers ont t raliss par la socit PrestaShop et/ou la communaut PrestaShop et sont commercialiss des cots abordables. En tant que graphiste/intgrateur, vous pouvez galement proposer vos thmes sur ce site et toucher 70% des montants lis la vente de vos modules.

Fonctionnement technique d'un thmeUn thme PrestaShop est un ensemble de fichiers vous permettant de modifier l'apparence de votre boutique. Voici les informations importantes noter : L'ensemble des fichiers relatifs un thme graphique est situ dans le dossier /themes. Chaque thme est reprsent par un sous-dossier portant le nom du thme. Chaque thme est constitu de fichiers template (.tpl), d'images (.gif, .jpg, .png), d'une ou plusieurs feuilles de style CSS et parfois de fichiers JS.21/41

PrestaShop

v1.0 20 aot 2010

Chaque thme comporte un fichier preview.jpg dans son dossier, ce qui permet au marchand d'avoir un aperu du thme dans le Back-office et galement de slectionner ce thme. Voici un aperu de l'arborescence d'un thme PrestaShop : Le dossier css contient les fichiers relatifs aux styles CSS du thme. Le dossier img contient les fichiers relatifs aux images du thme. Le dossier js contient les fichiers relatifs aux Javascript du thme. Le dossier lang contient les traductions du thme. Pensez mettre les bons droits (ex : CHMOD 666) afin que l'outil de Back-office puisse enregistrer les traductions. La racine du thme contient uniquement les fichiers .tpl (templates Smarty) ainsi que le fichier preview.jpg. Note : les dossiers css, img et js ne sont pas indispensables au fonctionnement d'un thme personnalis.

La gestion des traductionsPour l'ensemble des textes contenus dans vos fichiers .tpl, vous devez inclure la balise suivante : {l s='Mon texte'} Ceci vous permettra de traduire facilement ces textes via l'onglet : section Modifier les traductions du Back-office PrestaShop.

Transmettre des informations (donnes) un thme PrestaShopVoici un schma de fonctionnement de la transmission de donnes entre le cur de PrestaShop et les thmes PrestaShop. L'appel la fonction l, dans hello.tpl, permet d'afficher le texte dans la langue choisie, si celui-ci a t traduit comme indiqu ci-dessus.

PrestaShop

v1.0 20 aot 2010

L'arborescence de PrestaShopNotre quipe technique a souhait sparer de faon claire et intuitive les diffrents lments du logiciel. Voici une prsentation de chaque dossier de l'arborescence de PrestaShop : admin : contient l'ensemble des fichiers relatifs au Back-office de PrestaShop. Il vous sera demand de le renommer aprs l'installation de PrestaShop pour plus de scurit. Important : nous vous recommandons galement de protger ce dossier via un fichier .htaccess/.htpasswd ! classes : contient l'ensemble des fichiers relatifs au modle objet de PrestaShop. Chaque fichier reprsente une classe (un objet) et ses proprits/mthodes. config : contient les fichiers de configuration de PrestaShop. Sauf cas exceptionnel, vous n'avez pas les diter manuellement, ces derniers sont grs par l'outil d'installation et le Back-office. css : contient les fichiers CSS qui ne sont pas relatifs aux thmes. Il s'agit donc par exemple des fichiers CSS du Back-office. docs : contient de la documentation et doit tre supprim si vous travaillez dans un environnement de production. download : contient vos produits dmatrialiss (exemple : pdf, mp3). img : contient l'ensemble des images, icnes et photos de PrestaShop, hormis ceux des thmes. Vous y trouverez donc les photos des catgories de produit (sous-dossier c), celles des produits (sous-dossier p) ou encore celles du Back-office (sous-dossier admin). install : contient l'ensemble des fichiers relatifs l'outil d'installation de PrestaShop. Il vous sera demand de le supprimer aprs l'installation de PrestaShop pour plus de scurit. js : contient les fichiers Javascript qui ne sont pas relatifs aux thmes. Il s'agit donc par exemple des fichiers Javascript du Back-office. Il contient galement le framework Javascript jQuery. mails : contient l'ensemble des fichiers HTML et TXT relatifs aux e-mails envoys depuis PrestaShop. Il y a un sous-dossier par langue disponible. C'est dans ce dossier que vous devez diter manuellement ces e-mails si vous souhaitez en modifier le contenu.23/41

PrestaShop

v1.0 20 aot 2010

modules : contient un sous-dossier par module disponible. Si vous souhaitez dsinstaller dfinitivement un module, commencez d'abord par le dsinstaller via le Back-office de PrestaShop avant de supprimer son sous-dossier ! themes : contient un sous-dossier par thme disponible. tools : contient des outils externes intgrs dans PrestaShop. On y retrouve notamment les outils suivants : Smarty (moteur de template/thme), FPDF (moteur de gnration de fichiers PDF), Swift (moteur d'envoi d'emails), PEAR Xml parser (outil PHP). translations : contient un sous-dossier par langue disponible. Si vous souhaitez modifier les traductions, il faut toutefois le faire via le Back-office de PrestaShop et non directement dans ces dossiers ! upload : contient les fichiers qui auraient t transmis par les clients lors de l'achat de produits personnalisables (exemple : la photo d'un client qui doit tre imprime sur un mug).

Bonnes pratiques respecter (dveloppeurs, intgrateurs)Voici une liste non exhaustive de bonnes pratiques respecter : 1. Lors de la cration d'un thme, ne mlangez jamais du code XHTML et du code PHP. 2. Lors de la cration d'un thme, ne mlangez jamais du code XHTML et du code CSS, placez son code dans un fichier CSS spar. 3. n'effectuez jamais de requte SQL dans un contrleur PHP (fichiers .php la racine de PrestaShop), privilgiez l'utilisation des mthodes existantes dans les classes PHP et/ou crez de nouvelles mthodes dans ces classes. 4. Validez votre code XHTML et votre code CSS grce au validateur W3C http://validator.w3.org/. 5. Vrifiez toujours si une mthode n'existe pas dj dans les classes. 6. Ne modifiez pas les fichiers du cur de PrestaShop, dveloppez un maximum sous forme de modules afin de faciliter les mises jour. 7. Respectez les normes de codes pour un code lisible et clair, facilement maintenable. 8. Commentez votre code, en anglais. 9. Mettre la boutique en maintenance via le Back-office PrestaShop lorsque vous effectuez des corrections. 10. Utilisez le navigateur Firefox ou Google Chrome et incitez les gens autour de vous en faire autant. 11. Remerciez PrestaShop en effectuant un don.

La scurisation de votre installation PrestaShopVoici quelques recommandations suivre si vous souhaitez scuriser votre boutique PrestaShop, ces dernires sont numrotes et classes par ordre de priorit : 1. Scurisez votre accs au Back-office PrestaShop : a. renommez le dossier admin aprs l'installation de PrestaShop, choisissez un nom de dossier plus compliqu avec un mlange de chiffres et lettres, b. protgez ce dossier avec un fichier .htaccess/.htpasswd, ou demandez votre hbergeur de le faire pour vous, c. n'enregistrez pas vos codes d'accs sur votre ordinateur, d. choisissez un mot de passe complexe (mlange de chiffres et de lettres) et modifiez-le rgulirement. 2. Scurisez votre installation de PHP : a. l'option "register_globals" doit tre configure sur "Off", b. l'option "magic_quotes" doit tre configure sur "Off", c. l'option "allow_include_url" doit tre configure sur "Off". 3. Supprimez systmatiquement le dossier install aprs installation ou mise jour de PrestaShop. 4. Supprimez systmatiquement les fichiers inutiles aprs installation ou mise jour de PrestaShop : a. readme_fr.txt, readme_en.txt, readme_es.txt, b. CHANGELOG, c. dossier docs. 5. Interdisez l'accs vos fichiers de thme (templates), grce un fichier .htaccess comportant le code suivant :24/41

PrestaShop order deny,allow deny from all

v1.0 20 aot 2010

Options de configuration et fine-tuning/performancesCe paragraphe vous fait dcouvrir les variables de configuration de PrestaShop qui ne sont pas gres dans le Back-office mais directement au sein des fichiers de configuration. Quatre fichiers de configuration sont prsents dans PrestaShop : config/config.inc.php : contient la configuration du cur de PrestaShop. Ce fichier est ditable manuellement. config/defines.inc.php : contient la dfinition des constantes. Anciennement contenues dans le fichier settings.inc.php. config/settings.inc.php : contient les accs votre base de donnes ainsi que votre numro de version. Ce fichier est gr directement par le Back-office de PrestaShop et l'outil d'installation. config/smarty.config.inc : contient la configuration relative l'outil Smarty (moteur de template/thme). Ce fichier est ditable manuellement.

Fichier config.inc.php Si vous tes en mode production, pensez laisser @ini_set('display_errors', 'Off'); sur Off. A l'inverse, si vous tes en phase de dveloppement, cela vous sera utile de la passer On pour dtecter d'ventuelles erreurs. Si vous tes en mode production, pensez laisser define('_PS_DEBUG_SQL_', false); sur false. A l'inverse, si vous tes en phase de dveloppement, cela vous sera utile de la passer true pour dtecter d'ventuelles erreurs.

Fichier defines.inc.php Ce fichier contient l'ensemble des emplacements des fichiers, via la mthode PHP define(). Si vous souhaitez modifier ces emplacements, n'oubliez pas de modifier les lignes correspondantes.

Fichier smarty.config.inc.php Le systme de cache de Smarty ($smarty->caching) est dsactiv car il n'est pas compatible avec le moteur dynamique de PrestaShop. IMPORTANT : le paramtre $smarty->force_compile, doit tre pass false lorsque vous mettez un site en production. Ceci vous permettra de gagner jusqu' 30% de performances sur le temps de chargement des pages. En contrepartie, lorsque vous modifierez un fichier .tpl, il vous faudra alors supprimer le contenu du dossier /tools/smarty/compile/ (sauf index.php). Le paramtre $smarty->compile_check doit tre laiss sur false. Le paramtre $smarty->debugging vous permet de bnficier d'informations de DEBUG Smarty lors de l'affichage de vos pages.

Amlioration des performances de PrestaShopVoici quelques conseils qui vous permettront d'optimiser les performances de votre installation PrestaShop. Activez le cache MySQL (ou demandez votre hbergeur de le faire) et configurez-le sur une valeur assez leve (exemple : 256M). N'oubliez pas de passer $smarty->force_compile false (lire le paragraphe "Fichier smarty.config.inc.php"). Utilisez des techniques avances d'intgration telles que le Spriting CSS : http://www.alistapart.com/articles/sprites Rpartissez vos lments statiques sur des sous-domaines diffrents afin de parallliser les flux HTTP des visiteurs. Pour cela, il faut vous rendre dans le fichier config/defines.inc.php et ajouter ceci :if ($_SERVER['REMOTE_ADDR'] != '127.0.0.1') 25/41

PrestaShop {

Documentation : documentation technique de PrestaShop define('_THEME_IMG_DIR_', 'http://img2.xxx.com/'); define('_THEME_CSS_DIR_', 'http://css.xxx.com/'); define('_THEME_JS_DIR_', 'http://js.xxx.com/'); define('_THEME_CAT_DIR_', 'http://img1.xxx.com/c/'); define('_THEME_PROD_DIR_', 'http://img1.xxx.com/p/'); define('_THEME_MANU_DIR_', 'http://img1.xxx.com/m/'); define('_PS_IMG_', 'http://img1.xxx.com/'); define('_PS_ADMIN_IMG_', 'http://img1.xxx.com/admin/');

v1.0 20 aot 2010

} else { define('_THEME_IMG_DIR_', _THEMES_DIR_._THEME_NAME_.'/img/'); define('_THEME_CSS_DIR_', _THEMES_DIR_._THEME_NAME_.'/css/'); define('_THEME_JS_DIR_', _THEMES_DIR_._THEME_NAME_.'/js/'); define('_THEME_CAT_DIR_', __PS_BASE_URI__.'img/c/'); define('_THEME_PROD_DIR_', __PS_BASE_URI__.'img/p/'); define('_THEME_MANU_DIR_', __PS_BASE_URI__.'img/m/'); define('_PS_IMG_', __PS_BASE_URI__.'img/'); define('_PS_ADMIN_IMG_', _PS_IMG_.'admin/'); }

Installez un cache d'opcode (ou demandez votre hbergeur de le faire), PrestaShop est compatible avec eAccelerator : http://www.eaccelerator.net/. Ceci devrait vous permettre de gagner nettement en termes de charge processeur.

Travaux pratiques Crer un thme PrestaShopThme par dfaut PrestaShopLe thme par dfaut de PrestaShop a t conu dans un style neutre pour s'adapter tout secteur de l'e-commerce. De plus, ce thme respecte scrupuleusement les normes du W3C et a t optimis pour s'afficher correctement dans tous les navigateurs les plus utiliss. Malgr tout, vous pouvez vouloir modifier le thme de votre boutique afin de l'adapter votre activit. Le plus simple est de partir d'un thme existant.

Crer un nouveau thmeLes thmes sont situs dans le dossier /themes/ ; c'est donc dans ce dossier que l'on devra placer les diffrents thmes pouvant tre appliqus la boutique. On y trouve d'ailleurs un sous-dossier prestashop correspondant au thme PrestaShop par dfaut. C'est de ce thme que nous allons partir pour crer un nouveau thme. Nanmoins, il est fortement conseill de conserver intact le thme PrestaShop par dfaut. L'une des raisons est que la modification du thme peut gnrer des bugs et le fait de remplacer temporairement le thme personnalis par le thme PrestaShop par dfaut permet ainsi de vrifier si le problme provient du thme personnalis ou non. Si le problme ne survient plus avec le thme PrestaShop par dfaut, c'est que le thme personnalis en est la cause. Nous allons donc dupliquer le dossier /themes/prestashop/ et nommer ce dossier, par exemple, /themes/montheme/. Le thme par dfaut sera ainsi conserv intact.

Arborescence d'un thmeFichier / Dossier preview.jpg Description Image utilise en tant qu'aperu dans la section de la page Panneau d'administration >> Prfrences >> Apparence. La prsence de cette image est obligatoire, sinon le thme ne peut tre slectionn26/41

PrestaShop

v1.0 20 aot 2010

dans cette section. 404.tpl address.tpl addresses.tpl authentication.tpl best-sales.tpl breadcrumb.tpl category-tree-branch.tpl category.tpl cms.tpl contact-form.tpl discount.tpl errors.tpl footer.tpl header.tpl history.tpl identity.tpl index.tpl maintenance.tpl manufacturer-list.tpl manufacturer.tpl my-account.tpl new-products.tpl order-address.tpl order-carrier.tpl order-confirmation.tpl order-detail.tpl order-follow.tpl order-payment.tpl order-return.tpl order-slip.tpl order-steps.tpl pagination.tpl password.tpl prices-drop.tpl product-list.tpl product-sort.tpl product.tpl scenes.tpl search.tpl Page affiche lorsque la page demande n'est pas trouve (erreur 404). Page d'ajout ou de modification d'une adresse client. Page listant les adresses d'un client. Page d'identification et de cration de compte. Page listant les meilleures ventes. Chemin de navigation (fil d'Ariane). Utilis uniquement pour le bloc Catgories. Page listant les produits au sein d'une catgorie. Pages informatives (onglet Outil >> CMS du BO). Page du formulaire de contact. Page listant les bons de rduction d'un client. Est appel par l'ensemble des pages. Affiche les erreurs. Pied de page. En-tte de page. Page listant les commandes d'un client. Page de modification des informations personnelles d'un client. Page d'accueil. Page de mise en maintenance du site. Page listant les fabricants. Page listant les produits d'un fabricant. Page d'accueil du compte d'un client. Page listant les produits dernirement ajouts. Page du processus de commande : tape 1 choix des adresses (livraison, facturation). Page du processus de commande : tape 2 choix du mode de livraison. Page de confirmation de commande (aprs paiement). Page de dtail d'une commande d'un client. Page de demande d'un retour produit pour un client. Page du processus de commande : tape 3 choix du mode de paiement. Page de dtail d'un retour d'un client. Page listant les avoirs d'un client. Barre d'volution du processus de commande. Est appel par l'ensemble des pages listant des produits. Boutons permettant de changer de page dans une liste de produits. Page de changement de mot de passe d'un client. Page listant les promotions. Est appel par l'ensemble des pages listant des produits. Liste des produits. Est appel par l'ensemble des pages listant des produits. Menu permettant de filtrer une liste de produits. Page de dtail d'un produit. Page de dtail d'une scne au sein d'une catgorie de produits. Page listant les rsultats d'une recherche.27/41

PrestaShop

v1.0 20 aot 2010

shopping-cart-productline.tpl shopping-cart.tpl sitemap.tpl supplier-list.tpl supplier.tpl thickbox.tpl css

Page de dtail d'une ligne du panier. Page listant les produits dans le panier d'un client. Page de plan du site. Page listant les fournisseurs. Page listant les produits d'un fournisseur. Page de zoom d'une photo d'un produit. Contient les feuilles de style du thme. Le fichier global.css concerne la mise en forme de la majeure partie du site. A moins que vous ne soyez un utilisateur averti, il est conseill de laisser les fichiers d'origine. Contient les images du thme. Remplacez les images adquates par vos crations personnelles. A moins que vous ne soyez un utilisateur averti, il est conseill de laisser les fichiers d'origine. Scripts JavaScript utiliss dans le thme. A moins que vous ne soyez un utilisateur averti, il est conseill de laisser les fichiers d'origine. Fichiers de traduction. Ces fichiers sont gnrs par le Back Office et leur contenu doit tre modifi depuis l'outil Panneau d'administration >> Outils >> Traductions, section Modifier les traductions.

Thme des modulesCertains modules possdent leurs propres fichiers .tpl. Si vous crez votre propre thme, il vous faudra galement adapter celui des modules. Vous pouvez le faire sans modifier les fichiers originaux des modules. Pour cela, dans le dossier de votre thme, crez un dossier modules : /themes/montheme/modules/ et copiez-y les dossiers des modules retravailler. Dans ces dossiers, ne conservez que les fichiers .tpl que vous modifierez selon vos besoins. Ces lments seront utiliss prioritairement sur les originaux.

Conseils pour l'dition d'un thme PrestaShopFirebugPour vous faciliter grandement le travail d'intgration, nous vous conseillons de vous familiariser avec l'add-on Firebug pour Firefox qui vous permettra de dlimiter rapidement chaque bloc et d'afficher les proprits CSS qui s'y appliquent. Lien utile : http://www.prestashop.com/forums/viewthread/16736

JavaScriptLes fonctions JavaScript doivent tre stockes dans le dossier js.

Fichier preview.jpgUne fois votre thme termin, ne pas oublier d'en faire une capture d'cran, de la redimensionner, puis de copier le fichier la place du fichier preview.jpg dj prsent dans le thme. Pour faire une capture d'cran d'une page Web complte dont la taille est plus grande que l'cran, il peut tre trs pratique d'utiliser un add-on de Firefox tel que FireShot ou ScreenGrab.

PrestaShop

v1.0 20 aot 2010

Normes W3C et compatibilit inter-navigateursIl est judicieux de vrifier la compatibilit des pages de votre thme avec les normes du W3C l'aide du validateur propos par cet organisme l'adresse http://validator.w3.org/. Enfin, testez l'affichage des diffrentes pages de votre thme dans les navigateurs les plus utiliss (Firefox, Internet Explorer, Chrome, Safari, Opera).

Crer un module PrestaShopPrincipe des modulesLes modules sont idals pour laisser s'exprimer ses talents de dveloppeur et son imagination, tant les possibilits de crations sont nombreuses. Les modules peuvent afficher du contenu (blocs, textes, etc.), raliser des traitements (mise jour en masse, import, export, etc.), s'interfacer avec d'autres logiciels, etc. On peut rendre ses modules plus ou moins configurables. Plus le module que vous crez est paramtrable, plus il sera souple dutilisation et donc rpondra aux besoins d'un plus grand nombre de personnes. L'un des intrts essentiels d'un module est d'ajouter la solution des fonctionnalits sans modifier le cur de celle-ci, ceci afin de faciliter une ventuelle future mise jour qui crasera les modifications apportes au cur. Pour cette raison, et dans la mesure du possible, le dveloppement d'un module devra toujours viter au maximum de modifier le cur de la solution. Ceci est malheureusement parfois invitable pour le dveloppement de certaines fonctionnalits.

Arborescence des modulesLa solution PrestaShop contient un dossier /modules dans lequel sont regroups tous les modules ; il s'agit aussi bien des modules fournis dans la solution de base que des modules tiers ajouts ultrieurement. Chaque module est stock dans un sous-dossier distinct l'intrieur du dossier /modules (bankwire, birthdaypresent, etc.).

Structure de base d'un moduleLa structure de base est simple et similaire pour chaque module, facilitant ainsi l'implmentation de nouveaux modules. Pour la dcrire, nous allons crer pas pas un module rudimentaire. Cet exemple sera volontairement dvelopp en anglais. En effet, d'une part dvelopper en anglais est une bonne habitude prendre, et d'autre part, le systme de traduction de PrestaShop tant souple et puissant, il sera ais plus tard de raliser la traduction du module, chose que nous verrons plus bas.29/41

PrestaShop

v1.0 20 aot 2010

Nous appellerons notre module "My module".

Pour dbuter la cration d'un module, commenons par crer le dossier qui le contiendra. Celui-ci porte le nom que l'on souhaite donner au module. Ce nom ne doit contenir que des lettres, chiffres ou tirets (-_) tout en minuscules.

Ce dossier doit contenir un fichier PHP charg du traitement des donnes. Ce fichier porte le mme nom que le dossier parent. Ce fichier est suffisant pour crer un module lmentaire. D'autres fichiers et sous-dossiers pourront venir en complment. Un fichier TPL sera utile en cas d'affichage de donnes dans le Front Office. Les fichiers TPL doivent tre situs la racine du module. Les fichiers TPL peuvent porter n'importe quel nom. Lorsqu'il n'y en a qu'un, on le nomme souvent comme le module, mais il vaut mieux prendre l'habitude de leur donner des noms explicites.

Le fichier mymodule.php va contenir la classe de notre module. Celle-ci porte le nom donn au module, et donc au rpertoire parent. De plus, cette classe hrite de la classe Module (/classes/Module.php) ou de n'importe quelle classe drive (PaymentModule, ModuleGridEngine, ModuleGraph) mettant ainsi notre disposition quelques proprits et mthodes.Fichier mymodule.php

public function __construct()

Constructeur de la classe.$this->name = 'mymodule';

Attribution d'un nom notre instance de classe.$this->tab = 'Test';

Titre du tableau qui contiendra le module dans la liste des modules du Back Office. Il peut s'agir d'un nom dj existant (Products, Blocks, Stats) ou d'un nom personnalis. Dans ce dernier cas, un nouveau tableau sera cr avec ce titre.$this->version = '1.0';

Numro de version du module, affich dans la liste des modules.30/41

PrestaShop parent::__construct();

v1.0 20 aot 2010

Appel du constructeur parent. Le constructeur doit imprativement tre appel avant lutilisation des mthodes $this->l() et aprs lenregistrement du nom. Dans d'anciennes versions de PrestaShop (< 1.3) on trouve ici :$this->page = basename(__FILE__, '.php');

Permet de rcuprer le nom du fichier, sans l'extension '.php'. __FILE__ est une constante magique contenant le chemin et le nom du fichier (depuis PHP 4.0.2, __FILE__ contient toujours le chemin absolu). La fonction basename() spare le nom du fichier du reste du chemin, l'argument '.php' servant supprimer ce suffixe.$this->displayName = $this->l('My module');

Nom du module affich dans la liste des modules du Back Office. Nous verrons plus loin comment rendre possible la traduction du texte 'My module'. L'appel la mthode l() est expliqu dans le paragraphe "Traduction des modules" plus bas.$this->description = $this->l('Description of my module.');

Description du module affiche dans la liste des modules du Back Office. L'appel la mthode l() est expliqu dans le paragraphe "Traduction des modules" plus bas.public function install() { if(parent::install() == false) return false; return true; }

En l'tat, cette mthode n'est pas indispensable, car elle ne fait que vrifier le retour de la mthode install() de la classe Module.php. D'ailleurs, si cette mthode tait absente, la mthode de la classe mre serait automatiquement appele et le rsultat serait donc identique. Nanmoins, nous mentionnons cette mthode ici car elle nous servira faire des contrles et des actions lors de l'installation du module (cration de table, copie de fichier, cration de variable de configuration, etc.). De la mme manire, le module pourra contenir une mthode uninstall() permettant de personnaliser la dsinstallation du module. Un exemple d'utilisation de cette mthode :public function uninstall() { Db::getInstance()->Execute('DELETE FROM `'._DB_PREFIX_.'block_cms` WHERE `id_block` ='.intval($this->id)); parent::uninstall(); }

Pour terminer notre module de base, nous allons ajouter une icne en regard du nom du module dans la liste des modules. Pour cela, il suffit de placer une image 16x16 dans le dossier du module et de l'appeler logo.gif. Le site http://www.famfamfam.com/lab/icons/silk/ propose une bibliothque importante d'icnes gratuites. Voici, dans l'onglet Panneau d'administration >> Modules, le rsultat obtenu avec le code ci-dessus.

Un clic sur le bouton fait un appel la mthode install() du module qui appelle son tour la mthode install() de la classe Module.php qui ajoute alors une occurrence la table ps_module.

Configuration d'un module31/41

PrestaShop

v1.0 20 aot 2010

Nous l'avons mentionn, il est possible de rendre un module configurable et donc adapt aux besoins d'un plus grand nombre d'utilisateurs. Pour permettre l'accs l'interface de configuration d'un module, il faut ajouter une fonction getContent() la classe de notre module.Fichier mymodule.php (extrait) public function getContent () { // Instructions de la page de configuration }

Le simple ajout ci-dessus provoque dans l'encart de notre module l'apparition d'un lien >> Configurer.

Greffe d'un modulePour qu'un module soit "accroch" un endroit du Front Office ou du Back Office, par exemple pour l'affichage d'un bloc ou pour excuter un traitement un moment prcis, il faut lui permettre d'utiliser l'un des hooks que nous avons lists plus haut. Pour cela, nous allons modifier le code de notre module comme suit.Fichier mymodule.php (extrait) public function install() { if(parent::install() == false OR !$this->registerHook('leftColumn')) return false; return true; } public function hookLeftColumn($params) { global $smarty; return $this->display(__FILE__, 'mymodule.tpl'); } public function hookRightColumn($params) { return $this->hookLeftColumn($params); } if(parent::install() == false OR !$this->registerHook('leftColumn'))

Si l'installation ou la greffe rate, on communique l'chec au cur.public function hookLeftColumn($params) { global $smarty; return $this->display(__FILE__, 'mymodule.tpl'); }

Cette mthode permet l'affichage du rendu final dans la colonne de gauche du Front Office.public function hookRightColumn($params) { return $this->hookLeftColumn($params); }

Cette mthode permet l'affichage du rendu final dans la colonne de droite du Front Office. Elle consiste ici en un simple appel la fonction hookLeftColumn(). Nous pouvons donc d'ores et dj greffer ce module sur le hook dsir et le dplacer l'emplacement souhait au sein de ce hook. Le choix du ou des hooks auxquels accrocher le module se fait dans l'onglet Panneau d'administration >> Modules >> Positions du Back Office.

PrestaShop

v1.0 20 aot 2010

Cliquer sur Greffer un module, dans le champ Module slectionner le module greffer, ici "My module" et dans le champ Greffer le module sur choisir "Left column blocks" puis valider en cliquant sur .

Attention : greffer un module sur un hook pour lequel il na aucune mthode implmente est inutile. De retour sur la page Panneau d'administration >> Modules >> Positions, dans le tableau "Left column blocks" dplacer l'encart du module "My module" l'emplacement souhait, l'aide des flches et, ou avec un glisser-dplacer.

Affichage d'un moduleNotre module va maintenant devoir afficher quelque chose dans la colonne gauche du Front Office.

PrestaShop

v1.0 20 aot 2010

Comme nous le montre Firebug, la colonne de gauche de PrestaShop est matrialise par une balise portant le nom "left_column". La fonction hookLeftColumn() va donc afficher le rendu de notre module dans cette div. Nous l'avons vu plus haut, le fichier contenant les lments afficher est dans notre cas le fichier mymodule.tpl que nous avons pass en paramtres de la mthode display() dans la mthode hookLeftColumn().return $this->display(__FILE__, 'mymodule.tpl');

ditons le fichier mymodule.tpl pour y ajouter le contenu suivant.Fichier mymodule.tpl (extrait) Welcome! 34/41

PrestaShop

v1.0 20 aot 2010

Click me!

En rechargeant la page du Front Office, nous voyons le module apparatre.

Le lien hypertexte ne mne pour le moment nulle part. Pour le tester, il suffit de crer le fichier mentionn dans mymodule.tpl, c'est--dire un fichier mymodule_page.php dans notre dossier mymodule, puis d'y ajouter du texte.Fichier mymodule_page.php Welcome to my shop!

Un clic sur le lien nous mne bien notre page, mais l'affichage n'est pas trs "PrestaShop".

Nous allons donc crer un fichier mymodule_page.tpl, dans lequel nous allons copier le contenu de notre fichier mymodule_page.php, qui dans notre cas est :Fichier mymodule_page.tpl Welcome to my shop!

Note : il est conseill de nommer vos fichiers TPL avec des noms plus explicites pour mieux les retrouver dans le Back Office de PrestaShop plus tard (en particulier au niveau des traductions). Et dans le fichier mymodule_page.php, nous allons bien sr appeler le fichier TPL nouvellement cr pour que Smarty se charge de l'afficher, mais nous allons galement provoquer l'appel des fichiers TPL chargs d'afficher le reste de l'interface du Front Office, savoir les fichiers header.tpl et footer.tpl. Le code de notre fichier PHP devient donc :Fichier mymodule_page.php include('../../footer.php');

global $smarty;

Rcupre l'instance courante de Smarty. Doit tre fait avant le premier display().include('../../config/config.inc.php');

Charge la configuration de PrestaShop.include('../../header.php'); 35/41

PrestaShop include('../../footer.php');

v1.0 20 aot 2010

Appel des fichiers PHP chargs de l'affichage du reste de la mise en page, notamment en affectant chaque variable Smarty correspondant aux hooks leur contenu. Ces fichiers appellent respectivement header.tpl et footer.tpl qui effectuent le rendu final.$smarty->display(dirname(__FILE__).'/mymodule_page.tpl');

Appel de notre fichier mymodule_page.tpl pour affichage. Si nous rechargeons la page du Front Office, le rsultat est beaucoup plus sexy ! ;-)

Utilisation de SmartySmarty est le moteur de templates utilis dans PrestaShop. Il parcourt les fichiers TPL la recherche d'lments dynamiques pour les remplacer par les donnes adquates avant d'afficher le rsultat obtenu. Ces lments sont indiqus entre accolades { }. L'utilisateur peut crer ses propres variables et les utiliser dans les fichiers TPL. Par exemple, dans le fichier mymodule_page.php, on cre une telle variable.Fichier mymodule_page.php

Techguide_fr

Documents

prestashop documentation

prestashop v1

la sauvegarde

installer prestashop

telecharger prestashop

configuration boutique

creer la base

configuration systme