Quantcast
Channel: Prestashop Trucs & Astuces
Viewing all 45 articles
Browse latest View live

Améliorer le moteur de recherche Prestashop

$
0
0

Sur une boutique e-commerce, la recherche reste un élément indispensable… d’ailleurs il m’arrive encore parfois de ne « pas » trouver ce fameux moteur de recherche (oui c’est fou). La recherche par défaut de Prestashop, peut être aussi améliorée dans certains cas…

Les acheteurs pointilleux

Dans le cas présent ce sont eux qui nous intéressent, les clients sont de plus en plus « vicieux », ils cherchent les produits de manière détaillées avec le code fournisseur ou la référence EAN, cela leur permet de trouver rapidement un produit et de comparer les prix entre marchands. Du coup il faut pouvoir proposer au client un produit si celui-ci entre le code du fournisseur par exemple… mais voyons ensemble un cas concret.

La recherche sur REF1234 ne renverra aucun résultat… aie….

Le problème dans Prestashop

Pour un client, j’ai constaté que la recherche de Prestashop ne semblait pas s’effectuer sur la « référence interne » des déclinaisons, cela est un problème, car le client obtiendra zéro résultat en recherche alors qu’un produit décliné correspond dans la base de données. Ce cas se produit pour la référence « interne » pour les « déclinaisons »… Pour rectifier le problème il suffit de créer un fichier à l’emplacement suivant : « /override/classes/Search.php » avec le code ci-dessous (Testé sous 1.6) :

<?php

class Search extends SearchCore
{
	public static function getAttributes($db, $id_product, $id_lang)
	{
		if (!Combination::isFeatureActive())
			return '';

		$attributes = '';
		$attributesArray = $db->executeS('
		SELECT al.name, pa.reference FROM '._DB_PREFIX_.'product_attribute pa
		INNER JOIN '._DB_PREFIX_.'product_attribute_combination pac ON pa.id_product_attribute = pac.id_product_attribute
		INNER JOIN '._DB_PREFIX_.'attribute_lang al ON (pac.id_attribute = al.id_attribute AND al.id_lang = '.(int)$id_lang.')
		'.Shop::addSqlAssociation('product_attribute', 'pa').'
		WHERE pa.id_product = '.(int)$id_product);
		foreach ($attributesArray as $attribute)
			$attributes .= $attribute['name'] . ' ' . $attribute['reference']; // Webbax - recherche par référence déclinaison
		return $attributes;
	}
}

Attention à ne pas oublier !

Ce qu’il faut faire ensuite c’est :

  • supprimer le fichier « /cache/class_index.php » s’il existe
  • lancer la ré-indexation des produits, dans le back-office si vous utilisez la navigation à facettes

Si vous relancez à présent la recherche sur la référence de la déclinaison le produit devrait apparaitre.

Une fonction encore + optimisable

Si vous avez fait du développement spécifique sur vos déclinaisons ou que vous désirez ajouter d’autres valeurs sur la recherche de produits, il suffit d’ajouter votre champ dans la recherche. On pourrait par exemple imaginer faire la même chose avec le code EAN13 avec une syntaxe de ce style :

foreach($attributesArray as $attribute){
    $attributes .= $attribute['name'] . ' ' . $attribute['reference']; // Webbax - recherche par référence déclinaison
    $attributes .= $attribute['ean13']; // ajout la recherche sur l'ean
}

Faut-il faciliter la vie à l’acheteur ?

La grande question c’est faut-il permettre la recherche par code fournisseur ou fabriquant ? En fait tout dépend de chaque marchand… bien souvent celui-ci ne veut pas que le client puisse aller comparer chez la concurrence. A mon avis, il s’agit d’une mauvaise stratégie, le monde du web est très ouvert…  vous avez le droit de conserver cette information de manière confidentielle, mais bien souvent le client ira chercher ailleurs… sur du Google Shopping ou des comparateurs de prix…

Bilan

Personnellement je fais ce que me demande le marchand, mais il ne faut pas rêver les clients vont loin… certains n’hésitent pas à contacter le fournisseur même à l’étranger pour éviter de passer via un intermédiaire lors d’un achat. La transparence sur les fournisseurs présente à mon sens peu de risques, car si ceux-ci sont véritablement sérieux, un cartel des prix est appliqué et la vente directe (fournisseur – client) non appliquée.


Des images multilingues dans vos catégories Prestashop

$
0
0

Prestashop est bien pensé pour le multilingue… mais dans certains cas de figure on ne veut pas forcément utiliser la gestion « textuelle », mais plutôt exploiter des images. Prenons par exemple le cas pour des catégories où il y’a une demande client fréquente.

Les images des catégories

Pour commencer, il est important de rappeler que des images dans les catégories produits permettent de donner une forme d’harmonie à votre boutique. Cela permet aussi de se distinguer de la plupart des boutiques qui n’en mettent pas (car la création de bannière c’est du temps à passer). Certains clients veulent utiliser des images de catégorie traductibles, ce qui leur permet de faire des mises en page plus abouties graphiquement.

Pas toujours facile de trouver des images concordant avec le texte dynamique.

Modifions notre Prestashop

En premier lieu il faut éditer le fichier « category.tpl » présent dans votre thème localisez cette zone de code :

<!-- Category image -->
<div class="content_scene_cat_bg"{if $category->id_image} style="background:url({$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category_default')|escape:'html':'UTF-8'}) 0 top no-repeat; background-size:contain; min-height:{$categorySize.height}px;"{/if}>
    {if $category->description}
        <div class="cat_desc">
        <span class="category-name">
            {strip}
                {$category->name|escape:'html':'UTF-8'}
                {if isset($categoryNameComplement)}
                    {$categoryNameComplement|escape:'html':'UTF-8'}
                {/if}
            {/strip}
        </span>
        {if Tools::strlen($category->description) > 350}
            <div id="category_description_short" class="rte">{$description_short}</div>
            <div id="category_description_full" class="unvisible rte">{$category->description}</div>
            <a href="{$link->getCategoryLink($category->id_category, $category->link_rewrite)|escape:'html':'UTF-8'}" class="lnk_more">{l s='More'}</a>
        {else}
            <div class="rte">{$category->description}</div>
        {/if}
        </div>
    {/if}
 </div>

A la place vous mettez ceci :

{* Webbax auto-detection img *}
{assign var="img_cat" value="{$tpl_dir}/../../img/c/{$category->id_category}_{$lang_iso}.jpg"}
{if file_exists($img_cat)}
    <div class="row_category clearfix">
        {assign var="img_cat" value="img/c/{$category->id_category}_{$lang_iso}.jpg"}
        <img src="{$base_dir}{$img_cat}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" class="img-responsive" />
    </div>
{else}
    <!-- Category image -->
    <div class="content_scene_cat_bg"{if $category->id_image} style="background:url({$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category_default')|escape:'html':'UTF-8'}) 0 top no-repeat; background-size:contain; min-height:{$categorySize.height}px;"{/if}>
        {if $category->description}
            <div class="cat_desc">
            <span class="category-name">
                {strip}
                    {$category->name|escape:'html':'UTF-8'}
                    {if isset($categoryNameComplement)}
                        {$categoryNameComplement|escape:'html':'UTF-8'}
                    {/if}
                {/strip}
            </span>
            {if Tools::strlen($category->description) > 350}
                <div id="category_description_short" class="rte">{$description_short}</div>
                <div id="category_description_full" class="unvisible rte">{$category->description}</div>
                <a href="{$link->getCategoryLink($category->id_category, $category->link_rewrite)|escape:'html':'UTF-8'}" class="lnk_more">{l s='More'}</a>
            {else}
                <div class="rte">{$category->description}</div>
            {/if}
            </div>
        {/if}
     </div>
 {/if}

Le code ajoute un nouveau comportement qui va regarder dans le répertoire « img/c » du site si une image a été déposée pour la catégorie affichée… si c’est le cas, l’image définie manuellement aura la priorité d’affichage. Si aucune image n’est définie dans le répertoire, le comportement standard sera exécuté.

Ici il s’agit de la catégorie avec l’ID8, donc dans mon répertoire « img/c » je vais créer mes fichiers multilingues que je vais nommer « 8_de.jpg » et « 8_fr.jpg ». Ces images se trouveront mélangées avec les autres photos des catégories.

A présent si on regarde le résultat on a bien notre nouvelle image qui va s’afficher… avec notre texte qui varie bien selon la langue. Dans le cas présent la différence n’est pas vraiment pertinente, car j’ai injecté un texte simple, mais pour des mises en forme complexes c’est beaucoup plus pratique. Cela évite aussi d’avoir toujours un texte qui vient chevaucher l’image de manière aléatoire.

Et le référencement ? Hein !

C’est vrai que pour le référencement c’est pas vraiment top, mais qui vous a dit que vous étiez dispensé de remplir la description de la catégorie ? Vous pouvez la faire afficher en dessous de l’image avec le code suivant « {$category->description} ».  Si esthétiquement cela vous dérange, vous pouvez aussi mettre la description de la catégorie sur la balise alt & title de votre image.

Bilan

Rien de vraiment exceptionnel, mais j’ai des marchands qui écrivent dans leurs bannières… parce qu’ils font des mises en forme spéciales et que leurs clients ne s’y retrouvent plus si le texte de l’image n’est pas traduit. Cette méthode n’oblige pas à avoir forcément toutes les images des catégories traduites, vous pouvez traduire uniquement celles qui vous intéressent grâce au dépôt de l’image dans le dossier, car le comportement de base « mono-image » reste actif.

Prestashop et le gestionnaire SQL

$
0
0

Un peu par hasard j’ai vu que Prestashop proposait une nouvelle option dans sa dernière version de Prestashop 1.6.0.11, il s’agit là du gestionnaire SQL ! Mais à quoi ça sert ce nouvel outil ? Nous allons le découvrir ensemble.

Une nouvelle options dans les listes

Dans les listings du back-office de la boutique, vous avez à présent à droite deux nouveaux boutons « Voir la requête SQL » et « Exporter vers le gestionnaire SQL ». Ces fonctionnalités se retrouvent partout dans votre back-office Prestashop, à chaque emplacement où vous avez un listing d’éléments.

Deux nouveaux boutons sont apparus dans l’interface.

A quoi ça sert ?

Le premier bouton vous permet de visualiser la requête qui provoque l’affichage de cette liste, cela vous donnera donc l’information sur la manière dont sont sélectionnés les informations affichées. Cela peut aussi vous aider à établir une requête fonctionnelle si vous êtes un développeur (par ex. pour le développement d’un module).

Un « SELECT » pas si simple que ça en fait… et qui contient des jointures.

Si on utilise le deuxième bouton pour exporter vers le gestionnaire, celui-ci conduire vers un formulaire en copiant la requête que nous venons de voir ensemble. Ici par exemple il s’agit de la requête du formulaire Catalogue->Produits.

Vous pouvez conserver les requêtes dans votre gestionnaire SQL

Ensuite, dans le gestionnaire SQL (qui se trouve sous les paramètres avancés), vous pourrez retrouver la liste des requêtes que vous aurez sauvées. Dans le cas présent on en a une seule, qu’on peut par exemple exporter vers un CSV, afin de pouvoir exploiter les données.

Un moyen simple d’exporter ses données vers Excel.

On peut aussi consulter directement les résultats sur Prestashop.

Quel intérêt à cette fonctionnalité ?

Si vous êtes doué en SQL vous pourrez réaliser facilement un export basé sur une requête complexe. L’avantage aussi c’est de pouvoir mettre en place des exports pour les clients, sans devoir installer un module additionnel (quand cela est possible). Cela peut aussi faciliter l’accès aux données, au lieu de toujours demander par exemple au webmaster de devoir exporter les informations de tables spécifiques dans la base de données.

Bilan

Bien sûr que ça ne changera pas la vie du webmaster ! Par contre, pour le marchand, ça peut-être une ouverture sur l’exploitation de nouvelles données, sans craintes de faire crasher la base en passant par PHPmyAdmin. L’export fonctionne pour des besoins classiques, s’il faut apporter des traitements supplémentaires sur les données exportées, cela nécessitera dans tous les cas de passer via un export sur mesure.

Que recherchent vos clients sur votre boutique Prestashop ?

$
0
0

Proposer des produits à la vente c’est bien, mais est-ce vos clients trouvent les produits qui les intéressent… Mais la question encore peut-être encore plus flagrante, est-ce que vous proposez les produits qu’ils cherchent ? C’est parti pour le contrôle !

Le comportement de l’acheteur

Une partie des acheteurs savent précisément ce qu’ils veulent et leur comportement sera d’utiliser directement la recherche (même pas de passer via vos catégories… zéro clic en vues). Et là, le client recherche son produit… et bam ! Zéro résultat, forcément vous ne pouvez pas tout avoir… Et le client part immédiatement… Du coup il serait important de vérifier si votre offre correspond bien à la demande de vos clients.

Voilà un cas typique… une recherche qui ne donne rien, ok je vais voir ailleurs !

Analyser le comportement

Les informations tapées dans le moteur de recherche de Prestashop sont automatiquement sauvées dans la base de données. Nous allons donc par exemple nous connecter à la base de données et regarder dans PHPmyAdmin le contenu de la table « ps_statssearch » qui regroupe les informations de recherche et le nombre de résultats retournés. Dans l’exemple ci-dessous, on peut voir que 3 recherches ont retourné aucun résultat… « robe frange », « robe vintage ».

Voici les informations recherchées par vos clients…

A noter qu’il est aussi possible d’accéder au back-office de Prestashop dans l’onglet « Satistiques » -> « Recherche » pour voir le détail de ces informations. Par contre, les mots clés recherchés « une seule fois » ne sont pas listés, il peut donc y avoir un intérêt de passer directement par PHPmyAdmin.

Pour les marchands moins habitués de PHPmyAdmin, l’accès via back-office est aussi utile !

Améliorer l’offre

A présent il faudrait par exemple exporter cette table chaque mois et faire une analyse de la demande de vos clients pour les cas où il y’a eu zéro résultats. Le trafic est difficile à obtenir, il serait donc dommage que les visiteurs qui viennent chez vous ne trouvent pas le bon produit correspondant. Ce type d’analyse permettra de préconiser plutôt certains produits que d’autres lors du réapprovisionnement de votre stock. La recherche vous permettra de mieux diriger l’investissement futur de votre stock.

Calibrer les tags

Peut-être que la recherche aurait dû proposer d’autres produits équivalents à la place ? Si c’est le cas, il faut alors absolument mettre en place une gestion des tags sur vos produits. Le tags permet à votre produit de s’afficher dans une recherche, sur un mot clé défini par vos soins. Attention, dans la réalité cela fonctionnera bien uniquement si le produits est vraiment substituable… inutile d’essayer de fourguer n’importe quel article à vos clients.

J’ajoute un tag sur mon produit « robe vintage » car c’est une ré-édition ancien modèle…

Et à présent il s’affiche sur cette recherche ! Ahhhh…

Bilan

La recherche c’est toujours un élément clé pour une boutique e-commerce, mais bien souvent on laisse faire le comportement standard… A mon sens l’intérêt est vraiment important sur le contenu recherché « par vos clients ». Ces données sont précieuses, car elles peuvent vous aider à cibler des marques, des références, des couleurs & tailles que cherchent régulièrement vos clients. Alors, je vous invite à essayer de faire une petite analyse de votre côté !

Un moteur de recherche Prestashop toujours opérationnel

$
0
0

La recherche interne dans une boutique e-commerce est « primordiale », car il n’y a rien de pire pour l’acheteur que d’obtenir le message « aucun résultat ». Pourtant, le cas peut se produire si vous ne faites pas attention.

L’indexation des produits

La recherche des produits sous Prestashop, fonction grâce à un système d’indexation, c’est-à-dire que Prestashop va découper les termes de vos produits et les classer dans différentes tables de la base de données. Ensuite, la recherche se fera directement sur ces tables indexées et non pas en lien direct sur le titre ou la description du produit. Si l’indexation de la recherche n’est pas faite correctement, la recherche ne donnera aucun résultat.

Relancer l’indexation

Sous l’onglet « Préférences -> Recherche », vous pouvez relancer l’indexation. Dans la plupart des cas, vous ferez comme sur la capture ci-dessous en cliquant sur le lien « Ajouter à l’index les produits manquants » de manière à obtenir un 8/8 qui confirme que tous les produits sont dans l’index. Utilisez l’option « Reconstruire l’index » uniquement si vous avez un serveur assez puissant pour générer l’indexation en une seule traite.

Ici pas de problème, 8 sur 8 la recherche est bien opérationnelle.

Là par contre, il y’ a 230 produits qui ne sortiront pas dans la recherche… aie !

Attention à la tâche planifiée

Dans la configuration de la recherche, vous pouvez définir une tâche planifiée qui va recréer chaque jour par exemple l’index de la recherche. C’est une bonne idée, mais il faut faire attention aux capacités de votre serveur. Essayez d’exécuter le lien pour voir si celui-ci arrive à refaire l’indexation complète.

Le risque c’est de mettre en place une tâche planifiée chez votre hébergeur et que le script s’arrête après 30 secondes, du coup vous aurez par exemple seulement 400 produits indexés sur 2500… et l’indexation sera en permanence partielle. Il faudra donc éviter d’utiliser cette option et relancer l’indexation manuellement de temps à autre via le back-office.

Quand vous testez le lien de la tâche planifiée, je vous invite à activer la gestion des erreurs de Prestashop dans le fichier config. En cliquant sur le lien, vous risquez d’obtenir une page blanche et vous ne saurez pas si cela a fonctionné ou non, si vous avez le chiffre 1, cela confirme que l’opération s’est déroulée avec succès.

Ce type d’erreur à de grandes chances de survenir en mutualisé avec beaucoup de produits.

Alias de recherche

Toujours dans cette section de recherche, vous pouvez définir des « Alias », termes qui feront pointer vers un autre terme de recherche. Ce système peut-être utilisé principalement pour gérer les fautes d’orthographe courantes et de proposer un « Iphone » si l’acheteur tape « Ifone »… Encore une fois prudence sur le choix des termes, j’ai déjà remarqué que cela pouvait provoquer des conflits sur des termes de recherche avec plusieurs mots clés dont l’un comprendrait un terme du type « Alias ».

Attention… une recherche multi-termes du type « cd blues » risquerait de rechercher sous le terme « blouse » ce qui n’est pas forcément le comportement désiré.

Bilan

Le plus important c’est quand même de vérifier l’indexation de ses produits… certains marchands mettent parfois quelques mois avant de voir qu’il y a un problème dans la recherche. Logiquement Prestashop devrait toujours ré-indexer un produit lorsqu’on le modifie, mais cela ne semble pas être le cas, car certains clients saisissent tous leurs produits via le back-office et doivent tout de même lancer une indexation manuelle, car l’index reste malgré tout incomplet.

Font Awesome avec Prestashop

$
0
0

Est-ce que vous avez déjà utilisé Font Awesome sur votre boutique Prestashop ? Vous ne savez pas ce que c’est ? Il s’agit de la nouvelle génération d’icônes dynamiques, voyons ça ensemble.

Les icônes nouvelle génération

On aime ou on aime pas, mais actuellement il y’a la vague des icônes nouvelle génération avec par exemple Font Awesome qui est un des plus populaires. L’inconvénient des icônes classiques c’est que bien souvent quand il faut les retoucher, il faut passer via Photoshop par exemple pour modifier la coloration, la hauteur et cela demande beaucoup de temps. C’est d’autant plus vrai, qu’à présent il faut aussi que l’icône s’affiche par exemple sur un support mobile… mais peut-être avec une taille de 3 pixels plus petit… et justement avec Font Awesome, vous pouvez modifier cela à la volée en CSS.

Il y’a déjà beaucoup d’icônes qui couvrent la plupart des besoins pour des sites e-commerce.

Utiliser ce service dans les fiches produits

Voici une méthode vraiment simple pour se servir de ces icônes dans les fiches produit de Prestashop. Pour cela la première chose à faire c’est de modifier le fichier « header.tpl » situé à la racine de votre thème. Juste avant la balise de fermeture « </head> » ajoutez le code ci-dessous :

{* Webbax - FontAwesome *}
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

A présent je vais choisir une icône, comme par exemple le feu… il suffit donc de récupérer le code suivant ci-dessous pour l’intégrer dans le code HTML de la fiche produit.

<i class="fa fa-fire"></i>

Attention pour que cela fonctionne dans Prestashop, il faut ajouter un espace insécable comme le code ci-dessous, sinon la balise sera automatiquement retirée du code source.

<i class="fa fa-fire">&nbsp;</i>

Ensuite, dans la fiche produit, il faut basculer en mode HTML et faire l’intégration du code comme montré sur la capture ci-dessous.

Et voilà le résultat sur la fiche produit, c’est plutôt chic non ? A noter qu’il est bien sûr possible de changer la taille et la couleur, pour cela il suffit d’appliquer un style à l’élément où via une classe CSS.

Intégration plus poussée

Chez Blobmarket, une solution plus transparente est proposée pour l’intégration de Font Awesome dans Prestashop. Le but est de modifier l’appel du plugin TinyMCE, afin que celui-ci vous propose directement la gestion des icônes dans l’éditeur. Si vous avez quelques connaissances en développement & code, je vous invite à faire l’essai d’intégration (assez facile à mettre en place).

Peut-être que Prestashop l’intégrera nativement dans le futur… ça serait bien.

Quel intérêt ?

C’est sympa de mettre des icônes… mais ça sert à quoi ? Concrètement je trouve qu’il est possible de faire des fiches produits un peu plus « haut-de-gamme » grâce à ces icônes. Par exemple vous vendez du vin, vous pouvez régulièrement utiliser des icônes pour structurer le contenu pour chaque bouteille et apporter une touche « sympa » à la lecture… les images c’est ludique et l’acheteur aime. Une jolie fiche produit c’est aussi signe que vous êtes un acteur important sur votre marché.

Trop rationnel ?

C’est ce que me disent bien souvent les clients… « On peut pas mettre une autre icône ? », « On peut mettre un panier vert avec des fruits qui sortent ? », « On peut mettre une icône qui tourne… », « On peut… ». Bref, ce qu’il est important de comprendre c’est qu’actuellement on rationalise le maximum de choses possible, oui tout devient « standardisé », mais c’est aussi pour garantir un maximum de compatibilité et bien souvent le client veut faire primer le visuel « avant » la compatibilité.

Bilan

Sincèrement ces icônes simplifient bien la vie, le gros avantage c’est vraiment le fait de pouvoir gérer la même icône de manière dynamique suivant la situation. Cela n’empêche pas bien sûr d’avoir toujours de jolies icônes rassurantes en page d’accueil (qui sont des images classiques), mais quand il s’agit des icônes d’interface Font Awesome, reste une bonne pioche et facile à mettre en place.

Dans Prestashop informez vos clients de vos vacances

$
0
0

C’est un peu la période en ce moment, tout le monde s’en va en vacances… il y’a donc tout un mouvement de va et vient et pourtant les boutiques fonctionnent toujours 7/7… alors prêt à affronter les vacances ?

Votre boutique en vacances

Préparez votre absence

La plupart des e-commerçants font une pause durant l’été, mais forcément tous laissent leur boutique « ouverte » pour potentiellement avoir des commandes durant leur absence. C’est une bonne chose, mais encore faut-il en informer vos clients ? Pourquoi faire me direz-vous… finalement ils peuvent bien attendre non ? Il faut informer vos clients, par respect pour eux et aussi pour garantir des délais de livraison respectable. Rien de pire que de commander et de se trouver livré 2 voir 3 semaines plus tard.

Comment le faire ?

Actuellement je propose deux méthodes pour le faire simplement, la première vous achetez un module de Popup par exemple qui affichera votre message à l’acheteur (voir par exemple le module de chez Opart) . Si en plus vous n’avez pas de module Popup, cela vous permettra de l’utiliser pour d’autres choses… comme pour faire des promotions, annonces, soldes etc…

Le popup est une manière simple de faire passer le message.

Le popup est une manière simple de faire passer le message.

Solution Mac Gyver

Bien sûr on cherche toujours à économiser forcément… une solution que je peux aussi recommander c’est d’ajouter un message dans le header du site, de manière à ce qu’il soit permanent. Au moins le client vous pouvez être sûr qu’il aura vu le message… il ne pourra pas dire qu’il n’était pas au courant. Pour ce faire, par exemple sous Prestashop 1.6, on ouvre le header.tpl du thème et on modifie le code suivant :

<div class="header-container">
	<header id="header">

par :

<div class="header-container">
	<header id="header">
              <div id="header_msg">
                   {l s='La boutique est fermée du X au X (vacances annuelles), les envois seront effectuées à partir du X.'}
              </div>

Puis en fin de fichier global.css du thème ajoutez :

#header_msg{background-color:red;color:#fff;text-align:center;

Ensuite, vous devriez obtenir le résultat suivant… certes très sommaire, mais vous avez la base à vous de l’adapter. A noter que vous pourrez ensuite traduire le message dans le header.tpl de votre thème si vous faites du multilingue.

Un message bien visible qui sera accessible sur toutes les pages de la boutique.

Un message bien visible qui sera accessible sur toutes les pages de la boutique.

Informez le client avant vos vacances

Voilà aussi une manière de stimuler tous les indécis qui attendent.. car parfois le client met du temps à se décider et veux aussi aller comparer ailleurs. Donc une semaine avant de partir, mettez déjà le message, c’est une manière d’inciter le client à prendre connaissance qu’il pourra avoir le produit cette semaine « rapidement »… sinon il devra ensuite patienter et attendre votre retour.

Bilan

J’ai déjà vécu le cas en tant que client de faire une commande sur un site qui allait être en pause pendant 2 ou 3 semaines et ça m’avait énervé de ne pas avoir mes produits rapidement. Parfois même pour l’ambiance de la reprise (de votre côté), il est préférable d’avoir moins de commandes de clients « patients » que des clients « non-informés », qui vous ont envoyé des mails désagréables. Alors, si vous n’y avez pas pensé, c’est le moment !

Technique universelle de migration pour Prestashop

$
0
0

La grande question que vous vous posez peut-être, « c’est comment je vais faire pour migrer ma boutique » ? Bien sûr il y’a le module One Click Upgrade pour le faire, mais votre ancienne boutique doit continuer à tourner…

Migration Prestashop simple

Explication de la problématique

Vous êtes marchand, votre boutique est désuète, vous devez faire une mise à jour… Pour faire cela correctement, vous désirez travailler sur votre nouvelle boutique en développement, tout en continuant de garder votre ancienne boutique qui vous rapporte des commandes / clients. Mais du coup à un moment donné on va se trouver avec deux boutiques, la nouvelle version en mode développement qui est dépassée… et qu’il faudrait réactualiser.

Pré-requis : une règle claire à suivre

A partir du moment où vous travaillerez sur votre nouvelle boutique, sur l’ancienne en production, vous ne créerez pas de nouveaux produits, de nouvelles catégories… En finalité, l’idée est de ré-actualiser vers la boutique de développement uniquement les clients, les commandes, le stock… cette étape d’actualisation se fera tout à la fin, juste avant le passage en production.

1) Créez un clone de la boutique

La première étape est de créer un clone complet de la boutique en production, ce sera donc la boutique développement, copiez tous les fichiers présents sur le FTP et faites bien sûr une copie de la base de données, de manière à avoir une structure complètement indépendante.

2) Mettez à jour la boutique

Une fois que vous avez votre boutique développement qui fonctionne, vous pouvez faire la mise à jour de la boutique avec le module one click Upgrade. Cette étape se passe en principe assez bien et vous pouvez même migrer des vieilles versions du type 1.3 cela est pris charge.

3) Nettoyage, Thème, Modules, Produits

Une fois qu’on est à jour sous la nouvelle version de Prestashop avec la boutique développement on peut commencer par appliquer les étapes suivantes :

  • supprimer les vieux modules inutiles
  • installer un nouveau thème
  • installer les nouveaux modules
  • travailler la structure des catégories & menu
  • réviser le contenu fiches produits / images
  • ! ne pas créer de nouveaux produits

A partir de ce moment, on est donc à jour sur le plan fonctionnel… ça prend du temps, mais on a une boutique prête au niveau du contenu. Le seul problème c’est qu’on a pas la gestion des clients, commandes, stock qui sont actualisés.

4) Création d’un nouveau clone + transfert des tables

Il faudra à ce moment-là bloquer votre ancienne boutique production et la mettre en maintenance. A présent on va refaire un « nouveau » clone cette ancienne boutique de production en faisant à nouveau l’étape 1 et l’étape 2, vous aurez donc une nouvelle boutique fraichement migrée. A présent on va donc exporter les tables qui nous intéressent et les importer vers la boutique de développement.

Pour cela il suffit d’exporter toutes les tables qui commencent par :

ps_address_x
ps_birthdayvoucher
ps_cart_x
ps_customer_x
ps_loyalty_x
ps_message_x
ps_order_x
ps_rewards_x 
ps_stock_x
ps_supply_x 
ps_wharehouse_x

On fait justement cette migration pour avoir une structure de tables similaires, ce qui nous permet de faire une injection « brutale » sur la base de données de la boutique développement. Vous constatez qu’on transfert aussi le stock, c’est pour cela que je déconseille « temporairement » avant cette opération, de créer des produits sur la nouvelle boutique, dans le but qu’on puisse faire ce transfert de masse sans contraintes.

5) La boutique développement en mode production

Arrivé à ce stade on est prêt à passer en production, car les données sont actualisées. Il faut tout de même être prudent en faisant un test de commande pour voir si cela fonctionne, essayez aussi de vous connecter avec un compte client pour voir si cela correspond et si vous avez son historique.

Dans le cas présent j’ai pris des tables qui sont étroitement liées aussi au client, comme par exemple « ps_loyalty », « ps_rewards », qui sont des modules qui évoluent avec le compte du client. Il est donc important de prendre aussi ces tables liées aux clients, cela peut varier en fonction des modules que vous avez installés.

Bilan

Ces migrations / transferts de données, demandent une bonne préparation pour éviter les mauvaises surprises. Si vous devez faire cette opération pour un client, pensez à le sensibiliser au processus le plus simple et le plus sûr. Le pire c’est s’il faut migrer des différentiels de tables, des parties d’enregistrements… le risque d’incohérences est important. Avec cette méthode, celle-ci fonctionnera toujours peut importe la version et simplifie grandement le processus de migration différentiel d’une boutique.


Une piste quand le Smart Cache Prestashop ne fonctionne pas

$
0
0

Lors du passage en production d’une boutique Prestashop, il est intéressant d’activer tous les caches pour gagner de la vitesse. Même si cela n’est pas « vital », on apprécie de pouvoir diminuer le poids de la boutique.

Prestashop CCC

Qu’est-ce que le CCC ?

Dans les « Paramètres avancés -> Performances », de Prestashop il y’a une option qui concerne le Smart Cache. Pour faire court cette option va compresser le code des fichiers CSS et Javascript, afin de gagner en performance… Le fichier sera compilé sur une seule ligne et vous aurez donc des fichiers sources qui seront plus légers. Du coup quand l’acheteur affiche la page du site, vous aurez un gain de vitesse.

Une option simple à activer et qui fait gagner de la vitesse à votre boutique (+ économie de bande passante).

Une option simple à activer et qui fait gagner de la vitesse à votre boutique (+ économie de bande passante).

Ma boutique est déformée avec l’option active

Voici un cas expérimenté chez un client, avec l’activation de l’option la boutique proposait un affichage difformes. Des blocs prenaient des tailles disproportionnées, le menu n’avait pas de mise en forme convenable, le panier positionné à un emplacement indésirable. Ce problème est très pénalisant, car il est difficile d’évaluer où se situe le bug et si cela se trouve dans le coeur du comportement de Prestashop lors de la compilation.

Que ce soit sur un mobile, une tablette ou un desktop, le contenu est mal agencé , voir déformé.

Que ce soit sur un mobile, une table ou un desktop, le contenu est mal agencé , voir déformé.

La solution

Le problème se trouvera dans le fichier CSS même, la principale cause sera la mauvaise structure de celui-ci. Même avec des thèmes achetés, vous pouvez vous trouver avec des CSS qui sont corrompus et où la structure n’est pas intègre. Voici deux causes pouvant créer le problème :

  • commentaire CSS mal codé, sans espacement ex :  « /*commentaire*/ » au lieu de « /* commentaire */ »
  • des balises { ou } qui sont mal fermées

Le problème c’est que parfois la déformation se trouve par exemple sur le panier, mais n’a strictement rien à voir avec le CSS du panier, dans le fichier « global.css » par exemple, il pourrait manquer de balises fermantes. En mode navigateur classique, sans compression… le navigateur corrige à la volée le « bug », on a donc le sentiment que tout fonctionne correctement, mais cela n’est pas le cas et cela se voit immédiatement avec le cache CCC actif.

Pour trouver plus vite un bug

De mon côté j’utilise par exemple l’éditeur Netbeans, qui identifie automatiquement les erreurs sur les fichiers CSS et les signale même avant d’ouvrir le fichier en question. Si un signal rouge s’affiche, cela vaut la peine de regarder plus en détail (notez que certaines erreurs en rouge, ne sont pas forcément critiques).

Le fichier global.css semble potentiellement contenir de mauvaises règles / malformations.

Le fichier global.css semble potentiellement contenir de mauvaises règles / malformations.

Pour mieux comprendre où le fichier se déforme, il peut être bien pratique de faire appel à CSS Beautify, qui va restructurer votre fichier. Avec cela vous allez donc pouvoir consulter la nouvelle nomenclature du fichier et vous verrez certainement grâce à l’indentation qu’à un certain niveau le fichier ne devrait pas indenter 200 lignes d’affilées… du coup il y’a un problème potentiel d’accolades non fermées.

Nettoyer le CSS aide à mieux comprendre où se trouve le bug, car parfois les fichiers sources sont très touffus et denses.

Nettoyer le CSS aide à mieux comprendre où se trouve le bug, car parfois les fichiers sources sont très touffus et denses.

Bilan

Personnellement, j’ai dû tourner un moment avant de comprendre où se trouvait le bug, il était multiple sur plusieurs fichiers CSS du thème. Par exemple le fichier « category.css » pouvait provoquer la déformation du panier. Pour cela Netbeans a localisé rapidement les CSS avec des erreurs et j’ai pu les évaluer, les restructurer et ajouter les balises manquantes. A noter qu’il faut être prudent quand on ferme la balise, car parfois celle-ci font partie de règles responsives, qui encapsulent d’autres règles.

Remettre un produit en nouveauté dans Prestashop

$
0
0

Dans Prestashop le module nouveautés, affiché en homepage ou bien dans un bloc est très pratique… seulement le comportement automatique ne permet pas d’influencer si un produit est nouveau ou non.

Nouveautés sous Prestashop

Un problème récurrent

Dans le back-office de Prestashop sous la partie « Préférences -> Produits », il est possible de définir le nombre de jours qu’il faut considérer un produit comme « nouveau ». Le problème c’est que lorsque vous créez des produits à l’avance, ceux-ci ne seront peut-être plus tolérés comme « nouveau » lors de leur activation. On retrouve le même problème si on crée plusieurs produits similaires, dans les nouveautés, on se retrouve ensuite avec X fois le même produit sans pouvoir alterner l’affichage ce qui n’est pas très vendeur.

Cette option n'est pas suffisante, car il faudrait idéalement pouvoir modifier le champ date d'ajout du produit.

Cette option n’est pas suffisante, car il faudrait idéalement pouvoir modifier le champ date d’ajout du produit.

La solution

La première consiste à dupliquer le produit pour actualiser le champ « date_add », mais ce n’est pas très pratique comme solution et cela risque d’occasionner d’autres problèmes à la longue. L’idéal est donc d’ajouter un nouveau champ dans la fiche produit, afin de pouvoir administrer la date et pouvoir donc positionner le produit en fonction de la date donnée.

Pour cela modifiez le fichier « \admin\themes\default\template\controllers\products\informations.tpl » et juste avant le code ci-dessous (vers la ligne 189) :

<hr/>
{* status informations *}

Ajoutez le code suivant

 {* Webbax - 04.11.15 - date ajout produit *}
        <style>
            {literal}
                #ui-datepicker-div{z-index:1000!important;}
            {/literal}
        </style>
        <script type="text/javascript">
            {literal}
               $(function(){
                   $('#date_add').datepicker({dateFormat:'yy-mm-dd'});
               });
            {/literal}
        </script>
        <div class="form-group">
             <label class="control-label col-lg-3" for="date-creation">
                 <span class="label-tooltip" data-toggle="tooltip"
                         title="{l s="Date d\'ajout"}">
                         {$bullet_common_field} {l s="Date d\'ajout"}
                 </span>
             </label>
             <div class="col-lg-3">
                 <input maxlength="12" type="text" id="date_add" name="date_add" value="{$product->date_add|htmlentitiesUTF8|date_format:'%Y-%m-%d'}" />
             </div>
        </div>
        <hr/>
{* -- *}

Ensuite, si vous accédez à votre fiche produit, vous pourrez constater l’apparition d’un nouveau champ, avec la possibilité d’éditer la date.

Cela semble tellement évident d'avoir ce champ éditable en natif... peut-être dans une prochaine version de Prestashop ?

Cela semble tellement évident d’avoir ce champ éditable en natif… peut-être dans une prochaine version de Prestashop ?

Quelque chose m’échappe…

Vous remarquerez qu’on a édité seulement la partie « template » de l’administration et pourtant la mise à jour des données fonctionne, sans pour autant devoir modifier des requêtes ou les processus qui sauvent / éditent le produit. Pourquoi ? Parce qu’il y’a un comportement magique dans Prestashop, qui va récolter automatiquement les valeurs des champs portant le nom du « Modèle de données » on aurait donc pu faire cela aussi avec « date_add » par exemple.

La méthode CopyFromPost du fichier AdminController est l'explication du pourquoi ça fonctionne sans coder le "sauvegardage des données".

La méthode CopyFromPost du fichier AdminController est l’explication du pourquoi ça fonctionne sans coder le « sauvage des données ».

Bilan

Finalement, cette date d’ajout c’est un peu comme « une date de publication », il n’est pas rare d’avoir des clients qui veulent influencer l’affichage des nouveautés. On retrouve cette problématique par exemple pour les « meilleures ventes », on aimerait plutôt mettre des produits définis par « nos soins », plus pertinent en fonction du stock et de la tendance… que sur le contenu des commandes effectuées. Bonne intégration à tous !

Erreur tab 500 dans votre fiche produit Prestashop

$
0
0

Il n’est pas toujours aisé de comprendre une erreur dans Prestashop. Typiquement l’autre jour dans les fiches produits d’une boutique Prestashop, j’ai constaté une erreur 500 lors du chargement des onglets.

Prestashop Error 500 (fiche produit)

L’antivirus peut-être coupable

Dans le cas présent j’utilise Kaspersky et je vois assez souvent la fenêtre des produits se bloquer avec une erreur, parce que l’antivirus stoppe l’exécution de certains traitements Javascript (sans réglage spécifiques). En désactivant l’anti-virus, la page s’exécute correctement et cela se produit chez certains clients, cela dépend de plusieurs variantes comme le nom de domaine, s’ils sont en HTTPS ou non.

Mais le pire c’est que ce genre de blocage par antivirus sous Prestashop, peut survenir aussi lors de la création du compte client. Donc chez vous cela fonctionne correctement, mais d’autres clients n’arriveront pas à s’inscrire avec un message « Technical Error » qui leur sera retourné et quitteront votre boutique (oui ça peut-être grave). Visitez le site de Webmastertoulouse, pour tester le patch.

Kaspersky pense parfois que le formulaire de Prestashop est une fraude au fishing.

Sur la partie inscription de compte client, Kaspersky pense parfois que le formulaire de Prestashop est une fraude au fishing.

Erreur plus délicate

Dans la fiche produit il peut pourtant se produire une erreur au moment de modifier / créer un produit, alors que la configuration de la boutique et du serveur sont optimales. Je n’ai pas trouvé à ce jour de réponses officielles sur la forge de Prestashop ou dans les forums. Voici comment se présente le problème dans la fiche produit…

Une erreur agaçante, car elle ne permet plus le chargement des onglets le marchand ne peut plus traiter correctement ses produits.

Une erreur agaçante, car elle ne permet plus le chargement des onglets le marchand ne peut plus traiter correctement ses produits.

Dans le fichier « classes/Uploader.php » vous pouvez retrouver une constante définie dans le haut du fichier :

class UploaderCore
{
	const DEFAULT_MAX_SIZE = 10485760;

Ensuite, si je fais juste de changer cette valeur en la triplant par exemple… plus aucun problème et l’erreur ne survient plus.

class UploaderCore
{
	const DEFAULT_MAX_SIZE = 30485760;

Ce qui est problématique là-dedans, c’est qu’il s’agit d’une valeur définie par Prestashop et qui peut nécessiter d’être plus élevée que la valeur proposée en standard. Le risque est donc de chercher partout et de ne pas trouver de solution, car l’erreur se corrige sur le coeur de Prestashop (à mon plus grand étonnement il n’y a rien d’autre à changer).

Bilan

Quand je suis tombé sur des topics qui parlaient de cette erreur, il n’y avait pas eu de réponses, je comprends d’ailleurs mieux pourquoi. On note donc l’importance d’éviter de mettre des constantes pré-définies comme ils l’ont fait, mais plutôt de s’appuyer sur des constantes sur serveur ou des valeurs mentionnées en back-office. Et pour l’antivirus, pensez à faire un test d’inscription client avec Kaspersky (sur un ordinateur de test).

Supprimer le comportement Ajax du panier Prestashop

$
0
0

En voilà une drôle de question… pourquoi vouloir supprimer le comportement Ajax du panier Prestashop ? Par mesure de simplification pour écrire un code plus court lorsqu’il faut faire un développement sur mesure.

Retrait Ajax panier Prestashop

Le comportement du panier

En standard sur Prestashop vous avez un joli effet quand vous effectuez l’ajout au panier, cela continue ensuite lorsque vous êtes dans la page du récapitulatif panier et que vous ajoutez des quantités ou que vous supprimez des produits. Par contre, on peut parfois vouloir retirer ce comportement pour gagner en clarté lors de l’opération (parce qu’il y’a des effets et l’utilisateur ne voit pas toujours bien ce qui se passe), mais surtout pour simplifier l’intégration de développements spécifiques.

L'édition de produits dans le panier se fait en toute transparence par défaut et sans rechargement de page, un confort qui a été pensé à la base pour faciliter la vie à l'acheteur.

L’édition de produits dans le panier se fait en toute transparence par défaut et sans rechargement de page, un confort qui a été pensé à la base pour faciliter la vie à l’acheteur.

Supprimer l’Ajax pour mieux coder

Par expérience il y’a des demandes de clients qui reviennent souvent en développement spécifique… Par exemple déclencher une action bien précise lorsqu’on est sur une fiche produit et qu’on ajoute le produit au panier, ou alors des actions qui peuvent s’effectuer en fonction de ce que l’acheteur fait dans le panier… On peut imaginer que le client voudrait :

  • afficher une information en temps réel lors de l’ajout au panier
  • afficher une calculation spécifique des frais de ports en instantané
  • afficher une information si X conditions sont réunies dans le panier

Le problème c’est que si l’Ajax est conservé, il ne suffit pas de modifier le comportement de Prestashop (via classes / controllers), il faut coder aussi toute la partie rafraichissement Ajax de la boutique et cela coûte aussi beaucoup plus cher au client. En retirant ce comportement, les pages seront toujours rechargées de manière « classique » ce qui diminue le temps de développement qui sera facturé au client.

Pour commencer il faut désactiver le comportement Ajax du panier Prestashop, pour cela il faut désactiver cette option dans les modules de Prestashop, plus précisément le module « Bloc panier ».

Rare sont les boutiques qui désactivent cette option, pourtant elle peut donner un sentiment d'exécution plus rapide lorsque le client ajoute un produit au panier. A noter aussi que cette option fait rediriger le client dans le panier lors de l'ajout d'un produit.

Rare sont les boutiques qui désactivent cette option, pourtant elle peut donner un sentiment d’exécution plus rapide lorsque le client ajoute un produit au panier. A noter que cette option redirige automatiquement le client dans le panier lors de l’ajout d’un produit.

Ensuite, dans le fichier présent dans votre thème sous « /js/cart-summary.js », il suffit de faire quelques modifications en ajoutant un « return true » qui va désactiver le traitement Ajax et préconiser un rechargement de page classique.

$(document).ready(function(){
	$('.cart_quantity_up').off('click').on('click', function(e){
                /* Webbax - no ajax */
                return true;
                
		e.preventDefault();
		upQuantity($(this).attr('id').replace('cart_quantity_up_', ''));
	});
	$('.cart_quantity_down').off('click').on('click', function(e){
                /* Webbax - no ajax */
                return true;
            
		e.preventDefault();
		downQuantity($(this).attr('id').replace('cart_quantity_down_', '')); 
	});
	$('.cart_quantity_delete' ).off('click').on('click', function(e){
                /* Webbax - no ajax */
                return true;
            
		e.preventDefault();	
		deleteProductFromSummary($(this).attr('id')); 
	});

Bilan

Mais à qui ça va servir me direz-vous ? A ceux qui veulent faire un développement sur mesure qui va influencer le panier. En terme de ratio temps, j’ai envie de dire que le PHP va prendre 1/3 du temps et le traitement Ajax 2/3. Pour une intégration optimale le prix serait donc 3x plus cher et dans la plupart des cas le client préfère aller à l’essentiel en désactivant le mode Ajax qui n’est pas forcément indispensable.

Ajustez la localisation Prestashop pour la Suisse

$
0
0

A l’époque Prestashop proposait peu de possibilités concernant la localisation, actuellement il le fait très bien pour la détection de la langue et du pays, mais il y’a très souvent une erreur dans les adresses.

Prestashop l'adresse client

L’adresse du client

Combien de fois j’ai vu le cas ci-dessous en m’inscrivant sur des boutiques du type Prestashop. Je commence par créer mon compte avec mon mail et mon mot de passe, puis ensuite il vient l’étape de la sélection de l’adresse et là par défaut on me propose comme pays « la France ». Et pourtant, si vous vérifiez dans les paramètres de localisation de votre boutique, le pays mentionné par défaut est bien la Suisse.

Le pays par défaut n'est pas l'élément prioritaire pour définir le pays par défaut dans la création d'adresse client.

Le pays défini dans cette page n’est pas l’élément prioritaire pour définir la valeur du pays par défaut dans la création d’adresse client.

Désactivez la langue via navigateur

Dans la même fenêtre vue précédemment, il y a une option « définir la langue depuis le navigateur » et c’est cette option qui cause le problème. Le comportement de Prestashop est le suivant, si la langue définie est le « Français » alors c’est le pays « France » qui sera sélectionné et non pas la Suisse qui parle 4 langues potentiellement différentes. Pour obtenir un fonctionnement correct il suffit de désactiver cette option.

Pour la Suisse du côté e-commerce, il y a des subtilités régulières à gérer à cause du multilingue pour un même pays.

Pour la Suisse du côté e-commerce, il y a des subtilités régulières à gérer à cause du multilingue pour un même pays.

C’est un détail non ?

Il y’a surtout un côté psychologique très important, car dans la phase de création du compte, un client qui voit qu’on lui propose par défaut la « France » alors qu’il s’imagine être sur une boutique « Suisse », va penser que c’est une entreprise françaises qui veut vendre en Suisse et le client peut perdre confiance surtout s’il pensait acheter local. Deuxièmement, c’est ergonomiquement pas pratique de demander à 95% de vos clients locaux de scroller pour choisir le pays Suisse alors que 5% de vos clients seulement sont étrangers.

Avoir la Suisse par défaut dans la sélection c'est bien plus logique surtout si on vend principalement dans le pays.

Avoir la Suisse par défaut dans la sélection c’est bien plus logique surtout si on vend principalement dans le pays.

Bilan

C’est l’autre jour en me recréant un nouveau compte sur ma propre boutique fraichement migrée, que je me suis dit… pourquoi le pays par défaut n’a rien à voir. Le paramètre de la détection en fonction de la langue du navigateur n’est pas une science exacte, vous pouvez avoir aussi un internaute suisse-allemand, avec un navigateur en allemand, le pays par défaut proposé serait donc l’Allemagne (ce qui n’est pas logique), mon conseil est donc de désactiver cette option.

La meilleure méthode pour installer un thème Prestashop

$
0
0

Quand vous regardez un site de démonstration pour un thème Prestashop, cela semble « magnifique » et la mise en place semble facile, mais une fois le thème acheté… les difficultés surviennent.

Installation thème Prestashop

Des problèmes fréquents

Ce que je constate régulièrement lors de l’installation d’un nouveau thème… c’est qu’une fois installé, celui-ci ne correspond pas au site de démonstration. Ou alors vous pouvez utiliser l’installation avec le modèle d’exemple de données (via un import SQL), mais ensuite, vous aurez une configuration bancale, avec des termes en anglais un peu partout et avec des configurations US, qui traînent partout dans la base de données… et cela peut-être pénible, car vous devrez régulièrement retoucher certains réglages / et re-traduire des termes.

Ne déployez pas l'exemple de données (fourni avec votre thème) sur votre base de production, car vous risquer de perdre une partie de votre travail + risque d'avoir un mélange français / anglais.

Ne déployez pas l’exemple de données (fourni avec votre thème) sur votre base de production, car vous risquer de perdre une partie de votre travail + risque d’avoir un mélange français / anglais.

La bonne procédure

La meilleure méthode c’est d’installer une nouvelle version de Prestashop vierge et d’installer le thème (avec le remplacement des dossiers /modules/ et /img/ la méthode manuelle est expliquée pour l’installation de chaque thème). Puis ensuite, vous pouvez importer le fichier SQL en principe fourni (ce qui est le cas chez Template Monster), afin d’obtenir un site de démo structuré avec la bonne configuration.

La deuxième étape consiste à installer le thème de manière clean sur votre environnement de production, pour cela vous pouvez importer le thème de manière classique depuis le back-office et le définir par défaut… Ensuite je vous invite à ajouter les modules liés au thème ainsi que les images… comme vous avez dû le faire pour la boutique de test.

Ensuite, tout va reposer dans les HOOK et les positions ! C’est le point fatal , car il faut ensuite de comparer les modules entre les deux boutiques… et c’est surtout sous « Modules -> Positions » que vous allez voir la différence entre votre e-shop test et votre e-shop production. Il est donc capital de s’assurer que :

  • l’ordre des modules est bien identique dans chaque HOOK
  • qu’il ne manque pas un module dans un HOOK
  • si vous avez des modules en plus sur votre environnement de production, ceux-ci peuvent provoquer un affichage différent de votre boutique test, désactivez les temporairement
Il est crucial de comparer les positions des modules et d'avoir une cohérence similaire, car parfois un module décalé d'un seul cran... peut déformer complètement l'affichage de la boutique.

Il est crucial de comparer les positions des modules et d’avoir une cohérence similaire, car parfois un module décalé d’un seul cran… peut déformer complètement l’affichage de la boutique.

Mêmes des professionnels se trompent

Comme je dois intervenir régulièrement sur des boutiques Prestashop, je confirme que dans le 99% des cas, il s’agit de thèmes achetés… sur Template Monster ou Thème Forest.. et j’ai vite fait de constater si le thème a été installé à l’arraché ou non. Le plus frappant c’est dans le back-office on a de l’anglais qui traine un peu partout… mais c’est la point de l’iceberg, car le fichier SQL exécuté sur la base, touche parfois à des valeurs sensibles qui peuvent donner lieu à d’autres bugs.

Importer un fichier SQL n'est pas sans risque, car bien souvent le script ne se content pas d'injecter uniquement le contenu... il modifie d'autres informations sensibles concernant la configuration de la boutique.

Importer un fichier SQL n’est pas sans risque, car bien souvent le script ne se contente pas d’injecter uniquement le contenu… il modifie d’autres informations sensibles concernant la configuration de la boutique.

Bilan

Actuellement je recommande donc d’avoir un shop en double… c’est très pratique, car ça permet de savoir par exemple si un bug est présent dans la version originale « vierge » sans module. Ensuite, cela permet de répercuter manuellement les changements dans les modules concernés en faisant du copier / coller, toujours en ayant une base de référence. A une époque les thèmes Prestashop étaient plus simples, mais ceux proposés actuellement nécessitent d’être un minimum organisé pour obtenir un résultat similaire à la démo commerciale.

41 astuces sur Prestashop à découvrir !

$
0
0

Prestashop n’est plus à ses débuts et dispose d’un très large éventail de possibilités… du coup il y’a certainement des choses que vous ignorez. Découvrons ensemble un livre qui regroupe des astuces intéressantes.

Astuces Prestashop

Ou se procurer le livre ?

Vous pouvez le télécharger gratuitement le livre sur le site de Manit4c, il a été rédigé par Olivier CLEMENCE. On retrouve régulièrement des billets intéressants sur son blog, je vous invite d’ailleurs à le suivre si vous ne le faites pas encore.

Juste en passant, notez que c'est une bonne idée de proposer un livre sur un domaine dans lequel vous êtes expert. Cela vous permet d'obtenir des mails clients, afin d'augmenter votre réseau clientèle.

Juste en passant, notez que c’est une bonne idée de proposer un livre sur un domaine dans lequel vous êtes expert. Cela vous permet d’obtenir des mails clients, afin d’augmenter votre réseau clientèle.

Offrir un cadeau secret à vos clients

Avec la version standard de Prestashop, vous pouvez (en suivant un processus bien précis), offrir un cadeau automatiquement à vos clients. Si vous suivez la procédure indiquée dans le livre, vous pourrez ajouter au panier de votre client automatiquement un produit cadeau à sa commande, sans que celui-ci soit forcément visible depuis votre catalogue.

Voilà une manière intelligente pour éviter d'acheter un module dédié à cette tâche.

Voilà une manière intelligente pour éviter d’acheter un module dédié à cette tâche.

Avoir un moteur de recherche qui fonctionne

Combien de fois je suis passé sur des boutiques Prestashop et j’ai constaté qu’une partie des produits ne sortaient pas dans la recherche… Cela est terriblement pénalisant, car les clients ne trouvent pas forcément ce qu’ils cherchent alors que concrètement vous possédez le produit.

Franchement, il serait dommage de rater des ventes à cause d'une mauvaise configuration.

Franchement, il serait dommage de rater des ventes à cause d’une mauvaise configuration (vérifiez les recommandations qu’il propose).

Lister les clients ayant acheté un produit spécifique

Il existe des modules pour cela, mais avec la méthode proposée dans le livre on peut le faire via une requête SQL en passant par le gestionnaire SQL, cela vous permettra de faire une relance client sur des produits similaires ou pour de la ventes d’accessoires.

Une idée intéressante de module serait qu'un module génère automatiquement des requêtes type dans le gestionnaire SQL, cela serait très pratique pour les clients.

Une idée intéressante de module serait, qu’un module génère automatiquement des requêtes type dans le gestionnaire SQL, cela serait très pratique pour les clients.

Voir les modules qui ralentissent la boutique

Il y’a une rubrique qui vous explique comment localiser une lenteur en activant le profiling de Prestashop. A voir aussi ma vidéo concernant Vous avez un Prestashop lent ?, qui vous montre une utilisation en live. Il est important d’avoir connaissance de ces options, pour être autonome le maximum possible.

L'option est facile à activer et permet "assez facilement" de localiser les "hooks" qui sont lents ou surchargés. Assurez-vous aussi d'avoir un bon serveur !

L’option est facile à activer et permet « assez facilement » de localiser les « hooks » qui sont lents ou surchargés. Assurez-vous aussi d’avoir un bon serveur !

Bilan

Il vous reste encore 40 autres astuces à découvrir… donc n’attendez plus ! Prestashop contient beaucoup de fonctionnalités, ce que je conseille souvent au client c’est d’utiliser un maximum les options fournies en natif, car elles sont perdurables dans le temps. Voilà donc une belle initiative de la part de Manit4c, on espère vivement une suite !

Cet article 41 astuces sur Prestashop à découvrir ! est apparu en premier sur Webbax | Expert E-commerce Prestashop.


Jetez votre slider Prestashop et remplacez-le par une image

$
0
0

Le slider c’est vraiment l’élément incontournable du moment… c’est devenu ancré dans les standards, toute la nouvelle génération de thèmes Prestashop en proposent déjà un pré-intégré.

Slider e-commerce

Le slider vraiment utile ?

Comme j’en avais déjà parlé dans un autre article, la notion de slider est intégrée régulièrement sans que l’on se pose les bonnes questions sur le plan ergonomie et sur le plan pratique. L’arrivée du slider a provoqué l’effet « wouaw » dans la tête des internautes, mais lorsqu’on désire l’utiliser dans la pratique, il en ressort plusieurs inconvénients.

  • Les internautes cliquent et regardent principalement la 1ère slide.
  • Si on utilise le slider, il faut trouver au minimum 3 images, avec 3 idées.
  • Cela implique d’actualiser régulièrement les 3 slides (+ de travail).
  • la page d’accueil est alourdie au chargement (images + libraires JS).
  • Sur mobile, un slider est moins accessible (avec flèches de navigation) qu’une image simple cliquable.
Même Adidas propose un slider à l'accueil de son site pour inciter à l'achat... mais qui a dit que c'était la règle absolue à suivre ?

Même Adidas propose un slider à l’accueil de son site pour inciter à l’achat… mais qui a dit que c’était la règle absolue à suivre ?

Dans votre Prestashop

Par défaut on retrouve le module « Diaporama » qui tourne en boucle sur l’accueil, celui-ci est très pratique, mais notre but c’est de s’en passer pour le remplacer par une image simple et fixe. Pour cela rien de plus simple, on commence dans le back-office par laisser une seule image dans le module « Diaporama », les autres vous pouvez les supprimer.

Dans le module Diaporama, une seule slide est configurée.

Dans le module Diaporama, une seule slide est configurée.

Ensuite, dans le fichier « modules/homeslider/homeslider.php », dans la méthode « hookdisplayHeader » (vers la ligne 590) on passe en commentaire les deux fichiers « js » qui déclenchent l’effet de slider sur le bloc.

En commentant ces deux lignes, le module perdra son comportement de slider et affichera une image fixe.

En commentant ces deux lignes, le module perdra son comportement de slider et affichera une image fixe.

A présent l'image ne tourne plus en boucle, les boutons de navigation ne figurent plus, par contre on garde la notion de texte sur l'image (pour le référencement) et la possibilité de faire conduire le lien sur l'image.

A présent l’image ne tourne plus en boucle, les boutons de navigation ne figurent plus, par contre on garde la notion de texte sur l’image (pour le référencement) et la possibilité de faire conduire le lien sur l’image.

Bilan

Mais quel est le but de faire ça ? Finalement, c’est de simplifier le travail du e-commerçant et de l’acheteur. Le e-commerçant pourra changer plus régulièrement son image principale à la page d’accueil et n’aura qu’une seule idée à trouver… Parallèlement, l’acheteur verra régulièrement une nouvelle image à l’accueil et son attention focalisée sur celle-ci, enfin la vitesse de chargement de la page n’en sera qu’améliorée.

Cet article Jetez votre slider Prestashop et remplacez-le par une image est apparu en premier sur Webbax | Expert E-commerce Prestashop.

Renommez toutes les références de vos produits Prestashop

$
0
0

Chaque marchand a un fonctionnement très spécifique en ce qui concerne la logistique, la gestion des produits, la manière de les identifier, beaucoup de e-commerçants utilisent la référence de Prestashop.

Référence produits

La référence produit

A quoi sert la référence produit de Prestashop ? Celle-ci permet au marchand d’identifier un produit par une chaine de caractères de son choix. Cette référence sert surtout à l’interne et sera affichée au client sur la fiche produit (on évitera donc de mettre le code fournisseur dedans). Par contre, ce que j’ai toujours eu de la peine à comprendre c’est que :

  • Il est possible de mettre une référence identique sur plusieurs produits, Prestashop n’effectue pas de contrôle de doublons.
  • Pourquoi mettre une référence sur le produit principal, lorsque celui-ci dispose de déclinaisons, la référence principale devrait être à mon sens désactivée dans ce cas.
La référence permet d'identifier rapidement un produit, surtout lorsque vous avez des échanges par e-mail / téléphone avec vos clients.

La référence permet d’identifier rapidement un produit, surtout lorsque vous avez des échanges par e-mail / téléphone avec vos clients.

Le marchand débordé

Certains marchands ont par exemple commencé à indiquer les références de leurs produits… puis ils ont fait une pause et après ne se souviennent plus si tous leurs produits ont bien une référence. Et surtout si toutes les références sont uniques, cela peut-être important si vous utilisez un système externe qui communique avec Prestashop et qui se sert de la référence produit comme identifiant de mise à jour.

Renommer les références en masse

Nous allons voir ensemble un processus qui permet de remettre à jour toutes les références des produits de manière à ce que chaque produit et chaque déclinaison, aient une référence, mais aussi qu’elles soient uniques.

Pour cela vous pouvez télécharger le script pour Prestashop, il suffira ensuite de mettre le dossier « scripts » dans votre dossier « modules » et d’exécuter l’url suivante : http://www.votresite.ch/modules/scripts/rename_references.php

Pour ceux qui préfèrent directement le code php

<?php

/* 
 * Permet de re-définir des références uniques pour tous les articles du shop
 */

require('/../../config/config.inc.php');

$prefix_ref = 'REFB-';
$prefix_refd = 'REFD-';
$count = 0;

$products = Db::getInstance()->executeS('SELECT `id_product` FROM '._DB_PREFIX_.'product');
foreach($products as $p){
    Db::getInstance()->execute('UPDATE '._DB_PREFIX_.'product 
                                SET `reference`="'.pSQL($prefix_ref.$p['id_product']).'" 
                                WHERE `id_product`="'.pSQL($p['id_product']).'"');
    $count++;
}
$products_attributes = Db::getInstance()->executeS('SELECT `id_product_attribute` FROM '._DB_PREFIX_.'product_attribute');
foreach($products_attributes as $pa){
    Db::getInstance()->execute('UPDATE '._DB_PREFIX_.'product_attribute 
                                SET `reference`="'.pSQL($prefix_refd.$pa['id_product_attribute']).'" 
                                WHERE `id_product_attribute`="'.pSQL($pa['id_product_attribute']).'"');
    $count++;  
}

echo 'Félicitation <strong>'.$count.'</strong> références mises à jour !';

?>

La manière de faire est toute simple, tous les produits sont renommés en utilisant la méthode suivante pour les produits simples « REFB-IDPRODUIT » et pour les déclinaisons « REFD-IDDECLINAISON » ce qui permet d’assurer que l’information soit bien unique.

Parfait, l'opération de la mise à jour des références s'est bien déroulée.

Parfait, l’opération de la mise à jour des références s’est bien déroulée.

Et pour les nouveaux produits

Vous avez deux possibilités, vous pouvez « ré-exécuter » le script lorsque vous aurez saisi de nouveaux produits les références resteront les mêmes pour les anciens produits et les nouveaux seront automatiquement complétés. Si vous désirez saisir manuellement vos références utilisez toujours en préfixe « REFB- » ou « REFD- » pour savoir s’il s’agit d’un produit principal ou d’une déclinaison, puis ensuite mettez l’id du produit + (-1,-2,-3,-4) si vous avez par exemple 4 déclinaisons.

Bilan

De mon côté dans les modules qui doivent communiquer avec d’autres plateformes (comme WinBIZ), je me sers souvent de cette référence. Et il n’est pas rare dans une boutique d’avoir des références vides ou à double, ce qui provoquerait ensuite un vrai problème pour l’échange des données. Cette petite méthode peut faire gagner du temps et assure au moins d’avoir des codes articles toujours rationnels, même s’ils ne sont pas très parlants.

Cet article Renommez toutes les références de vos produits Prestashop est apparu en premier sur Webbax | Expert E-commerce Prestashop.

Est-ce que le coeur de votre Prestashop a été modifié ?

$
0
0

Dans Prestashop, il y’a énormément de fichiers et aussi beaucoup d’intervenants qui peuvent effectuer des modifications sur votre boutique lors d’intervention, résolution de bugs SAV etc… le vôtre est-il encore 100% clean ?

Coeur de Prestashop

C’est quoi exactement le coeur ?

Dans Prestashop, il y’a une partie des fichiers qu’il ne faudrait jamais toucher, car ce sont des fichiers qui concernent le « coeur » de l’application. Ceux-ci ont un comportement bien défini à ne surtout pas modifier, de plus ils peuvent être écrasés ensuite automatiquement par une mise à jour. Il faut donc absolument éviter ces modifications et plutôt privilégier la mise en place d’override (surcharge du coeur) dans un dossier séparé prévu à cet effet.

Le mauvais exemple serait de modifier des fichiers du coeur directement dans /controllers (1),  la bonne méthode à suivre c'est de mettre en place une copie du comportement dans le dossier  /override/controllers (2).

Le mauvais exemple serait de modifier des fichiers du coeur directement dans /controllers (1), la bonne méthode à suivre c’est de mettre en place une copie du comportement dans le dossier /override/controllers (2).

Qui a touché à mon Prestashop ?

Si un intervenant ou un module a modifié directement un fichier du coeur, cela peut avoir des conséquences sur le fonctionnement et il ne sera plus possible revenir en arrière afin de tester le comportement « original » de Prestashop. Le pire c’est aussi que finalement on ne sait pas qui a modifié quoi et là on peut parfois se demander si une personne a injecté un mauvais code ce qui pourrait être à l’origine de certains bugs.

La désactivation des surcharge ne sert plus à rien, si des personnes ou modules ont modifié le coeur de l'application.

La désactivation des surcharge ne sert plus à rien, si des personnes ou modules ont modifié le coeur de l’application.

Informations sur les fichiers

La bonne nouvelle c’est que dans le back-office de la boutique, sous « Paramètres avancés -> Informations » (là ou on ne va jamais), il existe un processus qui va vérifier l’authenticité des sources par rapport aux fichiers courants de la boutique.

Tout à l'heure j'ai modifié un fichier lié à l'administration... celui-ci est remonté dans la liste... Le defines.inc.php a été modifié par le module d'arrondi à 5ct... Dans les TPL de PDF j'avais aussi fait quelques variantes...

Tout à l’heure j’ai modifié un fichier lié à l’administration… celui-ci est remonté dans la liste… Le defines.inc.php a été modifié par le module d’arrondi à 5ct… Dans les TPL de PDF j’avais aussi fait quelques variantes…

Par contre, je viens d’effectuer encore un test en modifiant des modules natifs, cela ne semble pas détecter les modifications. Peut-être parce que les fichiers des modules sont moins cruciaux pour le fonctionnement de la boutique Prestashop et que cela ne concerne pas directement le processus sensible de la boutique.

L'administration se connecte à l'API Prestashop pour vérifier que le HASH MD5 corresponde bien aux sources locales. Chaque version de Prestashop dispose de son propre fichier XML de contrôle.

L’administration se connecte à l’API Prestashop pour vérifier que le HASH MD5 corresponde bien aux sources locales. Chaque version de Prestashop dispose de son propre fichier XML de contrôle.

Bilan

On s’imagine difficilement tous les changements qu’un client a fait dans son Prestashop avant de venir vous voir. Quand on rencontre des bugs graves, il est important de s’assurer que les sources sont déjà saines et qu’il n’y a pas eu de racollage. Ensuite, il faut y aller par étape, en désactivant les overrides, puis ensuite certains modules si nécessaire. Cela vous évitera de devoir effectuer un différentiel de tous les fichiers en passant par une application du type WinMerge.

Cet article Est-ce que le coeur de votre Prestashop a été modifié ? est apparu en premier sur Webbax | Expert E-commerce Prestashop.

Ajouter WordPress à Prestashop 1.6

$
0
0

Régulièrement on me demande, est-ce qu’il faut mettre un module de blog à Prestashop ou faut-il utiliser WordPress ? Les deux solutions sont intéressantes, mais chaque solution implique un cout d’intégration différent.

Prestashop et WordPress

WordPress la solution ?

Quand on me demande de faire le choix entre un module de blog ou la solution WordPress, je considère toujours la solution WordPress comme la Roll Royce et les modules Prestashop comme une solution très bien aussi, mais moins orientée purement bloging. WordPress est dédié au blog c’est sa fonction métier… pour une entreprise qui prévoit faire de la publication régulière cela vaut la peine d’investir sur une plateforme dédiée.

Ces modules de blogs sont complémentaires... ce qui est normal, car Prestashop est avant tout une solution orientée purement e-ecommerce.

Ces modules de blogs sont complémentaires… ce qui est normal, car Prestashop est avant tout une solution orientée purement e-ecommerce.

Intégrer WordPress à Prestashop

En faisant une petite recherche sur internet, je suis retombé surtout sur mon ancien billet qui parle de l’intégration entre ces deux systèmes. Comme je n’ai pas trouvé vraiment de nouvelles alternatives, j’ai refait le même processus pour une version 1.6 pour voir si cela fonctionnait correctement.

1) Pour commencer la première étape est d’installer le blog « WordPress » dans un dossier « /blog », sachant que votre boutique doit être installée à la racine. Votre dossier « blog » sera donc au même niveau que le dossier « modules » de Prestashop.

2) Au niveau du thème WordPress, j’ai utilisé le thème par défaut le plus neutre et facile d’intégration. Actuellement je conseille donc d’utiliser le thème « twentysixtyteen ».

3) Modifiez le fichier « header.php » présent dans votre thème en ajoutant le code suivant en tout début de fichier. Ce processus va chercher le header de Prestashop et injecter les balises métas de WordPress dans le header de Prestashop.

/* Webbax - 24.02.16 - intégration WP-PS */
require_once(dirname(__FILE__).'/../../../../config/config.inc.php');
global $controllerPrestashop;
$controllerPrestashop = new FrontController();
$controllerPrestashop->init();
$controllerPrestashop->setMedia();
Context::getContext()->smarty->assign(array('meta_title' => html_entity_decode(get_the_title()), 
                                            'meta_description' => get_post_meta($post->ID,'description',true),
                                            'meta_keywords' => ''
                                            ));
$controllerPrestashop->displayHeader();

4) Modifiez le fichier « footer.php » présent dans votre thème et ajoutant le code suivant en fin de fichier. Celui-ci vous permettra d’afficher automatiquement le pied de page de votre boutique Prestashop.

<?php 
/* Webbax - 24.02.16 - intégration WP-PS */
global $controllerPrestashop;
$controllerPrestashop->displayFooter();
?>

5) Le comportement de base devrait déjà fonctionner, vous devriez avoir un blog avec le header et footer de la boutique. Par contre, au niveau du visuel, il y’a des retouches à faire pour l’intégration. Pour cela vous devez adapter le fichier « styles.css » présent dans le répertoire de votre thème. Vous aurez certainement des confits de règles, entre les fichiers de Prestashop et ceux de WordPress. Actuellement j’analyse le résultat sous Firebug puis je définis les règles de manières suivante.

  • Les règles CSS WordPress qui causent problèmes en déformant le comportement des CSS Prestashop, je les retire
  • Les règles à appliquer à des éléments spécifiques ou correctifs spéciaux, je les ajoute en fin du fichier CSS.

Peut-on faire mieux ?

C’est une bonne question, premièrement il n’est pas obligatoire d’intégrer un WordPress directement dans son Prestashop, les deux peuvent être séparés. Une partie des marchands préfèrent la version intégrée, car elle permet au client de toujours mieux identifier l’entreprise et conserver la partie « commercial » à portée d’un seul clic. En ce qui concerne l’intégration technique, je trouve que cette méthode fonctionne assez bien et semble perdurer (depuis la version PS 1.4).

Finalement, l'intégration se fait de manière plutôt transparente, il faut prendre patience à retoucher le CSS, mais sinon ça se passe bien.

Finalement, l’intégration se fait de manière plutôt transparente, il faut prendre patience à retoucher le CSS, mais sinon ça se passe bien.

Et le responsive ?

Il est vrai que nous sommes dans un cas un peu spécial, car on effectue une inclusion d’un système dans un autre. Pourtant, le responsive répond tout à fait correctement, il est donc tout à fait viable d’utiliser ce mode d’intégration.

Le couplage de deux systèmes responsives ne cause pas de problème, comme le montre par exemple cette capture, avec le panier au-dessus (Prestashop) et le contenu du billet en dessous  (WordPress).

Le couplage de deux systèmes responsives ne cause pas de problème, comme le montre par exemple cette capture, avec le panier au-dessus (Prestashop) et le contenu du billet en dessous (WordPress).

Bilan

La plupart des blogs à succès sont sous WordPress, après à mon avis il faut y aller de manière progressive surtout si vous avez encore jamais blogué. Premièrement, essayez d’ouvrir un blog simple dans la version cloud, si ensuite vous voyez que vous tenez dans le temps, alors vous pourrez toujours l’exporter et l’héberger sur votre propre serveur. Voilà pour les lecteurs plus techniques vous avez les bases pour démarrer votre intégration…

Cet article Ajouter WordPress à Prestashop 1.6 est apparu en premier sur Webbax | Expert E-commerce Prestashop.

Intégrer Google Translate à son Prestashop

$
0
0

Bien souvent quand je discute avec des personnes du milieu du web, il en ressort que la traduction automatique c’est mauvais et que ça n’apporte rien de plus sur un e-commerce. Pourtant, pour le début… ça peut aider !

Traductions e-commerce

Difficile de bien réussir un shop multilingue

Il n’est pas rare d’avoir des demandes de clients, qui veulent un site en 4 langues… effectivement Prestashop est prévu pour et les traductions de base sont déjà intégrées. Le problème c’est surtout quand il faut traduire tous les produits, tous les menus… les catégories descriptions etc… sans faire appel à des professionnels c’est mission impossible.

L’intégration est longue, car il faut aussi que les modules gèrent ces traductions (ce qui n’est pas toujours le cas) et il faut aussi que les mails soient traduits et il faut faire vraiment un tour détaillé pour être certain que tout est au top. Pour être honnête, je vois rarement ce genre de site, car chaque boutique est dominante sur une langue et sur les langues étrangères, la traduction laisse assez souvent à désirer (sens / cohérence), même si cela est fait par des professionnels.

Utilisation de Google Translate

Google Translate, ne remplacera jamais une bonne traduction… mais permet de rendre plus accessible un site pour un visiteur étranger. L’option Google Translate peut-être intéressante afin d’avancer par palier. Plutôt que de penser à faire du multilingue immédiatement… commencez à bien peaufiner votre site en français et laissez-vous du temps pour optimiser le français en priorité tout en gardant Google Translate.

Ensuite, deux options s’offrent à vous :

  • Si vous avez plus de moyens, activez une langue et testez les pages de votre Prestashop, complétez les traductions dans tous les processus, puis désactivez Google Translate.
  • Si vous ne pensez pas investir « vraiment » du temps pour la traduction, contentez-vous de faire le shop en français uniquement et créez plus de contenu en français (tout en gardant l’option Google Translate).
Qui n'a jamais utilisé la traduction de page sur un site étranger ? Les termes sont parfois un peu hors sens, mais on s'y retrouve.

Qui n’a jamais utilisé la traduction de page sur un site étranger ? Les termes sont parfois un peu hors sens, mais on s’y retrouve.

Intégration à Prestashop

Pour intégrer Google Translate facilement à Prestashop, je vous conseille pour commencer de désactiver le bloc des langues (dans le back-office sous les modules).

Voici comment procéder pour l’intégration dans le thème par défaut, modifiez le fichier « \themes\default-bootstrap\modules\blockuserinfo\nav.tpl » en ajoutant tout au début du fichier le code suivant :

{* Webbax - 18.03.16 - Google Translate *}
<div class="header_user_info">
        <div id="google_translate_element" style="text-align:center;"></div><script type="text/javascript">
            {literal}
            function googleTranslateElementInit() {
                new google.translate.TranslateElement({pageLanguage: 'fr', layout: google.translate.TranslateElement.FloatPosition.TOP_RIGHT}, 'google_translate_element');
            }
            {/literal}
        </script>
        <script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>

Et dans le fichier « \themes\default-bootstrap\css\global.css » ajoutez tout à la fin :

/* Webbax */
#google_translate_element .goog-te-gadget-icon{display:none;}
#google_translate_element a:hover{background-color:#fff;}

Une fois que vous avez procédé à ces changements, vous pouvez recharger votre page et normalement vous devriez obtenir l’intégration de la liste déroulante dans votre menu.

Et voilà vous obtenez un bloc de langues à un emplacement adapté.

Et voilà vous obtenez un bloc de langues à un emplacement adapté.

Avec une liste aussi complète, personne n'est oublié.

Avec une liste aussi complète, personne n’est oublié.

La traduction automatique ne déforme pas le shop ce qui est plutôt un bon point pour l'ergonomie.

La traduction automatique ne déforme pas le shop ce qui est plutôt un bon point pour l’ergonomie.

Même sur mobile le sélecteur de langues reste utilisable.

Même sur mobile le sélecteur de langues reste utilisable.

Bilan

La solution Google Translate n’est pas « incroyable » c’est vrai, mais elle n’est pas pire que des shop qui proposent plusieurs langues et où le contenu ne suis pas derrière… ou avec une traduction partielle seulement. Quand on fait du multilingue, soit on le fait bien… soit on se concentre sur la langue principale.

Je comprends l’engouement des clients de faire en un shop en plusieurs langues, mais une bonne partie s’en rendent compte eux-mêmes… le travail est vraiment colossal, surtout quand on est une petite structure et qu’on a beaucoup de produits. Profitez donc du week-end pour méditer sur vos traductions 😉 !

Cet article Intégrer Google Translate à son Prestashop est apparu en premier sur Webbax | Expert E-commerce Prestashop.

Viewing all 45 articles
Browse latest View live