Start chat

PrestaShop Documentation v1.3

Modules et extensions personnalisés



Smart Blog

Smart blog - un ensemble de modules qui permet de créer un blog dans votre magasin. Il se compose des modules suivants:

  • Smart Blog
  • Flux RSS Smart Blog
  • Archive Smart Blog
  • Catégories Smart Blog
  • Dernières Nouvelles de Home Smart Blog
  • Derniers Commentaires Smart Blog
  • Module AddThis Smart Blog
  • Articles Populaires Smart Blog
  • Articles Récents Smart Blog
  • Articles Connexes Smart Blog
  • Recherche Smart Blog
  • Mots Clés Smart Blog

Il y a aussi des crochets où les modules de blog peuvent apparaître sur le site, ils peuvent également être affichés dans les crochets standard (seulement des colonnes).

Smart Blog

C'est le module principal qui contient de nombreux paramètres pour la fonctionnalité du blog. Après son installation, l'onglet du menu Blog apparaîtra dans le menu principal de votre panneau d'administration, où vous pouvez ajouter/supprimer/modifier les articles/catégories ou sélectionnez le type d'images et leurs dimensions utilisées dans les posts (les types et les dimensions des images de blog sont différents des paramètres d'images de produits dans votre magasin). Pour ajouter les paramètres frontend du module, il faut naviger à Smart Blog (Modules -> Fonctionnalités Front Office -> Smart Blog) et définir tous les paramètres.

Description des paramètres:
  • Titre Méta
    le titre de votre blog qui apparaîtra sur toutes ses pages.
  • Méta Keywords
    les mots-clés qui seront utilisés par les moteurs de recherche pour une meilleure optimisation SEO.
  • Méta Description
    la description de votre blog utilisé par les moteurs de recherche pour une meilleure optimisation SEO.
  • URL Principale du Blog
    l'URL de votre blog.
  • Utilisez .html avec URL convivial
    activer/désactiver l'ajout de .html aux URL des pages du blog en utilisant les URL convivials.
  • Nombre de publications par page
    le nombre de messages affichés par page (catégories/pages d'archives, etc.).
  • Commentaire auto-accepté
    activer/désactiver les commentaires auto-acceptés; si activé, les commentaires seront disponibles sans modération de l'administrateur.
  • Activer Captcha
    activer/désactiver Captcha sous le formulaire Laissez un commentaire sur les pages des produits.
  • Activer Commentaire
    activer/désactiver l'jout de commentaires par les utilisateurs.
  • Afficher Nom D'auteur
    activer/désactiver le nom de l'auteur sur les pages du blog et les pages uniques.
  • Afficher Vues du Message
    activer/désactiver le nombre de fois que les utilisateurs ont vu la publication. Il apparaîtra sous la publication sur les pages du blog et les pages uniques.
  • Afficher Style du Nom d'Auteur
    modifier le format du nom de l'auteur.
  • AVATAR Image
    l'ajout de l'image d'avatar standard pour tous les utilisateurs.
  • Pas D'image
    activer/désactiver l'image. Aucune image est définie, s'il n'y a pas d'image pour publication / catégorie, etc..
  • Afficher Catégorie/dt>
    activer/désactiver l'image et la description de la catégorie sur les pages de la catégorie de blog.
  • Réglage des Colonnes de la page du blog
    la configuration de l'affichage des modules liés au blog. Ll nécessite souvent des paramètres supplémentaires. Par conséquent, il est recommandé d'installer des modules supplémentaires de la même manière que les modules PrestaShop standards.
  • CSS personnalisé
    Vous pouvez ajouter des styles supplémentaires dans ce champ. Faites attention en utilisant les classes déjà utilisées dans le thème, car certains conflits peuvent se produire.
  • Supprimer Vieux Tumblr
    sert à régénérer les images du blog dans le cas où les dimensions de l'image ont été modifiées ou le nouveau type d'image a été ajouté. Pour se régénérer, sélectionnez 'Qui' et cliquez sur 'Régénérer'.

SEULEMENT APRES CELA, autres modules liés au blog peuvent être installés. Le processus d'élimination est le contraire: PREMIER, VOUS DEVEZ SUPPRIMER TOUS LES MODULES CONNEXES et seulement après supprimez le module Smart Blog.

Flux RSS Smart Blog

Le module génère le nouveau flux pour votre blog.

Il a plusieurs paramètres dans le panneau d'administration:

  • Période de mise à jour
    permet d'afficher des messages à partir d'une période spécifique (heure/jour/semaine/mois/année).
  • Fréquence de mise à jour
    permet de définir la fréquence de mise à jour (1 semaine, 2 heures, etc.).

Il existe un chemin de fichier en haut où les nouvelles seront générées. Il se compose de l'URL du site Web + /modules/smartblogfeed/rss.php.

Archive Smart Blog

Ce bloc apparaît dans la colonne de gauche/droite et est utilisé pour trier les messages par période de temps (mois).

Il n'a pas de paramètres supplémentaires.

Catégories Smart Blog

TCe bloc apparaît dans la colonne de gauche / droite et est utilisé pour trier les messages par catégorie.

Il n'a pas de paramètres supplémentaires.

Dernières Nouvelles de Home Smart Blog

Ce bloc ne s'affiche que dans le crochet homepagecontent et est utilisé pour afficher les derniers messages sur la page d'accueil.

Paramètres:

  • Nombre d'Articles à Afficher dans Dernières Nouvelles
    le nombre de messages qui apparaîtront sur la page d'accueil.

>Derniers Commentaires Smart Blog

Ce bloc apparaît dans la colonne gauche / droite et est utilisé pour afficher les derniers commentaires ajoutés pour les articles du blog.

Paramètres:

  • Nombre de Commentaires à Afficher
    le nombre de commentaires affichés dans le bloc.

Module AddThis Smart Blog

Ce bloc apparaît sur la page d'article et permet de partager cette publication dans les réseaux sociaux.

Il n'a pas de paramètres supplémentaires

Articles Populaires Smart Blog

Ce bloc apparaît dans la colonne gauche/droite et est utilisé pour afficher les messages les plus populaires.

Paramètres:

  • Nombre de Articles Populaires à Afficher
    le nombre de messages populaires affichés dans le bloc.

Articles Récents Smart Blog

Ce bloc apparaît dans la colonne de gauche/droite et est utilisé pour afficher les derniers messages.

Paramètres:

  • Afficher le Nombre de Articles Récents
    le nombre de messages récents affichés dans le bloc.

Articles Connexes Smart Blog

Ce bloc s'affiche sur la page d'article et est utilisé pour afficher des messages connexes.

Paramètres:

  • Afficher le Nombre de Articles Connexes
    le nombre de messages connexes affichés dans le bloc.

Recherche Smart Blog

Ce bloc apparaît dans la colonne de gauche/droite et est utilisé pour effectuer une recherche sur le blog.

Il n'a pas de paramètres supplémentaires.

Mots Clés Smart Blog

Ce bloc apparaît dans la colonne gauche/droite et est utilisé pour afficher les mots clés dans le blog.

Paramètres:

  • Nombre de Tags à Montrer
    le nombre mots clés affichées dans le bloc.

Vue 360 TM

Le module affiche des images dans un effet 3D et permet aux utilisateurs de les faire pivoter à 360 degrés. La rotation peut démarrer automatiquement sur le chargement de la page, ou le client peut tourner l'image manuellement, en faisant glisser le bouton gauche de la souris.

En outre, le module peut être utilisé pour ajouter une vue panoramique (ou plusieurs vues panoramiques) à la page d'accueil.

Le mode visualisation 360 est également disponible sur la page du produit.

Installation

Naviguez vers Modules et Services -> Modules et Services (1)dans votre panneau d'administration et trouvez le module Vue 360 TM (2). Ensuite, cliquez sur le bouton 'Installer' (3).

Configuration du module

Une fois que le module a été installé, vous verrez la page 'Configure' avec les paramètres de module par défaut.

On peut trouver ici les paramètres pour la vue 360 (1) et pour la vue panoramique (2).

Vue 360

es paramètres sont décrits ci-dessous la capture d'écran. Définissez-les selon vos besoins et cliquez sur le bouton 'Enregistrer' (1).

  • Activer sur Home - l'option pour afficher la vue 360 du produit sur la page d'accueil.
  • Choisir un produit(apparaît si 'Activer sur Home' est réglé sur 'Qui') - choisissez un produit qui doit être affiché en mode 360.
  • Animer - l'option pour afficher le produit en rotation automatique en chargement de la page.
  • Durée d'image(apparaît si 'Animer' est réglé sur 'Oui') - le période de temps avant une image sera remplacée par une autre; devrait être entré en millisecondes.
Ajout/Suppression d'images
  • Accédez au Catalogue->Produits dans votre panneau d'administration(1), choisissez le produit et cliquez sur le bouton 'Éditer' (2).

  • Pour ajouter des images, utilisez l'onglet 'Affichage 360 TM'(1) dans les paramètres du produit et appuyez sur le bouton 'Ajouter des fichiers' (2).

  • Ensuite, appuyez sur 'Télécharger des fichiers' (1).

  • Lorsque les fichiers ont été téléchargés avec succès, cliquez sur le bouton 'Enregistrer' (1).

    Pour rendre la rotation en douceur, ajoutez plus d'images.

  • Après avoir ajouté des photos d'images, la vue 360 du produit sera affichée sur la page d'accueil*.
    *Il apparaîtra aussi sur la page du produit après la description.

  • Pour désactiver la vue 360 sur la page d'accueil, allez simplement aux paramètres de module Vue 360 TM et sélectionnez 'Non' pour 'Activer sur Home'.

  • Pour désactiver la vue 360 sur la page du produit, ouvrez l'onglet 'Vue 360 TM' dans les paramètres du produit et supprimez toutes les images.

Panorama

On peut utiliser ce module pour ajouter une vue panoramique à la page d'accueil.

Vous pouvez ajouter autant de blocs panoramiques que vous avez besoin.

Ajout de panorama
  • Pour ajouter un nouveau panorama, ouvrez la page de configuration du module et cliquez sur le bouton'+' ('Ajouter un nouvel élément') (1).

  • Vous verrez les paramètres panoramiques décrits ci-dessous.

    • Sélectionner un fichier - choisissez un fichier panoramique; ce champ est requis (au moins pour la langue par défaut).
    • Titre - entrez un titre pour le panorama; ce champ est requis (au moins pour la langue par défaut).
    • Largeur - largeur du bloc panoramique; ce champ est requis.
    • Hauteur - hauteur du bloc panoramique; ce champ est requis.
    • Etat - activer/désactiver l'élément panoramique sur la page d'accueil.
    • Loop - commencez à faire tourner l'image depuis le début après sa fin.
    • Animer - option pour afficher le panorama en rotation automatique pendant le chargement de la page.
    • Durée d'image(apparaît si 'Animer' est réglé sur 'Oui') - le période pendant laquelle l'image panoramique fait un cercle complet; devrait être entré en millisecondes; ce champ est requis.
  • Appuyez sur le bouton 'Enregistrer' et votre image panoramique apparaîtra sur la page d'accueil.

Suppression de panorama
  • Pour supprimer le panorama - choisissez l'élément, cliquez sur la flèche du bouton (1), puis cliquez sur 'Supprimer' (2).

  • Ensuite, confirmez la suppression.



Filtre Avancé TM

Introduction

Le module Filtre Avancé TM offre une opportunité de réaliser une recherche rapide du produit nécessaire en fonction des principales fonctionnalités. Il permet de créer des filtres avec le nombre illimité de critères de recherche, qui sont disponibles dans le magasin par défaut ou sont créés lors de l'ajout des produits. Les critères de filtrage peuvent être les suivants: niveaux de catégories (par nidification), fabricants, fournisseurs, attributs, fonctionnalités et plus. De plus, le module possède les caractéristiques suivantes: la création de filtres connectés, dont les critères nécessaires seront disponibles uniquement après avoir sélectionné le paramètre parent (niveau de nidification est illimité); la sélection de la grille de critères pour le filtre haut de la page. Vous pouvez sélectionner le type de champ de filtrage, spécifier le filtre parent, ajouter son nom, son label et sa description. Tout est facilement configuré et édité dans le panneau d'administration. Pour accélérer la recherche, le module utilise l'algorithme d'indexation des produits selon les critères définis. Il peut être facilement et rapidement inséré dans un magasin Prestashop de toute sorte.

Installation et suppression du module

Le module est installé et supprimé comme tout autre module PrestaShop.

Après avoir supprimé ou réinstallé le module, tous les paramètres et filtres du module sont rejetés.

Configuration/édition du filtre

Après l'installation du module, vous pouvez le configurer sur la page de configuration du module. Par défaut, vous verrez les onglets avec les types de filtre disponibles. Pour commencer, sélectionnez un onglet (1) et appuyez sur le bouton 'Créer un filtre' (2).

Dans la fenêtre apparue, remplissez tous les champs requis.

  • Nom - le nom du filtre. Il sera affiché sur le frontend comme titre de bloc de filtrage;
  • Description - la description du filtre. Il sera affiché sur le frontend à côté du titre du bloc de filtrage;
  • Afficher Compteur - permet d'afficher le nombre de produits qui seront disponibles après avoir sélectionné le paramètre actuel. Le numéro sera affiché à côté du critère de recherche (entre parenthèses);
  • Afficher Filtres Sélectionnés - permet d'afficher la liste des critères de recherche sélectionnés avec la possibilité de désélectionner l'un d'eux;
  • Afficher Type de Disposition du Filtre - la sélection de la grille de filtrage (disponible uniquement pour le filtre supérieur);

Veuillez noter qu'il n'y a pas de champs obligatoires. Si vous laissez tous les champs vides, un filtre en colonne simple sans description et titre sera créé.

Modification du filtre

Pour modifier la description et les paramètres du filtre, appuyez sur le bouton 'roue dentée' dans le menu du filtre.

En mode édition, la forme ressemble et fonctionne comme en mode de configuration.

La sélection de grille de filtrage est disponible uniquement pour 'Filtre supérieur'.

Lors de la modification de la grille de filtre, tous les éléments seront automatiquement transférés à la première colonne, en gardant l'ordre de nidification et d'affichage (basée sur le principe: Tous les éléments de la colonne précédente avec l'ordre d'affichage restent à l'intérieur).

Suppression du filtre

Pour modifier la description ou les paramètres du filtre, appuyez sur 'Croix' dans le menu du filtre

et confirmez la suppression du filtre.

Après la suppression d'un filtre, toutes les données seront perdus à jamais.
Indexation du filtre

Indexation - le processus de création de tables uniques avec les données nécessaires au filtre, créé pour les critères spécifiques au filtre. Il permet d'accélérer considérablement le travail de filtrage sur le frontend.

Le bouton correspondant dans le menu du filtre apparaît en rouge. Si le bouton n'est pas en surbrillance, le filtre n'a pas besoin d'indexation.

Le processus de ré-indexation peut prendre un certain temps, selon le nombre de produits en magasin et des critères de filtre sélectionnés.

Si le filtre nécessite une ré-indexation, ca ne sera pas affiché sur le frontend.

Création/édition d'éléments de filtre (critères)

Pour ajouter un élément au filtre, sélectionnez-le dans le panneau des éléments disponibles (à gauche) et faites-le glisser vers la zone disponible de la grille (celui-ci s'allumera après avoir été sélectionné. Dans l'exemple, la grille comporte 2 colonnes).

Dans la zone en surbrillance, sélectionnez la colonne et la position du nouvel élément et déposez-le.

Dans la fenêtre de création apparue, fournissez toutes les données nécessaires:

  • Nom - le nom de l'élément de filtre sur le frontend. Il ne sera pas affiché si vous laissez le champ vide.
  • Label - l'étiquette de l'élément de filtre sur le frontend. Il ne sera pas affiché si vous laissez le champ vide.
  • Description - la description de l'élément de filtre sur le frontend. Il ne sera pas affiché si vous laissez le champ vide.
  • Filtre parent - l'élément parent du filtre, après l'avoir sélectionné, l'élément enfant sera disponible. Il ne sera pas affiché si vous laissez le champ vide.
  • Type de champ de filtre - la manière dont l'élément sera affiché sur le frontend. Les types suivants sont disponibles:
    • radio
    • choisir
    • case à cocher
    • sélection de gamme (uniquement pour le type 'prix')
    • entrée de gamme (uniquement pour le type 'prix')

Vous pouvez modifier toutes les données et l'élément parent en mode d'édition de filtre.

Après avoir édité l'élément, le filtre doit être re-indexé. C'est indiqué par le bouton dans le menu du filtre. Ne réindeciez pas le filtre après avoir modifié chaque élément, vous pouvez le faire après avoir appliqué des modifications à tous les éléments nécessaires - vous économiserez votre temps.

S'il existe un arbre de filtres connectés, vous pouvez ajouter le nouvel élément en rapport avec cet arbre.

Modification de l'élément du filtre

Pour modifier un élément de filtre, appuyez sur le bouton 'roue dentée' (1) dans le coin supérieur droit du filtre.

Tri (ordre d'affichage des éléments de filtre)

Par défaut, les nouveaux éléments sont affichés après l'élément dans l'ordre où vous les avez ajouté. Si le filtre est ajouté à l'arbre, il sera affiché après les éléments existants.

Pour déplacer les éléments à l'intérieur du filtre, sélectionnez l'élément nécessaire et faites-le glisser vers la position souhaitée. Vous pouvez faire glisser des éléments dans une colonne, ainsi qu'à d'autres colonnes de la grille. Vous pouvez également modifier le tri dans l'arbre ou déplacer l'arbre entier en même temps.

Après avoir déplacé l'élément d'une colonne à l'autre, l'ordre d'affichage changera automatiquement dans toutes les colonnes.

Suppression de l'élément du filtre

Vous pouvez supprimer un élément de filtre de deux façons:

  • faites glisser l'élément vers la colonne des éléments disponibles;

  • au appuyez sur 'Croix' dans le coin supérieur droit de l'élément nécessaire.

Peu importe la méthode choisie, vous verrez une fenêtre de suppression de confirmation.

Après avoir supprimé un filtre avec des éléments imbriqués, tous les éléments imbriqués seront supprimés.

Après avoir supprimé un élément, le filtre doit être réindexé. C'est indiqué par le bouton dans le menu du filtre. Ne réindeciez pas le filtre après avoir modifié chaque élément, vous pouvez le faire après avoir appliqué des modifications à tous les éléments nécessaires - vous économiserez votre temps.

Réindexation "Intelligente"

Le module fournit la réindexation automatique (smart) après avoir fait des modifications aux produits ou après d'autres changements cruciaux (fabricant, attribut, etc.). Les champs de table seront réindexés, si ces modifications ont affecté le fonctionnement du filtre.

Si, après avoir effectué des modifications, le filtre ne les prenait pas automatiquement, entrez la page des paramètres du filtre et réindeciez-le manuellement.

Le filtre ne sera pas réindexé automatiquement après l'ajout de la devise, c'est pourquoi il doit être réindexé manuellement.

FAQ

  • J'ai créé un filtre, mais je ne le vois pas sur le frontend.
  • J'ai ajouté le nom et la description du filtre, mais ils ne sont pas affichés sur le frontend.
  • J'ai ajouté des éléments au filtre, mais ça a arrêté d'afficher.
  • Je veux que l'élément soit disponible uniquement après la sélection d'un autre élément.
  • Je veux échanger des éléments.
  • Je souhaite supprimer un élément parent, mais je souhaite garder tous les éléments imbriqués. Comment y parvenir?
  • Je souhaite modifier la grille de filtre, mais je ne veux pas créer de nouveau le filtre. Que puis-je faire?
  • Comment créer un filtre complètement nouveau, s'il existe déjà un filtre pour cette position?
  • Le filtre a arrêté d'afficher sur le frontend.
  • Pourquoi tous les éléments ne sont pas actifs sur le frontend?
Le filtre ne s'affichera pas, s'il n'y a pas d'éléments ou s'il n'est pas réindexé.
Assurez-vous qu'il y a des éléments dans le filtre et qu'il a été réindexé.
Vous avez ajouté des données, mais, peut-être, pas pour toutes les langues. N'oubliez pas que le module est multilingue et remplissez les données pour chaque langue séparément.
Assurez-vous que vous avez réintégré le filtre après avoir effectué des modifications.
Sélectionnez l'élément, après l'avoir sélectionné, l'élément souhaité devrait être disponible, et définissez-le comme l'élément parent.
Il suffit de faire glisser l'élément vers l'endroit où vous souhaitez le localiser. Il prend automatiquement le nouveau poste et cela n'affectera pas les fonctionnalités du filtre.
Dans le menu pour éditer le premier élément imbriqué, rejetez la connexion avec l'élément parent que vous souhaitez supprimer, puis supprimez l'élément parent. Dans ce cas, pas tous les éléments imbriqués seront supprimés.
Entrez le menu d'édition et sélectionnez une nouvelle grille pour le filtre, puis enregistrez les modifications. Tous les éléments du filtre s'affichent dans la première colonne de la nouvelle grille. Ensuite, vous pouvez les déplacer vers les positions nécessaires.
Pour créer un nouveau filtre, supprimez celui-ci.
ssurez-vous que le filtre ne nécessite pas d'indexation.
Vérifiez si l'élément n'est pas un enfant pour l'élément qui n'est pas actif à ce moment. Assurez-vous qu'il existe des produits répondant aux critères spécifiés.


Badges de Catégories TM

Ce module permet d'ajouter des badges aux catégories de la barre latérale du module par défaut Catégories ("Blockcategories"). Les badges peuvent être ajoutés à la catégorie de tout niveau et toute langue. Le champ de texte de l'étiquette est obligatoire et doit être rempli dans toutes les langues. Si ce champ est laissé vide, il prend automatiquement le texte de la langue par défaut.

Installation et suppression du module

Le module est installé et supprimé comme tout autre module PrestaShop.

Configuration du module

Après l'installation, vous pouvez modifier ses paramètres sur la page de configuration du module.

Vous pouvez ajouter des badges à n'importe quelle catégorie après l'avoir sélectionné dans la liste déroulante.

Attention! Vous pouvez ajouter un seul badge pour chaque catégorie.

Ensuite, vous pouvez ajouter du texte qui apparaîtra dans le badge et sélectionner le style dans la liste déroulante (les styles peuvent varier dans les différents modèles).

Puis appuyez sur le bouton 'Enregistrer' (1).

Vous pouvez voir la liste des badges existants ci-dessous. Ici, vous pouvez éditer ou supprimer des badges avec les boutons correspondants.

Le module est multilangue et prend en charge les multi-magasins. Vous pouvez ajouter des badges pour un groupe de magasins ou tous les magasins à la fois. Ils apparaissent dans la liste des éléments séparés.



Curseur D'image de Categorie TM

Module permet de créer des diapositives multilingues pour toute catégorie du magasin. Le curseur s'affiche sur les pages de la catégorie.

Installation et suppression

La procédure d'installation est habituelle, Le module peut être installé et supprimé comme tout autre module PrestaShop.

Paramètres du module

Après l'installation du module, vous pouvez configurer ou modifier les options nécessaires sur la page de configuration du module.

  • Mode - le type d'animation (fondu, vertical, horizontal).
  • Vitesse - la vitesse d'animation.
  • Largeur - la largeur des glissières (pour la vue correcte, il est recommandé d'utiliser la largeur de l'image réelle).
  • Hauteur - la hauteur des glissières (pour la vue correcte, il est recommandé d'utiliser la hauteur de l'image réelle).
  • Auto - une lecture automatique lorsque la page est ouverte.
  • Pause - le temps avant la transition vers la diapositive suivante.
  • Hover Automatique - la pause sur hover.
  • Contrôles - les boutons "Suivant"/"Précédent" buttons.
  • Texte Suivantt - le texte du bouton "Suivantt".
  • Texte Précédent - le texte du bouton "Précédent".
  • Contrôles Automatiques - les boutons "Play"/"Pause".
  • Pager - la pagination.
Ajout/suppression/édition de diapositives

Après l'installation du module, vous verrez le nouveau champ "Diapositives" dans les paramètres de catégorie.

Pour ajouter une diapositive, cliquez sur le bouton "Ajouter Nouvelle Diapositive". Remplissez les champs requis dans le formulaire.

  • Sélectionnez un fichier - sSélectionnez votre fichier. Vous pouvez télécharger différentes images pour chaque langue. S'il n'y a pas d'image sélectionnée pour la langue spécifique, un ensemble d'images pour la langue par défaut sera chargé.
  • Entrez Titre de Diapositive - tpez le titre de la diapositive.
  • Entrer URL de Diapositives - fournissez l'URL de la diapositive.
  • Entrer Légende de Diapositive - tapez la légende de diapositive.
  • Ouvrir dans une Nouvelle Fenetre - ouvrez dans une nouvelle fenêtre.
  • Etat - activer/désactiver la diapositive.

Lorsque la diapositive est enregistrée, elle apparaîtra dans une liste de diapositives de catégorie.

Pour modifier la diapositive, cliquez sur le bouton 'Editer'.

Pour supprimer la diapositive, cliquez sur 'Supprimer' sous le bouton 'Editer'.

Les diapositives ne peuvent être ajoutées qu'aux catégories enregistrées.


Produits de Catégorie TM 1.0.0

Ce module affiche des produits de catégorie en crochets displayHome et displayHomeTabContent. Le module permet d'afficher des produits individuels, des produits d'une catégorie ou de tous les produits. En outre, le module est livré avec un carrousel qui fonctionne, lorsque le module occupe la position displayHome.

Panneau principal de >Produits de Catégorie TM

Le panneau principal. Ici, vous pouvez configurer le module.

Ajout d'un onglet

'Onglet" est un bloc qui affiche les produits en position displayHomeTabContent.

  • Accédez au panneau principal du module et appuyez sur le bouton 'plus' (1) dans la liste des onglets.

  • Dans la fenêtre apparue, vous verrez les options suivantes:

    • Etat - cette option permet d'activer/désactiver l'onglet.
    • Choisir une catégorie - la catégorie dont les produits seront affichés.
    • Utiliser le nom propre - cette option permet de modifier le nom de catégorie affiché. Si cette option est activée, le formulaire suivant sera affichéed:
      • Nom - le nom de l'onglet propre, affiché sur le site.
    • Sélectionner les produits à afficher - si désactivé, affiche le champ 'Nombre de produits à afficher', qui définit le nombre de produits à afficher. Si activé, affiche le bouton 'Ajouter des produits' qui permet de sélectionner les produits à afficher dans l'onglet.
  • Après avoir configuré toutes les options nécessaires, appuyez sur le bouton 'Enregistrer' (2).

Ajout d'un bloc

Ce bloc permet de sélectionner des produits dans la position displayHome.

  • Accédez au panneau principal du module et appuyez sur le bouton 'plus' (1) dans la liste des blocs.

  • Dans la fenêtre apparue, vous verrez les options suivantes:

    • Etat - cette option permet d'activer/désactiver le bloc.

    • Choisir une catégorie - la catégorie dont les produits seront affichés.
    • Utiliser le nom propre - cette option permet de modifier le nom de catégorie affiché. Si cette option est activée, le formulaire suivant sera affichéed:
      • Nom - le nom de l'onglet propre, affiché sur le site.
    • Sélectionner les produits à afficher - si désactivé, affiche le champ 'Nombre de produits à afficher', qui définit le nombre de produits à afficher. Si activé, affiche le bouton 'Ajouter des produits' qui permet de sélectionner les produits à afficher dans l'onglet.
    • Utiliser le carrousel - cette option permet d'activer/désactiver le carrousel pour les produits de blocs. Après avoir activé l'option, vous verrez les paramètres suivants:v

      • Eléments visibles - le nombre de fabricants visibles.

      • Défilement des éléments - le nombre de fabricants représentés lors de défilement du carrousel.

      • Largeur de diapositive - la largeur de l'élément dans le carrousel.

      • Marge de diapositive - la marge de l'élément dans le carrousel.

      • Défilement automatique - le défilement automatique.

      • Vitesse du carrousel - la vitesse de changement d'éléments.

      • Pause - la pause entre les défilements (si 'Défilement automatique' est activé).

      • Aléatoire - le carrousel commence par l'élément aléatoire.

      • Boucle de carrousel - le boucle: quand tous les objets du carrousel ont été affichés, le carrousel revient au début.

      • Masquer le contrôle à la fin - masquer les boutons de contrôle (Suivant/Précédent).

      • Pager - afficher la pagination.

      • Contrôle - afficher les contrôles Suivant/Précédent.

      • Contrôle automatique - afficher les contrôles (Lecture/Pause).

      • Hover automatique - une pause lors du survol des éléments du carrousel.

  • Après avoir configuré toutes les options nécessaires, appuyez sur le bouton 'Enregistrer' (2).

Tri des blocs/onglets

Vous pouvez trier les blocs du module avec l'aide de glisser-déposer. Cela permet de changer rapidement les blocs et les onglets.

Sélection des produits

Si vous créez un élément et activez l'option 'Sélectionner les produits à afficher', vous pouvez choisir les produits que vous souhaitez afficher. Pour faire ça:

  • Appuyez sur le bouton 'Ajouter des produits' (1):

  • Dans la fenêtre pop-up, sélectionnez les produits nécessaires (2) et appuyez sur le bouton 'Ajouter' (3):

  • Maintenant, vous pouvez placer les produits ajoutés où vous voulez avec l'aide de glisser-déposer. (4):

  • Lorsque tous les produits nécessaires sont ajoutés et arrangés dans l'ordre souhaité, appuyez sur le bouton 'Enregistrer'.

Suppression de blocs/onglets

Pour supprimer des éléments, appuyez sur le menu déroulant à côté du bloc/onglet nécessaire (1) et appuyez sur Supprimer (2). L'élément sera supprimé.



Collections TM

Le module Collections TM est créé pour permettre aux visiteurs du magasin d'ajouter des produits aux collections et partager ces collections sur Facebook.

Installation du module

Pour installer le module, accédez au panneau Administration -> Modules et Services -> Modules et Services et trouver le module > Collections TM (2), puis cliquez sur le bouton 'Installer' (3).

Configuration du module

Une fois le module installé, la page 'Paramètres' apparaîtra.
Ajoutez l'ID de l'application Facebook au champ requis (1) et appuyez sur le bouton 'Enregistrer' (2).
Les instructions sur la façon d'obtenir ID de l'application Facebook peuvent être trouvées ici: Creating an App ID.

Utilisation du module Collections TM

Ajout de produit à la collection

Les visiteurs du magasin doivent être connectés pour pouvoir ajouter les éléments aux collections.

  • Une fois le module installé, le bouton 'Ajouter à la collection' apparaît sur chaque page de produit. Il devrait ressembler à la capture d'écran ci-dessous. (1).

  • Après avoir appuyé sur ce bouton, un visiteur du magasin verra une notification: 'Le produit a été ajouté avec succès à votre collection.' Il peut être fermé ou ignoré en cliquant sur le bouton 'Mes collections' (2).

Parcourir les collections
  • Dans la page "Mes collections", un client peut ajouter la nouvelle collection (1) ou afficher la liste des créés (2).

  • En cliquant sur le bouton 'Afficher la collection' (1), vous ouvrirez la page de la collection, le bouton 'Afficher les produits' (2) permet de voir la liste des produits de cette collection sur la page actuelle.
    Le titre de la collection peut être modifié (3) ou supprimé (4).
    Pour partager la collection, le visiteur doit appuyer sur le bouton 'Partager' (5).

  • Tout en regardant les éléments de la collection, après avoir cliqué sur le bouton 'Afficher les produits', chaque élément peut être retiré de la liste (1).

Partager des collections

Pour partager la collection, le visiteur doit appuyer sur le bouton 'Partager'. Il y aura quelques étapes simples à suivre avant de publier la collection. Au cours de chaque étape, il est possible de retourner en arrière et de modifier les options de partage.

  • La première étape consiste à choisir la disposition pour la collection qui sera affichée.

  • Ensuite, les produits devraient être ajoutés. Chaque cellule avec le signe '+' est un bouton pour ajouter l'image du produit.

    Choisissez les images de chaque produit:

  • Lorsque toutes les images sont ajoutées, le visiteur doit appuyer sur le bouton 'Partager'(1).

  • Dans une petite fenêtre apparu, il y aura des options d'affichage standard pour choisir et la possibilité d'ajouter du texte à la publication (1).Après avoir cliqué sur le bouton 'Partager sur Facebook' (2), la publication sera publiée.

Statistiques

En utilisant ce module, vous pouvez également obtenir les statistiques collectées sur les produits sont ajoutés aux collections. Ainsi, vous saurez quels produits sont actuellement populaires. Cette information peut être très utile pour suggérer un reduction par exemple.
Vous pouvez afficher les statistiques en naviguant vers le panneau d'administration -> Stats -> Stats -> Collections TM.

  • Vous pouvez sélectionner la période de visualisation des statistiques à partir du moment spécifié (1).
  • Dans la première colonne, il existe plusieurs ajouts de produit (2).
  • La deuxième colonne est créée pour votre commodité. Vous pouvez l'utiliser pour voir combien de produits ajoutés ont été vendus (3).


Promo du Jour TM

Ce module vous permet d'afficher la liste des produits avec le compte à rebours de réduction. Vous pouvez également ajouter une minuterie aux produits de la page d'accueil, sur les pages de catégories et les pages des produits complets.

Installation et suppression

Le module est installé et supprimé de la même manière que tout autre module PrestaShop.

Paramètres du module

Après l'installation du module, vous pouvez ajouter une réduction de produit avec la période d'affichage et un compte à rebours.

Ajout/suppression/édition de blocs
  • Pour ajouter un nouveau produit, appuyez sur le bouton "Ajouter un Nouveau"

    • Choisir un Produit - sélectionnez un produit pour appliquer la réduction et affichez une minuterie.
    • Etat - l'état de l'élément.
    • Date de Début - la date de début de la période de réduction.
    • Date de Fin - la date de fin de la période de réduction.
    • Label - l'étiquette du produit.
    • Prix Réduit - le prix Réduit(valeur absolue ou en pourcentage).
  • Après avoir enregistré l'élément, il apparaît dans la liste des éléments de ce type.

  • Pour modifier cet élément, appuyez sur le bouton 'Éditer'.

  • Pour supprimer cet élément, appuyez sur le bouton 'Supprimer'.

  • Si un prix spécial, valable pour une certaine période, a été fixé au produit précédemment, ce produit peut être ajouté à la liste des éléments du module.

Configuration de l'affichage du produit
  • Pour changer le mode d'affichage du produit, appuyez sur le bouton 'Configuration'.

  • TEnsuite, un formulaire avec la configuration de l'affichage du produit apparaîtra.

    • Produits à afficher - le nombre de produits à afficher dans le bloc de la page d'accueil.
    • Produits aléatoires - l'affichage des produits aléatoires.


TM Google Map 1.1.5

Ce module permet d'ajouter Google Map avec les emplacements des magasins et leur brève description sur votre première page. La carte affichera les adresses de tous les magasins liés à votre boutique en ligne.

Installation et suppression

Le module est installé et supprimé de la même manière que tout autre module PrestaShop.

Paramètres du module

Après l'installation du module, vous pouvez ajouter des magasins à la carte. Après avoir appuyé sur le bouton "Ajouter Nouveau Magasin" (1),Vous serez redirigé vers l'onglet 'Contacts de magasin' où vous pouvez éditer vos magasins.

Pour ajouter un nouveau magasin, appuyez sur le bouton 'Ajouter Un Nouveau'.

  • Sélectionnez un Magasin - sélectionnez le magasin que vous souhaitez ajouter à la carte.
  • Etat - l'état de l'élément.
  • Marqueur - l'ajout d'un marqueur personnalisé.
  • Texte personnalisé - l'ajout d'un texte personnalisé.
Paramètres d'affichage Google Map

  • Style de Carte - sélectionnez le style d'affichage de la carte.
  • Type de Carte - sélectionnez le type d'affichage de la carte.
  • Niveau de Zoom - spécifiez le niveaudu zoom carte (de 1 à 17).
  • Zoom sur Défilement - activer/désactiver le zoom de la carte sur le défilement.
  • Contrôles de Carte - activer/désactiver les contrôles de la carte.
  • Street view - activer/désactiver l'outil Street View.
  • AMarqueur d'animation - activer/désactiver le marqueur d'animation.
  • Popup - activer/désactiver les fenêtres contextuelles avec des informations sur les magasins.


Header Compte TM 2.0

Si vous avez la version 1.n de ce module installé dans Prestashop, il n'est pas recommandé de le mettre à jour. Vous devez d'abord supprimer l'ancienne version du module de fonctionner sans erreurs.

Ce module affiche les formulaires de connexion et d'inscription sur le site. Il peut prendre les positions suivantes: en-tête, colonne gauche et droite. Le module permet de se connecter et d'inscrire à l'aide de réseaux sociaux tels que Facebook, Google+ et VK. C'est pratique pour les utilisateurs du site. L'inscription ou la connection se poursuivent sans recharger la page.

Panneau principal de Header Compte TM

Le panneau principal. Vous pouvez configurer le module ici.

Paramètres

Il existe les paramètres suivants dans le module:

  • Type d'affichage - this setting allows to select the way to display the registration form. It can take the following values:

    • Menu déroulant - le formulaire apparaîtra sous la forme d'un menu déroulant sous le bouton l'ouvrant.
    • Pop-up - le formulaire apparaîtra dans une fenêtre contextuelle.
    • Côté gauche - le formulaire apparaîtra à gauche comme une barre latérale.
    • Côté droit - le formulaire apparaîtra droite comme une barre latérale.
  • Style d'affichage après la connexion - Ce paramètre permet de modifier la vue après la connexion / l'enregistrement. Vous pouvez utiliser les valeurs suivantes:

    • Deux colonnes - la liste est divisée en deux colonnes.
    • Une colonne - la liste des liens s'affiche sous la forme d'une seule colonne.
  • Avatar par défaut - ce champ apparaît uniquement si l'option 'Afficher Avatar' est activée. Ici, vous pouvez sélectionner l'avatar de l'utilisateur par défaut.
  • Afficher Avatar - ce paramètre permet d'activer ou de désactiver l'avatar de l'utilisateur. Si l'utilisateur se connecte au compte avec l'aide d'un des réseaux sociaux, l'avatar sera retiré du compte dans ce réseau social, sinon, l'avatar chargé par l'administrateur du site, sera affiché.
  • Utiliser la redirection - Si ce paramètre est activé, l'enregistrement de l'utilisateur et la récupération du mot de passe auront lieu, sur la page de récupération de mot de passe PrestaShop par défaut.
  • Utiliser la connexion Facebook - ce paramètre permet d'activer l'enregistrement des utilisateurs et de se connecter avec l'aide du réseau social Facebook. Une fois vous activez cette option, vous verrez les paramètres suivants:

    • ID d'application - votre ID à partir du compte Facebook .
    • Secret d'application - votre secret d'application du compte Facebook.
  • Utiliser la connexion Google - ce paramètre permet d'activer l'enregistrement des utilisateurs et de se connecter avec l'aide du réseau social Google+. Si vous activez cette option, vous verrez les paramètres suivants:

    • ID d'application - votre ID à partir du compte Google+.
    • Secret d'application - votre secret d'application du compte Google+.
    • URIs de redirection - le lien de votre magasin en ligne + index.php?fc=module&module=tmheaderaccount&controller=googlelogin
  • Use VK Login - this setting allows to enable user registration and login with the help of VK social network. If you enable this option, you will see the following settings:

    • ID d'application - votre ID à partir du compte VK.
    • Secret d'application - votre secret d'application du compte VK.
    • URIs de redirection - le lien de votre magasin en ligne + index.php?fc=module&module=tmheaderaccount&controller=vk
Enregistrement d'applications dans les réseaux sociaux:


Home Galerie des Categories TM

Le module affiche une galerie de catégories sur votre page d'accueil.

Il devrait ressembler à quelque chose comme ça:

Voici les principales parties de l'élément Galerie de Catégorie, qui sont marquées sur la capture d'écran:

  • 1 - Contenu HTML
  • 2 - Nom de catégorie
  • 3 - Description de la catégorie
  • 4 - Bouton

Vous pouvez trouver les détails de la personnalisation ci-dessous dans la section 'Configuration du module'.

Installation du module

Le module est installé et supprimé de la même manière que tout autre module PrestaShop.

Configuration du module

  • Après avoir installé le module Home Galerie des Categories TM, vous pouvez le configurer en cliquant sur le bouton correspondant (1).

  • Sur la page de configuration, vous verrez la liste des éléments de ce module.Vous pouvez modifier les éléments existants (1) ou ajouter un nouvel élément (2).

Ajout/Modification des options d'article
Remarque: le nom de la catégorie, la description et l'image sont chargées à partir des propriétés de la catégorie et on n'a pas besoin de les ajouter manuellement. Pour modifier ces options, accédez au Panneau d'administration -> Catalogue -> Catégories -> choisissez la catégorie -> Éditer.

Lorsque vous ajoutez un nouvel élément au module (ou modifiez celui de la liste des éléments), vous avez quelques options à choisir. La description détaillée des options que vous pouvez voir ci-dessous la capture d'écran. Une fois toutes les options définies, cliquez sur le bouton 'Enregistrer' (1).

  • Choisir une catégorie - ici, vous choisissez dans la liste déroulante la catégorie qui devrait être affichée sur votre page.
  • Classe spécifique - la classe spécifique peut être ajoutée à l'élément du module.
  • Afficher un nom - l'option pour afficher ou masquer le nom de la catégorie.
  • Longueur du nom de la catégorie - le nombre maximal de symboles à afficher dans le nom de la catégorie. Si la description est plus longue - le symbole '..' sera ajouté après le nombre de symboles défini.
  • Afficher la description - l'option pour afficher ou masquer la description de la catégorie.
  • Longueur de la description - le nombre maximal de symboles à afficher dans la description. Si la description est plus longue - le symbole '..' sera ajouté après le nombre de symboles défini.
  • Ordre de tri - l'ordre des articles dans la galerie des catégories.
  • Bouton d'affichage - l'option pour afficher ou masquer le bouton 'Achetez!' (le texte du bouton peut être différent selon le modèle).
  • Etat - l'option de montrer ou masquer la catégorie.
  • Contenu HTML - le champ où un contenu HTML peut être ajouté.

Combinaisons Homepage TM

Ce module présente les combinaisons de produits sélectionnées dans les positions disponibles: top (displayTop), home (displayHome), left (displayLeftColumn), right (displayRightColumn).

Panneau Principal de Combinaisons Homepage TM

C'est le panneau principal du module qui vous permet d'ajouter, de modifier et de supprimer des éléments. Pour créer un nouvel élément, appuyez sur le bouton 'Ajouter un Nouvel Elément' (1) dans le menu du panneau principal.

Remplissez les champs de formulaire.

  • Produit - sélectionnez le produit.
  • Hook - choisissez la position de l'élément.
  • Titre - spécifiez le titre de l'article.
  • Etat du titre - si cette option serait désactivée, le titre de l'élément ne sera pas affiché.
  • Etat d'objet - si cette option est désactivée, l'élément n'apparaîtra pas dans sa position.
  • Ordre de tri - l'ordre de tri de l'objet.

Appuyez sur le bouton 'Enregistrer & Rester' lorsque tous les champs sont remplis. Attendez jusqu'à la page recharge et appuyez sur 'Ajouter une Nouvelle Combinaison'.

Choisissez la combinaison requise de la liste et cliquez sur le bouton 'Ajouter' (1).

Remplissez les champs requis dans la forme qui apparaît.

  • Sélectionner une image - choisissez l'image désirée.
  • Classe spécifique - la classe personnalisée, définit le style d'élément (classe CSS).
  • Ordre de tri - l'ordre de tri de l'objet.

Appuyez sur le bouton 'Enregistrer' lorsque tous les champs sont remplis.

Après avoir créé quelques combinaisons actives, la liste des combinaisons disponibles s'affichera de la manière suivante.

Appuyez sur le bouton 'Enregistrer' (1) sur le formulaire d'élément lorsque vous ajoutez toutes les combinaisons.

Cet élément apparaîtra de la manière suivante sur le panneau principal du module:

Le bloc suivant sera affiché dans le crochet sélectionné.

Home Carrousel des Produits TM

Le module ajoute un carrousel aux onglets de la page principale.

Installation et suppression

Le module est installé et supprimé de la même manière que tout autre module PrestaShop.

Configuration du module

Les paramètres du module installé peuvent être configurés sur la page de configuration du module.

  • Utiliser le Carrousel
    activer/désactiver le carrousel
  • Nombre d'éléments à afficher
    le nombre d'éléments à afficher
  • Défilement des élément
    le nombre d'éléments à défiler
  • Largeur d'un élément
    la largeur d'un élément dans la liste du carrousel
  • Marge d'un élément
    la marge entre les éléments de la carrousel
  • Vitesse du carrousel
    la durée de transition d'élément
  • Pause
    le temps entre chaque transition automatique (si l'option "Défilement automatique" est activée)
  • Défilement automatique
    activer le défilement automatique du carrousel
  • Aléatoire
    démarrer le carrousel à partir d'un objet aléatoire
  • Boucle de carrousel
    carrousel revient au début lorsque tous les éléments ont été défilés
  • Masquer le contrôle à la fin
    masquer les boutons de navigation (suivant/précédent) sur la dernière diapositive
  • Pager
    afficher la pagination
  • Contrôle
    afficher les boutons suivants/précédents
  • Contrôle automatique
    afficher les boutons de lecture/pause
  • Hover automatique
    arrêter le carrousel lorsque la souris survolte sur des objets de carrousel


Contenu HTML TM

Ce module permet d'afficher tout contenu (image, HTML, liens, etc.) dans les positions suivantes: displayNav, home,top, topColumn, left and right (displayLeftColumn/displayRightColumn), footer. Il permet d'élargir les opportunités de conception et d'ajouter des blocs de publicité/informations à votre magasin. C'est un module multilingue.

Pour ajouter le contenu, vous devez suivre les étapes ci-dessous:
Naviguez dans Modules -> Fonctionnalités Front Office -> Contenu HTML TM (s'il n'est pas installé, installez-le).
  • Appuyez sur le bouton 'Ajouter un nouveau'.
  • La liste des langues disponibles. Vous pouvez afficher les éléments disponibles pour toutes les langues en basculant les onglets de langue.
  • La liste des éléments ajoutés pour une position spécifique et la langue.
Ajout de l'élément. Appuyez sur le bouton Ajouter un élément et remplissez les paramètres requis (aucun des champs sont obligatoires).

Tous les éléments d'une langue ajoutée à la même position seront affichés sur le back-end et sur le front-end .

  • Langue
    sélectionnez la langue requise dans la liste déroulante.
  • Titre
    le titre de l'élément.
  • Utiliser le titre sur frontend
    afficher le titre sur le frontend.
  • Crochet
    la position où l'élément est ajouté.
  • Image
    télécharger l'image de votre ordinateur.
  • Largeur de l'image
    la largeur de l'image à l'interface.
  • Hauteur de l'image
    la hauteur de l'image à l'interface
  • URL
    ajoutez le lien (le bloc entier sera 'enveloppé' dans le lien).
  • Target _blank
    ouvrir un lien dans un nouvel onglet
  • HTML
    le code HTML (sauf le lien, si vous l'avez ajouté dans le champ URL) ou le texte.
  • Sauvegarder
    cliquez pour enregistrer l'élément.
Modification et suppression de l'élément

Lorsque vous ajoutez l'élément, il apparaît dans la liste correspondante.

  • Langue où les éléments ont été ajoutés.
  • Position où les éléments ont été ajoutés.
  • Bouton 'Modifier' avec la liste déroulante.
  • Bouton Supprimer.
Édition
Cliquez sur le bouton Editer pour modifier l'élément.

Dans la fenêtre apparue, modifiez tous les champs requis.

  • Activer
    afficher l'élément à l'interface.
  • Titre de l'image
    le titre de l'élément.
  • Utiliser le titre sur frontend
    afficher le titre sur le frontend.
  • Crochet auquel l'image doit être attachée
    la position de l'élément.
  • Charger votre image
    l'image d'élément.
  • Largeur de l'image
    la largeur de l'image à l'interface.
  • Hauteur de l'image
    la hauteur de l'image à l'interface
  • Lien cible
    affectez le lien à l'élément.
  • Ouvrir un lien dans un nouvel onglet/page
    ouvrir un lien dans un nouvel onglet.
  • Code HTML facultatif
    modifier le code HTML.
  • Sauvegarder
    Enregistrer les modifications.
La modification de l'ordre des éléments dans la liste
Pour changer l'ordre des éléments,Vous devez simplement faire glisser l'élément vers la position nécessaire.

Défilement Infini TM

Avec l'aide de ce module, vous pouvez ajouter des produits AJAX aux pages avec un bloc d'annonces. La fonctionnalité du module permet de configurer le chargement automatique des produits sur le défilement ou lorsque vous appuyez sur le bouton 'Afficher plus'. En outre, le module fonctionne avec les filtres de produits par défaut de PrestaShop.

Panneau Principal de TM Défilement Infini

C'est le panneau principal où vous pouvez configurer le module:

Configuration du module
  • Pages - pages, où le module est censé fonctionner.
  • Chargement automatique - si cette option est activée, les produits seront automatiquement chargés sur le défilement. Sinon, si l'option est désactivée, vous verrez le bouton 'Afficher plus' et les produits seront chargés, lorsque vous appuyez sur ce bouton.
  • Décalage - cette option s'affiche lorsque 'Chargement automatique' est activé. Il permet de déterminer le décalage avant la zone de chargement des produits (ou après - si la valeur est négative).
  • Pagination - cette option s'affiche lorsque 'Chargement automatique' est désactivé. Il permet d'ajouter une pagination à la page des produits.
  • Display 'Show all' button - cette option s'affiche lorsque 'Chargement automatique' est désactivé. Après avoir appuyé sur ce bouton, tous les produits apparaissent.
  • Préchargeur - Dans ce champ, vous pouvez choisir une image de préchargeur qui sera affichée pendant le chargement des produits.

TM Look Book

Requirements:

This module allows to create lookbooks and combine them to collections. In their turn, lookbooks allow to view the products directly on the model. Also, if a product is marked in the lookbook, the module displays the lookbook link on the product page.

  • PHP 5.4+
  • PrestaShop 1.6
TM Look Book Main panel

On the main page of the module, you can delete and edit the module collections.

Adding and editing the collection

Collections allow to combine several lookbooks on one page. To add a collection, follow the next steps.

  • In the collections table (the main module panel) click on the plus (1).

  • You will see a form with the next fields:

    • Status - this option allows to disable or enable the collection display on the collections page.
    • Name - the name of the collection that will be displayed on the collections page.
    • Description - the collection description.
    • Image - the main collection image.
    • Template - the template for the lookbooks of this collection. When you select a template, you select the way the lookbooks of this collection will be displayed on the page.
  • After having filled all the fields, press the 'Save' (2) button.

  • The collection has been created. You can edit it by pressing the 'Edit' (3) button, or you can proceed to the next step and create lookbooks for the collection.

Creating and editing lookbooks
  • After creating a lookbook, press the 'View' (1) button next to the needed collection.

  • In the appeared block press the '+' button (2).

  • You'll see a form with the following options:

    • Status - the lookbook status, the option defines whether the lookbook will be displayed.
    • Name - the name of the look.
    • Description - the description of the look.
    • Image - the main image of the look, here you can mark the products and descriptions.
  • After filling in all the fields, press the 'Save & Stay' (3) button to continue creating hotspots.

Adding and Editing Hotspots

After having saved the lookbook, you can add the hotspots.

  • Press the image (in the needed point) (1) in the lookbook form.

  • You will see a form with the following settings:

    • Type - this is the point type, it has two values 'Product' and 'Content'. The product type allows to select a product that will be attached to the point, and content type allows to add content (name, description, html) to the point.
    • Product - selecting a product for the point. It appears, if the selected type is 'Product'.
    • Name - the name attached to the point. This field is available, only if the type 'Content' is selected.
    • Description - the point description or coding. Available only if the type 'Content' is selected.
  • After having selected the needed options, press the 'Save' (2) button, hotspot will be created and displayed on the page.

Deleting a hotspot
  • To delete a point, hover over it (1).

  • You'll see a button with a cross, press it (2).

  • The point is deleted.

Changing the hotspot position

To change the point position, drag and drop it to the needed position.

How to navigate to the collections page?

Navigate to the main module page and press the button (1), you'll see a page with all the collections. You can add the links to the lookbooks to any module that supports custom content.

LookBook Homepage TM

Pour utiliser le module, vous devez installer le module TM LookBook.

LookBook Homepage TM est utilisé pour afficher le bloc du module TM LookBook sur la page d'accueil. Ce module permet d'afficher à la fois les couvertures lookbook et les pages lookbook.

Exigences:
  • PHP 5.4+
  • PrestaShop 1.6
  • Module TM LookBook
Caractéristiques du module:
  • Le module peut être affiché en 2 positions: displayHome et displayTopColumn.
  • LookBook Homepage TM est un module enfant de TM LookBook, c'est pourquoi il ne peut être utilisé sans lui.
  • The module can display the lookbook cover or its pages.
Panneau Principal de LookBook Homepage TM

Au panneau principal du module, vous pouvez ajouter, supprimer et éditer des blocs, que le module affichera sur la page d'accueil.

Ajout d'un nouveau bloc
  • Pour ajouter un nouveau bloc, entrez le panneau principal du module et cliquez sur '+' (1) dans la table avec le crochet nécessaire.

  • Dans la forme apparue, configurez les options suivantes:

    • Etat - l'état du bloc. Ce paramètre permet d'activer ou de désactiver l'affichage du bloc.
    • Type - permet de sélectionner le type de bloc.
    • Lookbook - permet de sélectionner un look précédemment sélectionné.
  • Après avoir configuré toutes les options, appuyez sur le bouton 'Enregistrer' (2).

Une fois le nouveau bloc est créé, il sera affiché sur la page d'accueil.



Bloc des fabricants TM

Ce module montre les fabricants disponibles dans votre magasin. La liste des fabricants peut consister en image et titre. La liste peut aussi apparaître comme un carrousel.

Installation et suppression

Le module est installé et supprimé comme tout autre module Prestashope.

Configuration du module

Après l'installation, vous pouvez modifier ses paramètres sur la page de configuration du module.

  • Trier par
    le type de tri des éléments du bloc.
  • Afficher un nom
    afficher le nom du fabricant.
  • Afficher une image
    sfficher l'image du fabricant.
  • Nombre d'éléments à afficher
    entrez le nombre d'éléments affichés dans le module.
  • Type d'image
    sélectionnez le type d'image (vous pouvez sélectionner l'image à partir des images du fabricant).
  • Utiliser le carrousel
    afficher la liste comme un carrousel.
  • * Eléments visibles
    le nombre de fabricants visibles.
  • * Défilement des éléments
    le nombre de fabricants représentés lors de défilement du carrousel.
  • * Largeur de diapositive
    la largeur de l'élément dans le carrousel.
  • * Marge de diapositive
    la marge de l'élément dans le carrousel.
  • * Défilement automatique
    le défilement automatique.
  • * Vitesse du carrousel
    la vitesse du carrousel.
  • * Pause
    la pause entre les défilements (si 'Défilement automatique' est activé).
  • * Aléatoire
    le carrousel commence par l'élément aléatoire.
  • * Boucle de carrouse
    le carrousel revient au début lorsque tous les éléments ont été défilés.
  • * Masquer le contrôle à la fin
    masquer les boutons suivants/précédents.
  • * Pager
    afficher la pagination.
  • * Contrôle
    afficher les boutons suivant/précédent.
  • * Contrôle automatique
    afficher les boutons de lecture/pause.
  • * Hover automatique
    une pause lors du survol des éléments du carrousel.

* - les paramètres sont disponibles uniquement si le carrousel est activé.

Après avoir réglé toutes les options, appuyez sur le bouton 'Enregistrer' (1).

Le module supporte plusieurs magasins.



TM Media Parallax 2.0.0

Si vous avez la version 1.n de ce module installe dans votre Prestashop, il n'est pas recommandé de le mettre à jour. Vous devez d'abord supprimer l'ancienne version du module de fonctionner sans erreurs.

Ce module est conçu pour d'ajouter un effet de parallaxe aux éléments DOM de la page. Il vous permet de créer des parallaxes multicouches. Il offre également la possibilité d'ajouter une vidéo de fond (vous pouvez le télécharger de votre ordinateur vers le serveur) ou ajouter une vidéo YouTube.

Panneau principal de TM Media Parallax

Le panneau du module principal vous permet d'ajouter, modifier ou supprimer des éléments de parallaxe.

Création d'un nouvel élément de parallaxe

Pour créer un nouvel élément de parallaxe, appuyez sur l'icône 'plus' (1), dans le coin supérieur droit du panneau principal.

Ensuite, vous verrez le formulaire suivant.

Les options de formulaire pour ajouter des éléments de parallaxe

  • Sélecteur - le sélecteur CSS de l'élément avec effet de parallaxe appliqué. Par exemple, '#header .nav'
  • Etat d'élément - l'état de l'élément (parallaxe ne sera pas affichée si désactivée)
  • Vitesse - la valeur de chiffre de 0 à 2, qui définit la vitesse du bloc de parallaxe principale
  • Offset - le retrait de la couche principale sur l'axe des Y
  • Inverse - la direction de parallaxe
  • Fondu - cette option permet de configurer l'effet Fondu du bloc principal lors de défilement de la page
  • Pleine largeur forcée - la pleine largeur forcée du bloc de parallaxe

Appuyez sur 'Enregistrer' après avoir rempli tous les champs requis.

Liste des couches parallaxe

Pour voir la liste des couches de parallaxes, vous devez appuyer sur 'Voir' (1) près de l'élément principal de parallaxe.

Ensuite, vous verrez une table, dans laquelle les couches s'affichent après leur ajout.

Ajout d'une nouvelle couche

Afin de créer une nouvelle couche de parallaxe, appuyez sur l'icône 'plus' (1), dans le coin supérieur droit.

Ensuite, vous verrez le formulaire suivant.

Appuyez sur 'Enregistrer' après avoir rempli tous les champs requis.

PTypes de couches parallaxes et leurs champs

  • Image de fond - l'image utilisée comme fond de parallaxe

    • Etat d'élément - l'état de l'élément (parallaxe ne sera pas affichée si désactivée
    • Vitesse de disposition - la valeur de chiffre de 0 à 2, qui définit la vitesse du bloc de parallaxe principale
    • Offset - le retrait de la couche principale sur l'axe des Y
    • Inverse - la direction de parallaxe
    • Fondu - cette option permet de configurer l'effet Fondu du bloc principal lors de défilement de la page
    • Image - le lien vers une image, à laquelle l'effet de parallaxe sera appliqué
    • Ordre de tri - la position de mise en page, par rapport au reste des éléments
  • Vidéo de fond - la vidéo utilisée comme fond de parallaxe

    • Etat d'élément - l'état de l'élément (parallaxe ne sera pas affichée si désactivée
    • Vitesse de disposition - la valeur de chiffre de 0 à 2, qui définit la vitesse du bloc de parallaxe principale
    • Offset - le retrait de la couche principale sur l'axe des Y
    • Inverse - la direction de parallaxe
    • Fondu - cette option permet de configurer l'effet Fondu du bloc principal lors de défilement de la page
    • Image - le lien vers une image, à laquelle l'effet de parallaxe sera appliqué
    • Vidéo parallaxe mp4 - le format mp4 de vidéo parallaxe
    • Vidéo parallaxe webm - le format webm de vidéo parallaxe
    • Ordre de tri - la position de mise en page, par rapport au reste des éléments
  • Texte - une couche de texte dont la position peut être définie avec CSS

    • Etat d'élément - l'état de l'élément (parallaxe ne sera pas affichée si désactivée
    • Vitesse de disposition - la valeur de chiffre de 0 à 2, qui définit la vitesse du bloc de parallaxe principale
    • Offset - le retrait de la couche principale sur l'axe des Y
    • Inverse - la direction de parallaxe
    • Fondu - cette option permet de configurer l'effet Fondu du bloc principal lors de défilement de la page
    • Contenu - le contenu de la couche
    • Classe spécifique - la classe CSS personnalisée pour cette couche
    • Ordre de tri - la position de mise en page, par rapport au reste des éléments
  • Youtube-background - la vidéo YouTube utilisée comme fond de parallaxe

    • Etat d'élément - l'état de l'élément (parallaxe ne sera pas affichée si désactivée
    • Vitesse de disposition - la valeur de chiffre de 0 à 2, qui définit la vitesse du bloc de parallaxe principale
    • Offset - le retrait de la couche principale sur l'axe des Y
    • Inverse - la direction de parallaxe
    • Fondu - cette option permet de configurer l'effet Fondu du bloc principal lors de défilement de la page
    • ID de vidéo - ID de la vidéo YouTube
    • Ordre de tri - la position de mise en page, par rapport au reste des éléments
  • Image - une couche d'image, quelle position peut être définie avec CSS

    • Etat d'élément - l'état de l'élément (parallaxe ne sera pas affichée si désactivée
    • Vitesse de disposition - la valeur de chiffre de 0 à 2, qui définit la vitesse du bloc de parallaxe principale
    • Offset - le retrait de la couche principale sur l'axe des Y
    • Inverse - la direction de parallaxe
    • Fondu - cette option permet de configurer l'effet Fondu du bloc principal lors de défilement de la page
    • Image - le lien vers une image, à laquelle l'effet de parallaxe sera appliqué
    • Classe spécifique - la classe CSS personnalisée pour cette couche
    • Ordre de tri - la position de mise en page, par rapport au reste des éléments

Téléchargement de vidéos et d'images sur le serveur

Pour télécharger une vidéo ou une image sur le serveur via le Gestionnaire de fichiers, d'abord, vous devez appuyer sur l'icône 'fichier' (1) à côté du champ nécessaire.

Dans la fenêtre suivante, dans la ligne des 'actions', choisissez 'Télécharger' (2).

Ensuite, vous verrez une autre fenêtre pop-up, pour télécharger l'image ou le fichier vidéo ici.

Avertissements et recommandations

  • Les périphériques mobiles (smartphones, tablettes) ont un effet de parallaxe désactivé par défaut, la couche d'image de bloc supérieure est utilisée en tant que fond
  • La largeur totale forcée du bloc parallaxe affecte la vitesse de chargement de la page de manière plus critique qu'un chargement en bloc régulier.
  • Plus la taille de la vidéo téléchargée est petite, meilleure est la vitesse de chargement.

TM Mega Layout 1.0.0

Ce module est conçu pour vous permettre de créer des mises en page personnalisées (préréglages) pour les crochets et les afficher sur le site au lieu des positions par défaut. L'avantage de ce module est de vous permettre de créer différentes crochets et les modifier selon vos besoins.

Caractéristiques fonctionnelles du module

  • Exigences:

    • Prestashop 1.6+
    • PHP 5.4+
  • Caractéristiques:

    • Le module comprend 5 crochets: 'Header', 'Top Column', 'Home', 'Footer' et 'Product Footer'.

    • Dans le cas où le module n'est pas présent au crochet, il ne peut pas être ajouté au préréglage.
    • Le module peut être affiché dans le préréglage qu'une seule fois, comme dans un crochet.
    • La position du module dans la section 'Modules et Services -> Positions' n'affecte pas le préréglage.
    • Le module ne vous permet pas de configurer différents modules. Vous ne pouvez pas configurer les différents modules pour différents préréglages.
Le module fournit une option pour changer la position du module et configurer la grille pour 3 crochets: displayTopColumn, displayHome, displayFooter. La modification de la position des modules dans la section 'Modules et Services -> Positions' n'affecte pas le préréglage. Si le module n'a pas été ajouté au crochet, il ne peut pas être ajouté au préréglage.

ML'intégration du module au thème

Sans cette étape, vos presets ne seront pas affichés sur le frontend.

  • TopColumn. Pour ajouter un préréglage personnalisé au crochet topColumn, vous devez effectuer les opérations suivantes:

    • Ouvrez le fichier /themes/your_theme/header.tpl pour éditer.
    • Recherchez le code suivant
      {hook h="displayTopColumn"}
    • Et remplacez-le par:
      {assign var='displayMegaTopColumn' value={hook h='tmMegaLayoutTopColumn'}}
      {if $displayMegaTopColumn}
          {hook h='tmMegaLayoutTopColumn'}
      {else}
          {capture name='displayTopColumn'}{hook h='displayTopColumn'}{/capture}
          {if $smarty.capture.displayTopColumn}
              <div id="slider_row" class="row">
                  <div id="top_column" class="center_column col-xs-12 col-sm-12">{$smarty.capture.displayTopColumn}</div>
              </div>
          {/if}
      {/if}
  • Home. Pour ajouter un préréglage personnalisé au crochet Home, vous devez effectuer les opérations suivantes:

    • Ouvrez le fichier /themes/your_theme/footer.tpl pour éditer.
    • Recherchez le code suivant:
      {if isset($HOOK_HOME) && $HOOK_HOME|trim}
          <div class="home-column">
              <div class="container">
                  {$HOOK_HOME}
              </div>
          </div>
      {/if}
    • Et remplacez-le par:
      {assign var='displayMegaHome' value={hook h='tmMegaLayoutHome'}}
      {if $displayMegaHome}
          {hook h='tmMegaLayoutHome'}
      {else}
          {if isset($HOOK_HOME) && $HOOK_HOME|trim}
              {$HOOK_HOME}
          {/if}
      {/if}
  • Footer. Pour ajouter un préréglage personnalisé au crochet Home, vous devez effectuer les opérations suivantes:

    • Ouvrez le fichier /themes/your_theme/footer.tpl pour éditer.
    • Recherchez le code suivant
      {if isset($HOOK_FOOTER)}
          <div class="footer-container">
              <footer id="footer"  class="container">
                  <div class="row">
                      {$HOOK_FOOTER}
                  </div>
              </footer>
          </div>
      {/if}
    • Et remplacez-le par:
      {assign var='displayMegaFooter' value={hook h='tmMegaLayoutFooter'}}
      {if isset($HOOK_FOOTER) || $displayMegaFooter}
          <div class="footer-container">
          {if $displayMegaFooter}
               <div id="footer">
                    {$displayMegaFooter}
               </div>
          {else}
              <div id="footer" class="container">
                  <div class="row">{$HOOK_FOOTER}</div>
              </div>
          {/if}
          </div>
      {/if}
                      
  • Header. Pour ajouter un préréglage personnalisé au crochet Header, vous devez effectuer les étapes suivantes:

    • Ouvrez le fichier /themes/your_theme/header.tpl pour éditer.
    • Recherchez le code suivant
      {capture name='displayNav'}{hook h='displayNav'}{/capture}
      {if $smarty.capture.displayNav}
      <div class="nav">
        <div class="container">
          <div class="row">
            <nav>{$smarty.capture.displayNav}</nav>
          </div>
        </div>
      </div>
      {/if}
      <div>
        <div class="container">
         <div class="row">
          <div id="header_logo">
            <a href="{if isset($force_ssl) && $force_ssl}{$base_dir_ssl}{else}{$base_dir}{/if}" title="{$shop_name|escape:'html':'UTF-8'}">
              <img class="logo img-responsive" src="{$logo_url}" alt="{$shop_name|escape:'html':'UTF-8'}"{if isset($logo_image_width) && $logo_image_width} width="{$logo_image_width}"{/if}{if isset($logo_image_height) && $logo_image_height} height="{$logo_image_height}"{/if}/>
            </a>
          </div>
          {if isset($HOOK_TOP)}{$HOOK_TOP}{/if}
         </div>
       </div>
      </div>
    • Et remplacez-le par:
      {assign var='displayMegaHeader' value={hook h='tmMegaLayoutHeader'}}
      {if isset($HOOK_TOP) || $displayMegaHeader}
        {if $displayMegaHeader}
          {$displayMegaHeader}
        {else}
          {capture name='displayNav'}{hook h='displayNav'}{/capture}
          {if $smarty.capture.displayNav}
          <div class="nav">
            <div class="container">
              <div class="row">
                <nav>{$smarty.capture.displayNav}</nav>
              </div>
            </div>
          </div>
          {/if}
          <div>
            <div class="container">
             <div class="row">
              <div id="header_logo">
                <a href="{if isset($force_ssl) && $force_ssl}{$base_dir_ssl}{else}{$base_dir}{/if}" title="{$shop_name|escape:'html':'UTF-8'}">
                  <img class="logo img-responsive" src="{$logo_url}" alt="{$shop_name|escape:'html':'UTF-8'}"{if isset($logo_image_width) && $logo_image_width} width="{$logo_image_width}"{/if}{if isset($logo_image_height) && $logo_image_height} height="{$logo_image_height}"{/if}/>
                </a>
              </div>
              {$HOOK_TOP}
             </div>
           </div>
          </div>
        {/if}
      {/if}
  • Productfooter. Pour ajouter un préréglage personnalisé au crochet Productfooter, vous devez effectuer les étapes suivantes:

    • Ouvrez le fichier /themes/your_theme/product.tpl pour éditer.
    • Recherchez le code suivantde:
      {if isset($HOOK_PRODUCT_FOOTER) && $HOOK_PRODUCT_FOOTER}{$HOOK_PRODUCT_FOOTER}{/if}                                   
    • Et remplacez-le par:
      {assign var='displayMegaProductFooter' value={hook h='tmMegaLayoutProductFooter'}}
        {if isset($HOOK_PRODUCT_FOOTER) || $displayMegaFooter}
          {if $displayMegaProductFooter}
            {$displayMegaProductFooter product=$product category=$category}
          {else}
            {$HOOK_PRODUCT_FOOTER}
          {/if}
        {/if}

Crochets

Le module dispose de 5 crochets disponibles par défaut:

  • 'Header' est un crochet qui combine 2 crochets standards: displayNav et displayTop. Ce crochet correspond à l'en-tête du site
  • 'Top Column' correspond au crochet original displayTopColumn. Ce crochet vient juste après le crochet Header.
  • 'Home' correspond au crochet original displayHome. Ce crochet n'est présent que sur la page principale.
  • 'Footer' correspond au crochet original displayFooter.
  • 'Product Footer' correspond au crochet original displayFooterProduct, qui s'affiche dans pied de page de produit.

Panneau principal de TM Mega Layout

Le panneau de configuration du module TM Mega Layout vous permet d'ajouter un préréglage au crochet requis et de configurer le préréglage.

Ajout du préréglage

  • Appuyez sur '+ Ajouter un préréglage' (1) dans l'onglet nécessaire.

  • Ensuite, remplissez le champ "Entrez le nom de préréglage" dans la fenêtre contextuelle (2) et appuyez sur 'Enregistrer' (3).

  • Le préréglage a été créé avec succès, il est listé parmi les presets disponibles (4) maintenant. Le préréglage créé récemment est sélectionné pour l'édition (5).

Activation du préréglage
  • Tout d'abord, choisissez le preset requis parmi la liste (1).

  • Appuyez sur 'Utiliser comme défaut' (2).

  • Le préréglage a été activé. Si vous devez afficher ce préréglage uniquement sur certaines pages, ouvrez le menu déroulant (3) et sélectionnez les pages dont vous avez besoin. Pour appliquer les modifications, cliquez en dehors de la zone de liste. Un préréglage affiché sur toutes les pages sera marqué avec une étoile remplie dans la liste des préréglages, et le préréglage, qui s'affiche uniquement sur certaines pages, sera marqué avec une étoile partiellement remplie.

Suppression du préréglage

Il n'y a aucune option pour restaurer le préréglage après la suppression.

  • Pour supprimer le préréglage, choisissez le preset requis dans la liste (1).

  • Appuyez ensuite sur une icône de 'panier' (2) près du titre prédéfini.

  • Le préréglage a été supprimé avec succès.

Renommer le préréglage
  • Pour renommer le préréglage, choisissez le preset requis dans la liste (1).

  • Appuyez ensuite sur une icône de 'crayon' (2) à côté du titre prédéfini.

  • Spécifiez le nouveau titre (3) dans une fenêtre contextuelle et appuyez sur 'Renommer le préréglage' (4).

  • Le préréglage a été renommé avec succès.

Wrapper

Wrapper n'a pas de classe par défaut, ce n'est pas obligatoire.

Ajout de wrapper
  • Pour créer un wrapper, appuyez sur '+ Ajouter un wrapper' (1).

  • Wrapper a été ajouté (2).

Ajout de la classe css personnalisée au wrapper

L'ajout de la classe personnalisée vous permettra de créer un style spécifique pour votre wrapper en utilisant les règles css.

  • Pour ajouter une classe de wrapper, appuyez sur le bouton (1).

  • Vous verrez une fenêtre contextuelle, remplissez le champ 'Entrer le classe de wrapper' (2) et appuyez sur le bouton 'Confirmer' (3).

  • La classe personnalisée a été ajoutée avec succès.

Suppression de wrapper

La suppression de l'élément préréglé entraînera aussi l'élimination de tous ses éléments enfants et leurs styles.

  • Pour supprimer l'emballage, appuyez sur le bouton de 'panier' (1).

  • Wrapper a été retiré avec succès.

Styliser le wrapper

  • Pour ajouter des styles personnalisés au wrapper, appuyez sur l'icône 'crayon' (1) dans le bloc.

  • Dans la fenêtre contextuelle, remplissez tous les champs requis (vous pouvez vous référer à la section "'tyling' de la documentation), et appuyez sur le bouton 'Enregistrer' (2).

  • Si tous les champs sont remplis correctement, les styles seront enregistrés.

Rangée

C'est un élément de la grille Bootstrap. C'est un élément requis.

Ajout de rangée
  • Pour insérer une nouvelle rangée, appuyez sur '+ Ajouter une rangée' (1) dans le bloc du wrapper, ou '+ Ajouter une rangée' (2) dans le bloc du préréglage principal, ou '+ Ajouter une rangée' (3) dans la liste déroulante de colonne.

  • La rangée a été ajoutée avec succès.

Ajout d'une classe css personnalisée pour une rangée

L'ajout de la classe personnalisée vous permettra de créer un style spécifique pour rangée en utilisant les règles css.

  • Pour ajouter la classe à la rangée, appuyez sur le bouton (1).

  • Choisissez la 'Modifier la rangée' (2) dans une liste déroulante.

  • Vous verrez une fenêtre contextuelle, remplissez le champ 'Entrer le classe de rangée' (2) et appuyez sur le bouton 'Confirmer' (3).

  • La classe personnalisée a été ajoutée avec succès.

Suppression de rangée

La suppression de l'élément préréglé entraînera aussi l'élimination de tous ses éléments enfants et leurs styles.

  • Pour supprimer la ligne, ouvrez le menu (l'icône 'ellipsis') (1) dans le bloc de rangée.

  • Choisissez l'option 'Supprimer' (2) dans la liste déroulante.

  • La rangée a été supprimée avec succès.

Styliser la rangée
  • Pour ajouter des styles de rangée, ouvrez le menu (l'icône 'ellipsis') (1) dans un bloc de rangée.

  • Appuyez sur 'Styliser' (2) dans la liste déroulante.

  • Dans la fenêtre contextuelle, remplissez tous les champs requis (vous pouvez vous référer à la section 'Styling' de la documentation), et appuyez sur le bouton 'Enregistrer' (2).

  • Si tous les champs sont remplis correctement, les styles seront enregistrés.

Colonne

C'est un élément avec une largeur de bloc configurable pour différentes dimensions, basé sur la grille Bootstrap.

Ajout de colonne
  • Pour insérer une colonne dans une 'rangée' nécessaire, ouvrez le menu (icône 'ellipsis') (1)

  • Choisissez '+ Ajouter col' (2) dans la liste.

  • Remplissez les champs (col-xs*, col-sm*, col-md*, col-lg - bootstrap classes) dans la fenêtre contextuelle et appuyez sur le bouton 'Confirmer' (3).

  • La colonne a été ajoutée avec succès.

Suppression de colonne

La suppression de l'élément préréglé entraînera aussi l'élimination de tous ses éléments enfants et leurs styles.

  • Pour supprimer la colonne, ouvrez le menu (l'icône 'ellipsis') (1) dans un bloc de colonnes.

  • Appuyez sur 'Supprimer' (2) dans la liste.

  • La colonne et tous ses éléments enfants ont été supprimés.

Modification de colonne
  • Pour éditer la colonne, ouvrez le menu (l'icône 'ellipsis') (1) dans un bloc de colonnes.

  • Appuyez sur 'Editer colonne' (2) dans la liste.

  • Remplissez les champs (col-xs*, col-sm*, col-md*, col-lg - bootstrap classes) dans la fenêtre contextuelle et appuyez sur 'Confirmer' (3).

  • La colonne a été éditée avec succès.

Styliser la colonne
  • Pour ajouter des styles de colonne, ouvrez le menu (l'icône 'ellipsis') (1) dans un bloc de colonnes.

  • Appuyez sur 'Styliser' (2) dans la liste des options.

  • Dans la fenêtre contextuelle, remplissez tous les champs requis (vous pouvez vous référer à la section 'Styling' de la documentation), et appuyez sur le bouton 'Enregistrer' (2).

  • Si tous les champs sont remplis correctement, les styles seront enregistrés.

Module

Module, affecté à ce crochet.

Ajout du module

Faites attention lors de l'ajout de modules au préréglage, Il est souhaitable que certains modules de ne pas changer leur disposition visible, par exemple, le module statistique 'Data mining for statistics' ('Exploration de données pour statistiques').

  • Pour ajouter le module au préréglage dans un bloc de colonne, ouvrez le menu (l'icône 'ellipsis')(1).

  • Appuyez sur '+ Add Module' (2) dans la liste des options disponibles.

  • Si nécessaire, vous pouvez entrer la classe personnalisée (3) dans la fenêtre contextuelle et sélectionner le module (4), appuyez ensuite sur 'Confirmer' (5).

  • Le module a été ajouté avec succès.

Suppression du module

La suppression de l'élément préréglé entraînera aussi l'élimination de tous ses éléments enfants et leurs styles.

  • Pour supprimer le module, ouvrez le menu (l'icône 'ellipsis') (1) dans le bloc de module.

  • Appuyez sur 'Supprimer' (2) dans la liste des options disponibles.

  • Le module est supprimé.

Ajout de classe personnalisée au module

L'ajout de classe personnalisé permet de créer un style de module à l'aide de règles cs.

  • Pour spécifier une classe personnalisée pour le module, ouvrez le menu dans le bloc de module (l'icône 'ellipsis')(1).

  • Appuyez sur 'Modifier les paramètres' (2).

  • Spécifiez la classe personnalisée (3) dans la fenêtre contextuelle et appuyez sur le bouton 'Confirmer' (4).

  • La classe personnalisée a été ajoutée.

Logo, Droits d'auteur

Les blocs de Logo et de Droits d'auteur sont modifiés de la même manière que les modules, Sauf que Logo ne peut être placé que dans la position de Header ou Footer, et le bloc Copyright peut être placé uniquement en position de Footer.

Exportation de préréglages

L'outil Exporter vous permet d'exporter des presets pour les importer dans différents magasins plus tard.

  • Accédez à l'onglet 'Outils' (1) dans le panneau des configurations principales.

  • Choisissez 'Exporter' (2) dans la liste.

  • Vous verrez la liste des préréglages existants dans les crochets du site.

  • Afin de prévisualiser le préréglage, appuyez sur le bouton 'Aperçu' (3) près du préréglage dont vous avez besoin. Pour exporter, appuyez sur le bouton 'Exporter le préréglage' (4).

  • Ensuite, vous pourrez télécharger ce préréglage sous forme d'archive zip.

Importation de préréglages

L'outil Importer n'accepte que les fichiers * .zip prédéfinis, qui ont été générés précédemment avec le même module (l'outil Exporter).

  • Pour importer votre préréglage, vous devez ouvrir l'onglet Outils (1) et choisissez 'Importer' (2).

  • Appuyez ensuite sur le bouton Ajouter un fichier (3) et sélectionnez le fichier zip de votre exportation.

  • Si ce préréglage répond à vos besoins, appuyez sur 'Importer' (4). Ce préréglage sera importé et ajouté à la liste des préréglages disponibles.

Réinitialiser

Réinitialiser - réinitialise tous les préréglages à leur état initial (car ils ont été fournis avec le thème), tous les préréglages personnalisés, créés par l'utilisateur seront supprimés.

Attention! After restoring the default presets, all of the custom presets will be removed!

  • Pour réinitialiser les préréglages, accédez à l'onglet 'Outils' (1).

  • Ouvrez l'onglet 'Réinitialiser' (2) dans le bloc.

  • Et appuyez sur 'Réinitialiser par défaut'.

  • C'est tout! Tous les préréglages sont réinitialisés à l'état initial.

Optimisation des styles et des scripts

L'optimisation des styles et des scripts ajoute des exclusions pour les modules dans la section Header, en fonction de leur utilisation dans les préréglages. Cela permet d'accélérer la vitesse de chargement de la page. L'optimisation fonctionne en mode test.

Activation de l'optimisation:

  • Pour activer l'optimisation, ouvrez l'onglet 'Outils' (1) et sélectionnez l'onglet 'Options' (2).

  • Dans la fenêtre apparue, vous pouvez activer l'optimisation (3).

Si l'optimisation est activée lors de l'édition et de l'activation des préréglages, l'optimisation est rejetée, mais vous verrez une fenêtre, offrant d'exécuter l'optimisation. Il n'est pas nécessaire d'optimiser les scripts et les styles chaque fois que vous modifiez les préréglages. Il est préférable de les optimiser quand vous avez terminé l'édition.

Stylisation
  • Styles de fond. Description des champs:

    • background-image (image de fond) - l'argument est un lien vers l'image. L'image est choisie dans le dossier ~/images/cms/.
    • background-color (couleur de fond) - le valeur peut être définie en tout format de couleur (rgb, hex, etc.). Vous pouvez choisir la couleur à l'aide de l'outil 'Sélecteur de couleurs'.
    • background-repeat (répétition du fond) - toutes les options disponibles sont listées dans la liste déroulante.
    • background-position (position de fond) - toutes les options disponibles sont listées dans la liste déroulante.
    • background-size (taille de fond) - toutes les options disponibles sont listées dans la liste déroulante.
    • background-origin (région de positionnement d'image de fond) - toutes les options disponibles sont listées dans la liste déroulante.
  • Styles de bordure.

    • TYPE: border-top-style, border-right-style, border-left-style, border-bottom-style - toutes les options disponibles sont listées dans la liste déroulante.
    • LARGEUR: border-top-width, border-right-width, border-left-width, border-bottom-width - devrait être configuré en pixels.
    • RADIUS: border-top-right-radius, border-top-left-radius, border-bottom-right-radius, border-bottom-left-radius - should be set in pixels.
    • COULEUR: border-top-сolor, border-right-color, border-left-color, border-bottom-color - le valeur peut être définie en tout format de couleur (rgb, hex, etc.). Vous pouvez choisir la couleur à l'aide de l'outil 'Sélecteur de couleurs'.
  • Autres styles.

    • box-shadow - exemple: 0px 0px 0px 0px rgba(0,0,0,0.75).
Suppression des styles d'élément
  • Pour supprimer les styles d'élément, ouvrez la section de style et appuyez sur le bouton 'Effacer les styles' (1).

Avertissements

Si le message suivant apparaît dans le bloc du module, vous devez activer le module mentionné.

Si le message suivant apparaît dans le bloc du module, vous devez installer le module mentionné.

Dans le cas où vous supprimez ou désactivez le module 'TM Mega Layout', tous les préréglages actifs seront désactivés et vous verrez les positions (crochets) dans leur apparence originale.



TM Mega Layout 1.1.0

Ce module est conçu pour vous permettre de créer des mises en page personnalisées (préréglages) pour les crochets et les afficher sur le site au lieu des positions par défaut. L'avantage de ce module est de vous permettre de créer différentes crochets et les modifier selon vos besoins.

Caractéristiques fonctionnelles du module

  • Exigences:

    • Prestashop 1.6+
    • PHP 5.4+
  • Caractéristiques:

    • Le module comprend 5 crochets: 'Header', 'Top Column', 'Home', 'Footer' et 'Product Footer'.

    • Dans le cas où le module n'est pas présent au crochet, il ne peut pas être ajouté au préréglage.
    • Le module peut être affiché dans le préréglage qu'une seule fois, comme dans un crochet.
    • La position du module dans la section 'Modules et Services -> Positions' n'affecte pas le préréglage.
    • Le module ne vous permet pas de configurer différents modules. Vous ne pouvez pas configurer les différents modules pour différents préréglages.
Le module fournit une option pour changer la position du module et configurer la grille pour 3 crochets: displayTopColumn, displayHome, displayFooter. La modification de la position des modules dans la section 'Modules et Services -> Positions' n'affecte pas le préréglage. Si le module n'a pas été ajouté au crochet, il ne peut pas être ajouté au préréglage.

ML'intégration du module au thème

Sans cette étape, vos presets ne seront pas affichés sur le frontend.

  • TopColumn. Pour ajouter un préréglage personnalisé au crochet topColumn, vous devez effectuer les opérations suivantes:

    • Ouvrez le fichier /themes/your_theme/header.tpl pour éditer.
    • Recherchez le code suivant
      {hook h="displayTopColumn"}
    • Et remplacez-le par:
      {assign var='displayMegaTopColumn' value={hook h='tmMegaLayoutTopColumn'}}
      {if $displayMegaTopColumn}
          {hook h='tmMegaLayoutTopColumn'}
      {else}
          {capture name='displayTopColumn'}{hook h='displayTopColumn'}{/capture}
          {if $smarty.capture.displayTopColumn}
              <div id="slider_row" class="row">
                  <div id="top_column" class="center_column col-xs-12 col-sm-12">{$smarty.capture.displayTopColumn}</div>
              </div>
          {/if}
      {/if}
  • Home. Pour ajouter un préréglage personnalisé au crochet Home, vous devez effectuer les opérations suivantes:

    • Ouvrez le fichier /themes/your_theme/footer.tpl pour éditer.
    • Recherchez le code suivant:
      {if isset($HOOK_HOME) && $HOOK_HOME|trim}
          <div class="home-column">
              <div class="container">
                  {$HOOK_HOME}
              </div>
          </div>
      {/if}
    • Et remplacez-le par:
      {assign var='displayMegaHome' value={hook h='tmMegaLayoutHome'}}
      {if $displayMegaHome}
          {hook h='tmMegaLayoutHome'}
      {else}
          {if isset($HOOK_HOME) && $HOOK_HOME|trim}
              {$HOOK_HOME}
          {/if}
      {/if}
  • Footer. Pour ajouter un préréglage personnalisé au crochet Home, vous devez effectuer les opérations suivantes:

    • Ouvrez le fichier /themes/your_theme/footer.tpl pour éditer.
    • Recherchez le code suivant
      {if isset($HOOK_FOOTER)}
          <div class="footer-container">
              <footer id="footer"  class="container">
                  <div class="row">
                      {$HOOK_FOOTER}
                  </div>
              </footer>
          </div>
      {/if}
    • Et remplacez-le par:
      {assign var='displayMegaFooter' value={hook h='tmMegaLayoutFooter'}}
      {if isset($HOOK_FOOTER) || $displayMegaFooter}
          <div class="footer-container">
          {if $displayMegaFooter}
               <div id="footer">
                    {$displayMegaFooter}
               </div>
          {else}
              <div id="footer" class="container">
                  <div class="row">{$HOOK_FOOTER}</div>
              </div>
          {/if}
          </div>
      {/if}
                      
  • Header. Pour ajouter un préréglage personnalisé au crochet Header, vous devez effectuer les étapes suivantes:

    • Ouvrez le fichier /themes/your_theme/header.tpl pour éditer.
    • Recherchez le code suivant
      {capture name='displayNav'}{hook h='displayNav'}{/capture}
      {if $smarty.capture.displayNav}
      <div class="nav">
        <div class="container">
          <div class="row">
            <nav>{$smarty.capture.displayNav}</nav>
          </div>
        </div>
      </div>
      {/if}
      <div>
        <div class="container">
         <div class="row">
          <div id="header_logo">
            <a href="{if isset($force_ssl) && $force_ssl}{$base_dir_ssl}{else}{$base_dir}{/if}" title="{$shop_name|escape:'html':'UTF-8'}">
              <img class="logo img-responsive" src="{$logo_url}" alt="{$shop_name|escape:'html':'UTF-8'}"{if isset($logo_image_width) && $logo_image_width} width="{$logo_image_width}"{/if}{if isset($logo_image_height) && $logo_image_height} height="{$logo_image_height}"{/if}/>
            </a>
          </div>
          {if isset($HOOK_TOP)}{$HOOK_TOP}{/if}
         </div>
       </div>
      </div>
    • Et remplacez-le par:
      {assign var='displayMegaHeader' value={hook h='tmMegaLayoutHeader'}}
      {if isset($HOOK_TOP) || $displayMegaHeader}
        {if $displayMegaHeader}
          {$displayMegaHeader}
        {else}
          {capture name='displayNav'}{hook h='displayNav'}{/capture}
          {if $smarty.capture.displayNav}
          <div class="nav">
            <div class="container">
              <div class="row">
                <nav>{$smarty.capture.displayNav}</nav>
              </div>
            </div>
          </div>
          {/if}
          <div>
            <div class="container">
             <div class="row">
              <div id="header_logo">
                <a href="{if isset($force_ssl) && $force_ssl}{$base_dir_ssl}{else}{$base_dir}{/if}" title="{$shop_name|escape:'html':'UTF-8'}">
                  <img class="logo img-responsive" src="{$logo_url}" alt="{$shop_name|escape:'html':'UTF-8'}"{if isset($logo_image_width) && $logo_image_width} width="{$logo_image_width}"{/if}{if isset($logo_image_height) && $logo_image_height} height="{$logo_image_height}"{/if}/>
                </a>
              </div>
              {$HOOK_TOP}
             </div>
           </div>
          </div>
        {/if}
      {/if}
  • Productfooter. Pour ajouter un préréglage personnalisé au crochet Productfooter, vous devez effectuer les étapes suivantes:

    • Ouvrez le fichier /themes/your_theme/product.tpl pour éditer.
    • Recherchez le code suivantde:
      {if isset($HOOK_PRODUCT_FOOTER) && $HOOK_PRODUCT_FOOTER}{$HOOK_PRODUCT_FOOTER}{/if}                                   
    • Et remplacez-le par:
      {assign var='displayMegaProductFooter' value={hook h='tmMegaLayoutProductFooter'}}
        {if isset($HOOK_PRODUCT_FOOTER) || $displayMegaFooter}
          {if $displayMegaProductFooter}
            {$displayMegaProductFooter product=$product category=$category}
          {else}
            {$HOOK_PRODUCT_FOOTER}
          {/if}
        {/if}

Crochets

Le module dispose de 5 crochets disponibles par défaut:

  • 'Header' est un crochet qui combine 2 crochets standards: displayNav et displayTop. Ce crochet correspond à l'en-tête du site
  • 'Top Column' correspond au crochet original displayTopColumn. Ce crochet vient juste après le crochet Header.
  • 'Home' correspond au crochet original displayHome. Ce crochet n'est présent que sur la page principale.
  • 'Footer' correspond au crochet original displayFooter.
  • 'Product Footer' correspond au crochet original displayFooterProduct, qui s'affiche dans pied de page de produit.

Panneau principal de TM Mega Layout

Préréglages principaux

Le panneau de configuration du module TM Mega Layout vous permet d'ajouter un préréglage au crochet requis et de configurer le préréglage.

Ajout du préréglage

  • Appuyez sur '+ Ajouter un préréglage' (1) dans l'onglet nécessaire.

  • Ensuite, remplissez le champ "Entrez le nom de préréglage" dans la fenêtre contextuelle (2) et appuyez sur 'Enregistrer' (3).

  • Le préréglage a été créé avec succès, il est listé parmi les presets disponibles (4) maintenant. Le préréglage créé récemment est sélectionné pour l'édition (5).

Activation du préréglage
  • Tout d'abord, choisissez le preset requis parmi la liste (1).

  • Appuyez sur 'Utiliser comme défaut' (2).

  • Le préréglage a été activé. Si vous devez afficher ce préréglage uniquement sur certaines pages, ouvrez le menu déroulant (3) et sélectionnez les pages dont vous avez besoin. Pour appliquer les modifications, cliquez en dehors de la zone de liste. Un préréglage affiché sur toutes les pages sera marqué avec une étoile remplie dans la liste des préréglages, et le préréglage, qui s'affiche uniquement sur certaines pages, sera marqué avec une étoile partiellement remplie.

Suppression du préréglage

Il n'y a aucune option pour restaurer le préréglage après la suppression.

  • Pour supprimer le préréglage, choisissez le preset requis dans la liste (1).

  • Appuyez ensuite sur une icône de 'panier' (2) près du titre prédéfini.

  • Le préréglage a été supprimé avec succès.

Renommer le préréglage
  • Pour renommer le préréglage, choisissez le preset requis dans la liste (1).

  • Appuyez ensuite sur une icône de 'crayon' (2) à côté du titre prédéfini.

  • Spécifiez le nouveau titre (3) dans une fenêtre contextuelle et appuyez sur 'Renommer le préréglage' (4).

  • Le préréglage a été renommé avec succès.

Wrapper

Wrapper n'a pas de classe par défaut, ce n'est pas obligatoire.

Ajout de wrapper
  • Pour créer un wrapper, appuyez sur '+ Ajouter un wrapper' (1).

  • Wrapper a été ajouté (2).

Ajout de la classe css personnalisée au wrapper

L'ajout de la classe personnalisée vous permettra de créer un style spécifique pour votre wrapper en utilisant les règles css.

  • Pour ajouter une classe de wrapper, appuyez sur le bouton (1).

  • Vous verrez une fenêtre contextuelle, remplissez le champ 'Entrer le classe de wrapper' (2) et appuyez sur le bouton 'Confirmer' (3).

  • La classe personnalisée a été ajoutée avec succès.

Suppression de wrapper

La suppression de l'élément préréglé entraînera aussi l'élimination de tous ses éléments enfants et leurs styles.

  • Pour supprimer l'emballage, appuyez sur le bouton de 'panier' (1).

  • Wrapper a été retiré avec succès.

Styliser le wrapper

  • Pour ajouter des styles personnalisés au wrapper, appuyez sur l'icône 'crayon' (1) dans le bloc.

  • Dans la fenêtre contextuelle, remplissez tous les champs requis (vous pouvez vous référer à la section "'tyling' de la documentation), et appuyez sur le bouton 'Enregistrer' (2).

  • Si tous les champs sont remplis correctement, les styles seront enregistrés.

Rangée

C'est un élément de la grille Bootstrap. C'est un élément requis.

Ajout de rangée
  • Pour insérer une nouvelle rangée, appuyez sur '+ Ajouter une rangée' (1) dans le bloc du wrapper, ou '+ Ajouter une rangée' (2) dans le bloc du préréglage principal, ou '+ Ajouter une rangée' (3) dans la liste déroulante de colonne.

  • La rangée a été ajoutée avec succès.

Ajout d'une classe css personnalisée pour une rangée

L'ajout de la classe personnalisée vous permettra de créer un style spécifique pour rangée en utilisant les règles css.

  • Pour ajouter la classe à la rangée, appuyez sur le bouton (1).

  • Choisissez la 'Modifier la rangée' (2) dans une liste déroulante.

  • Vous verrez une fenêtre contextuelle, remplissez le champ 'Entrer le classe de rangée' (2) et appuyez sur le bouton 'Confirmer' (3).

  • La classe personnalisée a été ajoutée avec succès.

Suppression de rangée

La suppression de l'élément préréglé entraînera aussi l'élimination de tous ses éléments enfants et leurs styles.

  • Pour supprimer la ligne, ouvrez le menu (l'icône 'ellipsis') (1) dans le bloc de rangée.

  • Choisissez l'option 'Supprimer' (2) dans la liste déroulante.

  • La rangée a été supprimée avec succès.

Styliser la rangée
  • Pour ajouter des styles de rangée, ouvrez le menu (l'icône 'ellipsis') (1) dans un bloc de rangée.

  • Appuyez sur 'Styliser' (2) dans la liste déroulante.

  • Dans la fenêtre contextuelle, remplissez tous les champs requis (vous pouvez vous référer à la section 'Styling' de la documentation), et appuyez sur le bouton 'Enregistrer' (2).

  • Si tous les champs sont remplis correctement, les styles seront enregistrés.

Colonne

C'est un élément avec une largeur de bloc configurable pour différentes dimensions, basé sur la grille Bootstrap.

Ajout de colonne
  • Pour insérer une colonne dans une 'rangée' nécessaire, ouvrez le menu (icône 'ellipsis') (1)

  • Choisissez '+ Ajouter col' (2) dans la liste.

  • Remplissez les champs (col-xs*, col-sm*, col-md*, col-lg - bootstrap classes) dans la fenêtre contextuelle et appuyez sur le bouton 'Confirmer' (3).

  • La colonne a été ajoutée avec succès.

Suppression de colonne

La suppression de l'élément préréglé entraînera aussi l'élimination de tous ses éléments enfants et leurs styles.

  • Pour supprimer la colonne, ouvrez le menu (l'icône 'ellipsis') (1) dans un bloc de colonnes.

  • Appuyez sur 'Supprimer' (2) dans la liste.

  • La colonne et tous ses éléments enfants ont été supprimés.

Modification de colonne
  • Pour éditer la colonne, ouvrez le menu (l'icône 'ellipsis') (1) dans un bloc de colonnes.

  • Appuyez sur 'Editer colonne' (2) dans la liste.

  • Remplissez les champs (col-xs*, col-sm*, col-md*, col-lg - bootstrap classes) dans la fenêtre contextuelle et appuyez sur 'Confirmer' (3).

  • La colonne a été éditée avec succès.

Styliser la colonne
  • Pour ajouter des styles de colonne, ouvrez le menu (l'icône 'ellipsis') (1) dans un bloc de colonnes.

  • Appuyez sur 'Styliser' (2) dans la liste des options.

  • Dans la fenêtre contextuelle, remplissez tous les champs requis (vous pouvez vous référer à la section 'Styling' de la documentation), et appuyez sur le bouton 'Enregistrer' (2).

  • Si tous les champs sont remplis correctement, les styles seront enregistrés.

Module

Module, affecté à ce crochet.

Ajout du module

Faites attention lors de l'ajout de modules au préréglage, Il est souhaitable que certains modules de ne pas changer leur disposition visible, par exemple, le module statistique 'Data mining for statistics' ('Exploration de données pour statistiques').

  • Pour ajouter le module au préréglage dans un bloc de colonne, ouvrez le menu (l'icône 'ellipsis')(1).

  • Appuyez sur '+ Add Module' (2) dans la liste des options disponibles.

  • Si nécessaire, vous pouvez entrer la classe personnalisée (3) dans la fenêtre contextuelle et sélectionner le module (4), appuyez ensuite sur 'Confirmer' (5).

  • Le module a été ajouté avec succès.

Suppression du module

La suppression de l'élément préréglé entraînera aussi l'élimination de tous ses éléments enfants et leurs styles.

  • Pour supprimer le module, ouvrez le menu (l'icône 'ellipsis') (1) dans le bloc de module.

  • Appuyez sur 'Supprimer' (2) dans la liste des options disponibles.

  • Le module est supprimé.

Ajout de classe personnalisée au module

L'ajout de classe personnalisé permet de créer un style de module à l'aide de règles cs.

  • Pour spécifier une classe personnalisée pour le module, ouvrez le menu dans le bloc de module (l'icône 'ellipsis')(1).

  • Appuyez sur 'Modifier les paramètres' (2).

  • Spécifiez la classe personnalisée (3) dans la fenêtre contextuelle et appuyez sur le bouton 'Confirmer' (4).

  • La classe personnalisée a été ajoutée.

Logo, Droits d'auteur

Les blocs de Logo et de Droits d'auteur sont modifiés de la même manière que les modules, Sauf que Logo ne peut être placé que dans la position de Header ou Footer, et le bloc Copyright peut être placé uniquement en position de Footer.

Page de produit

Onglet Info de produit
Grâce à cet onglet, vous pouvez changer la mise en page de la page produit. Il apparaîtra dans le panneau d'administration après avoir effectué quelques actions simples décrites ci-dessous.
Création de la mise en page
Les dispositions sont créées et modifiées manuellement.
  • Créez le dossier 'product_pages' dans votre répertoire de thème.

  • Dans le dossier de thème, retrouvez le fichier 'product.tpl', copiez-le dans le dossier récemment créé 'product_pages' et renommez-le 'default.tpl'. Pour créer plusieurs mises en page - dupliquer ce fichier, renommez-le (par ex. 'layout_1.tpl', 'layout_2.tpl') et modifiez la structure selon vos besoins.
  • Créez un fichier 'config.json' dans ce dossier. Copiez le code suivant:
    {
      "default": {
        "name": "Default",
        "preview": "default.jpg",
        "default": 1
      }
    }
    • "default" - le nom du fichier .tpl contenant la structure de la page du produit.
    • "name": "Default" - le titre de la mise en page de produit dans les paramètres du module.
    • "preview": "default.jpg" - aperçu de la disposition de la page du produit dans les paramètres du module; l'image doit être placée dans le dossier 'product_pages'.
    • "default": 1 - définissez '1' si la mise en page doit être définie par défaut


      Une des mises en page devrait contenir une valeur '1' à définir comme défaut.

    Ce code devrait être dupliqué pour chaque disposition créée, et contenir des valeurs correspondantes. Par exemple:

    {
      "default": {
        "name": "Default",
        "preview": "default.jpg",
        "default": 0
      },
      "layout_1": {
        "name": "Layout 1",
        "preview": "layout_1.jpg",
        "default": 0
      },
      "layout_2": {
        "name": "Layout 2",
        "preview": "layout_2.jpg",
        "default": 1
      }
    }
  • Ouvrez le fichier 'product.tpl' dans le dossier de la thème. Supprimez tout et collez le code suivant:
    {include file="$tpl_dir./errors.tpl"}
    {if $errors|@count == 0}
      {if isset($megalayoutProductInfoPage) && $megalayoutProductInfoPage}
        {assign var='path' value="./product_pages/`$megalayoutProductInfoPage`"}
        {include file=$path}
      {else}
        {include file='./product_pages/default.tpl'}
      {/if}
    {/if}
  • Pour ajouter/modifier les styles de la disposition d'une page de produit, accédez à your_theme_folder/css/ et ajoutez un nouveau dossier 'product_pages'. Dans ce dossier, créez un fichier avec le nom de disposition et l'extension .css (par ex. 'default.css', 'layout_1.css', 'layout_2.css'). Ces fichiers doivent contenir des styles de la disposition de la page de produit correspondante.
  • Pour ajouter des scripts à la disposition d'une page de produit, allez à your_theme_folder/js/ et ajoutez un nouveau dossier 'product_pages'. Dans ce dossier, créez un fichier avec le nom de disposition et l'extension .js (par ex. 'default.js', 'layout_1.js', 'layout_2.js'). Ces fichiers doivent contenir des scripts de la disposition de la page de produit correspondante.
Bascule entre différentes présentations.

Sélectionnez 'Page de produit' dans la liste déroulante (1) et cliquez sur l'onglet 'Info de produit' (2).

Dans cet onglet, vous pouvez changer les présentations de la page produit. L'image de mise en page avec la bordure grise est définie par défaut.

Exportation de préréglages

L'outil Exporter vous permet d'exporter des presets pour les importer dans différents magasins plus tard.

  • Accédez à l'onglet 'Outils' (1) dans le panneau des configurations principales.

  • Choisissez 'Exporter' (2) dans la liste.

  • Vous verrez la liste des préréglages existants dans les crochets du site.

  • Afin de prévisualiser le préréglage, appuyez sur le bouton 'Aperçu' (3) près du préréglage dont vous avez besoin. Pour exporter, appuyez sur le bouton 'Exporter le préréglage' (4).

  • Ensuite, vous pourrez télécharger ce préréglage sous forme d'archive zip.

Importation de préréglages

L'outil Importer n'accepte que les fichiers * .zip prédéfinis, qui ont été générés précédemment avec le même module (l'outil Exporter).

  • Pour importer votre préréglage, vous devez ouvrir l'onglet Outils (1) et choisissez 'Importer' (2).

  • Appuyez ensuite sur le bouton Ajouter un fichier (3) et sélectionnez le fichier zip de votre exportation.

  • Si ce préréglage répond à vos besoins, appuyez sur 'Importer' (4). Ce préréglage sera importé et ajouté à la liste des préréglages disponibles.

Réinitialiser

Réinitialiser - réinitialise tous les préréglages à leur état initial (car ils ont été fournis avec le thème), tous les préréglages personnalisés, créés par l'utilisateur seront supprimés.

Attention! After restoring the default presets, all of the custom presets will be removed!

  • Pour réinitialiser les préréglages, accédez à l'onglet 'Outils' (1).

  • Ouvrez l'onglet 'Réinitialiser' (2) dans le bloc.

  • Et appuyez sur 'Réinitialiser par défaut'.

  • C'est tout! Tous les préréglages sont réinitialisés à l'état initial.

Optimisation des styles et des scripts

L'optimisation des styles et des scripts ajoute des exclusions pour les modules dans la section Header, en fonction de leur utilisation dans les préréglages. Cela permet d'accélérer la vitesse de chargement de la page. L'optimisation fonctionne en mode test.

Activation de l'optimisation:

  • Pour activer l'optimisation, ouvrez l'onglet 'Outils' (1) et sélectionnez l'onglet 'Options' (2).

  • Dans la fenêtre apparue, vous pouvez activer l'optimisation (3).

Si l'optimisation est activée lors de l'édition et de l'activation des préréglages, l'optimisation est rejetée, mais vous verrez une fenêtre, offrant d'exécuter l'optimisation. Il n'est pas nécessaire d'optimiser les scripts et les styles chaque fois que vous modifiez les préréglages. Il est préférable de les optimiser quand vous avez terminé l'édition.

Stylisation
  • Styles de fond. Description des champs:

    • background-image (image de fond) - l'argument est un lien vers l'image. L'image est choisie dans le dossier ~/images/cms/.
    • background-color (couleur de fond) - le valeur peut être définie en tout format de couleur (rgb, hex, etc.). Vous pouvez choisir la couleur à l'aide de l'outil 'Sélecteur de couleurs'.
    • background-repeat (répétition du fond) - toutes les options disponibles sont listées dans la liste déroulante.
    • background-position (position de fond) - toutes les options disponibles sont listées dans la liste déroulante.
    • background-size (taille de fond) - toutes les options disponibles sont listées dans la liste déroulante.
    • background-origin (région de positionnement d'image de fond) - toutes les options disponibles sont listées dans la liste déroulante.
  • Styles de bordure.

    • TYPE: border-top-style, border-right-style, border-left-style, border-bottom-style - toutes les options disponibles sont listées dans la liste déroulante.
    • LARGEUR: border-top-width, border-right-width, border-left-width, border-bottom-width - devrait être configuré en pixels.
    • RADIUS: border-top-right-radius, border-top-left-radius, border-bottom-right-radius, border-bottom-left-radius - should be set in pixels.
    • COULEUR: border-top-сolor, border-right-color, border-left-color, border-bottom-color - le valeur peut être définie en tout format de couleur (rgb, hex, etc.). Vous pouvez choisir la couleur à l'aide de l'outil 'Sélecteur de couleurs'.
  • Autres styles.

    • box-shadow - exemple: 0px 0px 0px 0px rgba(0,0,0,0.75).
Suppression des styles d'élément
  • Pour supprimer les styles d'élément, ouvrez la section de style et appuyez sur le bouton 'Effacer les styles' (1).

Avertissements

Si le message suivant apparaît dans le bloc du module, vous devez activer le module mentionné.

Si le message suivant apparaît dans le bloc du module, vous devez installer le module mentionné.

Dans le cas où vous supprimez ou désactivez le module 'TM Mega Layout', tous les préréglages actifs seront désactivés et vous verrez les positions (crochets) dans leur apparence originale.

Méga Menu TM

Le module est conçu pour créer des menus complexes. Le module permet d'afficher un élément (sans sous-menu), un élément avec un sous-menu et un élément de menu avec sous-menu au moyen d'un bloc multi-rangées et multi-colonnes. Le module peut être utilisé dans différentes positions, mais il affichera le même contenu. Positions disponibles: top (displayTop), left (displayLeftColumn), right (displayRightColumn), footer (displayFooter). Vous pouvez ajouter les catégories (avec des sous-catégories), les catégories CMS (avec sous-catégories), les fabricants (un ou une liste), les fournisseurs (un ou une liste), les magasins (si multistore est utilisé), les liens vers tout produit, le bloc d'informations sur le produit, les liens personnalisés (quantité illimitée), les blocs HTML personnalisés (nombre illimité) et les bannières. Voir ci-dessous pour plus de précisions.

Onglets de Méga Menu TM

Les onglets TM Mega Menu sont les principaux éléments qui sont la partie du menu principal.

Afin de créer un nouvel onglet, ouvrez le module TM Mega Menu et cliquez sur '+' dans la liste d'onglets.

Dans la forme qui s'affiche, remplissez les champs obligatoires.
  • Entrez nom d'onglet
    le titre de l'onglet obligatoire pour la langue par défaut, si les champs de langues supplémentaires ne sont pas remplis, l'onglet prend son nom de la langue par défaut.
  • Actif
    Onglet actif/inactif.
  • Lien
    un lien qui est attribué à cet onglet. Vous pouvez entrer un lien personnalisé, ou choisissez parmi les options existantes (catégories, catégories CMS). Si vous laissez le champ vide, le lien de cet onglet sera inactif.
  • Ordre de tri
    l'ordre des onglets à afficher.
  • Classe spécifique
    la classe qui est ajoutée pour souligner l'élément (classe CSS).
  • Entrer badge d'onglets
    est rempli, en fonction de plusieurs langues.
  • C'est Mega Menu
    l'onglet proposé est un menu Mega *
  • Utiliser Menu simple
    l'onglet proposé est un menu simple. **

* C'est Mega Menu. Si cette option est sélectionnée, il y aura un formulaire pour créer un menu complexe (Mega Menu).

** Utiliser Menu simple. Si cette option est sélectionnée, il y aura un formulaire pour créer un menu simple. Il s'agit d'un menu qui affiche le contenu sélectionné dans une seule colonne. Si le menu comporte un contenu intégré, la nouvelle colonne est ajoutée.

Menu complexe se compose de rangées et de colonnes dans les rangées.

The Rangée est une partie de la structure Mega Menu. Il comprend les colonnes du menu. La rangée existante peut être supprimée en cliquant sur le bouton approprié. Elle sera supprimée avec le contenu qu'il inclut. La quantité de rangées n'est pas limitée.

La colonne est une partie de la structure Mega Menu, placé dans les rangées. (La classe) La largeur de la colonne ne peut pas moins de 2 et plus de 12. Afin de rendre l'affichage du menu correctement, la largeur totale de la colonne ne peut pas dépasser 12. La largeur (classe) est un type de colonne Bootstrap, correspondant aux mêmes valeurs.

Pour créer le menu, appuyez sur le bouton 'Ajouter une rangée'.

Dans la forme apparu, cliquez sur le bouton 'Ajouter une colonne'.

Dans la fenêtre pop-up vous devez spécifier la classe de colonne (de 2 à 12). La colonne elle-même apparaît exactement où vous devez définir les paramètres requis.

Ici, vous pouvez modifier la classe de colonne, la classe CSS et le contenu de la liste fournie. Vous pouvez ajouter/supprimer le contenu en doublecliquant sur l'élément, ou en mettant en surbrillance les éléments et en cliquant sur le bouton correspondant.

Le bloc peut être retiré en appuyant sur le bouton 'Supprimer le bloc' au bas du bloc.

En supprimant la ligne, les colonnes incluses sont aussi supprimées.

Pour déplacer le contenu disponible dans le menu sélectionné, doublecliquez ou sélectionnez le contenu souhaité et appuyez sur le bouton correspondant.

Les informations du menu inactif sont enregistrées lors de la commutation entre les types de menu et vous pouvez toujours changer le type de menu.

HTML Méga Menu TM

Dans cette section, nous expliquerons comment créer un bloc HTML personnalisé dans le Mega Menu.

Le module a un tableau énumérant tous les blocs disponibles. Vous pouvez ajouter un nouveau bloc en cliquant sur le bouton '+' en haut à droite de la table.

Dans la forme qui apparaît, remplissez les champs requis.
  • Entrez le nom d'élément HTML
    le nom du bloc HTML, est obligatoire de remplir pour la langue par défaut.
  • Classe spécifique
    la classe CSS du bloc.
  • Contenu HTML
    le contenu HTML.

Le bloc ajouté apparaîtra dans la liste des blocs, ainsi que dans la liste du contenu disponible lors de la création de blocs de menu.

Liens de Méga Menu TM

Dans cette section, nous montrerons comment créer des liens personnalisés dans le Mega Menu.

Le module contient une liste des liens disponibles. Vous pouvez ajouter un nouveau lien en cliquant sur le bouton '+' en haut à droite de la table.

Dans la forme qui apparaît, remplissez les champs requis.
  • Entrez le nom du lien
    le nom du lien est obligatoire pour être rempli pour la langue par défaut.
  • Entrez URL du lien
    URL du lien, est obligatoire pour être rempli pour la langue par défaut..
  • Classe spécifique
    la classe CSS du bloc.
  • Ouvrir dans une nouvelle fenetre
    ouvrir un lien dans une nouvelle fenêtre.

Le lien ajouté apparaîtra dans la liste des liens, ainsi que dans la liste du contenu disponible lors de la création de blocs de menu.

Bannières Méga Menu TM

Dans cette section, nous expliquerons comment créer des bannières dans le Mega Menu.

Le module contient une liste des bannières disponibles. Vous pouvez ajouter une nouvelle bannière en cliquant sur le bouton '+' en haut à droite de la table.

Dans la forme qui apparaît, remplissez les champs requis.
  • Sélectionner un fichier
    Sélectionnez un fichier, est obligatoire pour être rempli pour la langue par défaut.
  • Nom de bannière
    le titre de la bannière, est obligatoire pour être rempli pour la langue par défaut.
  • Entrez URL du lien
    l'URL de lien, est obligatoire pour être rempli pour la langue par défaut.
  • Classe spécifique
    la classe CSS du bloc.
  • Ouvrir dans une nouvelle fenetre
    ouvrir un lien dans une nouvelle fenêtre.

La bannière ajoutée apparaîtra dans la liste des bannières, ainsi que dans la liste des contenus disponibles lors de la création de blocs de menu.



Produits Mosaïques TM

Ce module vous permet d'afficher des catégories avec des produits, des bannières, des vidéos (Youtube, Vimeo et une vidéo personnalisée), de contenu HTML, des divers sliders avec les nombreuses diapositives sur la page d'accueil.

Installation et suppression

Le module est installé et supprimé comme tout autre module Prestashop.

Paramètres du module

Une fois le module installé, vous pouvez ajouter les blocs requis avec les produits de catégorie, les bannières, les vidéos et le contenu HTML précédemment ajoutés.

Ajout/suppression/édition de blocs

Pour ajouter une nouvelle catégorie, appuyez sur le bouton 'Ajouter un nouveau'.

  • Choisir une catégorie - choisissez une catégorie pour ajouter des produits, des bannières, des vidéos et du contenu HTML.
  • Utilisez le nom personnalisé - l'état de catégorie personnalisée.
  • Nom personnalisé - le titre de catégorie.
  • Etat - l'état de l'élément.
  • Pour ajouter la nouvelle ligne, appuyez sur le bouton 'Ajouter Ligne'. Ensuite, choisissez l'une des huit dispositions présentées dans la fenêtre suivante.

Pour ajouter la disposition, cliquez sur l'une des huit options pour la sélectionner, et elle sera ajoutée au formulaire.

Pour ajouter des éléments, cliquez sur l'une des cellules de disposition. Vous verrez cinq boutons, énumérant les éléments disponibles.

Après avoir appuyé sur l'un des boutons, vous verrez le formulaire pour sélectionner l'élément de type choisi.

Après avoir appuyé sur l'un des éléments, il sera ajouté à la cellule de disposition. Vous pouvez la remplir avec différents blocs de cette façon.

Après avoir enregistré la catégorie avec les disposition choisies, elle apparaîtra sous la forme de catégories ajoutées.

Pour supprimer l'élément, appuyez sur le bouton 'Supprimer'.

Ajout/suppression/édition de bannière

Pour ajouter une nouvelle bannière, cliquez sur le bouton 'Ajouter une nouvelle bannière'. Ensuite, remplissez les champs requis dans la forme qui apparaît.

  • Choisir un fichier - choisissez un fichier, ce champ est requis (au moins pour la langue par défaut).
  • Titre - le titre de la bannière, ce champ est requis (au moins pour la langue par défaut).
  • Url - le chemin de lien, ce champ est requis (au moins pour la langue par défaut).
  • Description - la description de la bannière (au moins pour la langue par défaut).
  • Classe spécifique - la classe CSS du bloc.
Ajout/suppression/édition de vidéo

Pour ajouter une nouvelle vidéo, cliquez sur le bouton 'Ajouter une nouvelle vidéo'. Ensuite, remplissez les champs requis dans la forme qui apparaît.

  • Entrer Nom de Vidéo - le titre de vidéo, ce champ est requis (au moins pour la langue par défaut).
  • Lien de Vidéo/Chemin - le lien vers la vidéo (youtube, vimeo ou la vidéo personnalisée), ce champ est requis (au moins pour la langue par défaut).
  • Autoriser Lecture Automatique - définit si la vidéo démarre automatiquement, juste après le chargement du lecteur.
  • Autoriser Contrôles - définit si les contrôles du lecteur sont affichés.
  • Boucle - définit si la lecture vidéo est dans la boucle infinie.

Pour ajouter une vidéo personnalisée, appuyez sur le bouton 'Fichier'. Ensuite, serez en mesure d'ajouter une vidéo via le gestionnaire de fichiers.

Ajout/suppression/édition de contenu HTML

Pour ajouter un nouveau contenu HTML, appuyez sur le bouton 'Ajouter un nouveau code HTML'. Ensuite, remplissez les champs requis dans la forme qui apparaît.

  • Entrez Nom D'élément HTML - le titre de contenu HTML, ce champ est requis (au moins pour la langue par défaut).
  • Classe spécifique -la classe CSS du bloc.
  • Contenu HTML - le contenu.
Ajout/suppression/édition de slider

Pour ajouter un nouveau slider, appuyez sur le bouton 'Ajouter un nouveau slider'. Ensuite, remplissez les champs requis dans la forme qui apparaît

  • Entrez Nom de slider - le titre slider, ce champ est obligatoire (au moins pour la langue par défaut).
  • Contrôle - afficher/masquer la navigation du slider.
  • Pager - afficher/masquer la pagination du curseur.
  • Défilement Automatique - active/désactive la lecture automatique du slider.
  • Classe spécifique -la classe CSS du bloc.
  • Vitesse du Carrousel - la durée de transition des diapositives (en ms), ce champ est requis.
  • Pause - la période entre la commutation des diapositives (en ms), ce champ est requis.
Ajout/suppression/édition de diapositives

Pour ajouter une nouvelle diapositive, appuyez sur le bouton 'Afficher' dans le formulaire de curseur, puis appuyez sur le bouton 'Ajouter un nouveau' dans une fenêtre qui s'affiche. Ensuite, remplissez les champs requis.

  • Type - choisissez le type de diapositive, ce champ est requis.
  • Liste de Bannière/Vidéo/HTML - choisissez l'élément du type précédemment sélectionné, ce champ est requis.
  • Ordre de Tri - le position de la diapositive.
  • Etat D'élément - l'état de l'élément.


TM MotoPress Slider

Installation du module

Ce module permet d'ajouter MotoPress Slider à votre page HTML. Il peut être installé comme tout autre module Prestashop:

  • Téléchargez le module dans le dossier /modules.

  • Allez au panneau d'administration -> Modules et Services -> Modules et Services (1), trouvez le module (2) et cliquez sur le bouton 'Installer' (3).

  • Une fois le module est installé avec succès, vous pouvez voir le menu 'MotoPress Slider' au bas de votre panneau d'administration (1).
    Appuyez sur le bouton 'MotoPress Slider' dans ce menu(2).

Utilisation du module

Ajout/modification du slider

Maintenant, vous pouvez ajouter un nouveau (1) ou modifier l'élément existant (2).

Ajout d'un nouveau slider

Quand vous avez cliqué sur le bouton 'Ajouter un slider', il y a une option de choisir si cela devrait être 'Slider personnalisé' ou 'Slider de produit'.

La différence entre ces deux types est la suivante: le Slider de produit est créé à partir des produits de votre magasin, cependant, dans le Slider personnalisé, vous pouvez ajouter autant de diapositives que vous le souhaitez, en les personnalisant selon vos besoins.

Les réglages de Slider personnalisé et de Slider de produit, sont légèrement différents.
Ils seront mentionnés ci-dessous.

Configuration du module

Paramètres de Slider

Les paramètres principaux du slider. La description détaillée des paramètres se trouve sur la capture d'écran ci-dessous.

  • Titre du slider - le titre du slider (exemple: Slider1); c'est nécessaire lorsque vous avez plusieurs sliders et devez les distinguer.
  • Alias du slider - l'alias unique qui sera utilisé dans les codes courts pour intégrer le slider (exemple: slider1); doit être unique.
  • Code court du slider - copiez ce shortcode et collez dans votre page.
  • Forcer pleine largeur - activez cette option pour que ce slider s'étende à pleine largeur.
  • Forcer pleine hauteur - activez cette option pour que ce slider s'étende à pleine hauteur.
  • Forcer grille pleine taille - fait la grille s'étende au conteneur parent (mais vous devez toujours définir la largeur et la hauteur de la grille).
  • Taille de grille des couches - permet de définir la largeur et la hauteur initiale des couches.
  • Enable slideshow - activer/désactiver le diaporama.
  • Délai du diaporama - le temps qu'une diapositive reste sur l'écran; est mesuré en millisecondes.
  • Animation de diaporama - choisissez l'animation pour changer les diapositives.
  • Durée du diaporama - la durée de l'animation en millisecondes.
  • Assouplissement du diaporama - l'assouplissement du changement de diapositive.
  • Commencez par une diapositive - index de la première diapositive.
Contrôles

Les options qui font référence aux contrôles de commutation de diapositives.

  • Afficher les flèches - afficher/masquer les flèches.
  • Afficher les puces - afficher/masquer les puces.
  • Afficher la minuterie de diaporama - afficher/masquer la minuterie.
  • Afficher le bouton de lecture/pause du diaporama - afficher ou masquer le bouton de lecture/pause.
  • Masquer les contrôles lorsque la souris dépasse du slider - masque les contrôles lorsque la souris n'est pas sur la zone du slider.
  • Pause en hover - permet de mettre en pause le diaporama en hover.
  • Ordre inverse des diapositives - animer les diapositives dans l'ordre inverse.
  • Afficher un compteur - permet d'afficher le nombre de diapositives.
  • Activer le glissement - activer le glissement sur un ordinateur.
Apparence

Les options qui font référence à l'affichage du slider

  • Afficher sur - les crochets où le curseur doit être affiché.
  • Visible - les résolutions min. et/ou max. d'écran qunad le slider est visible (peut être réglé à l'aide des presets: téléphone / tablette / ordinateur).
  • Retard d'initialisation - the delay bofore slider initialization (should be set in milliseconds).
  • Initialiser le curseur sur le défilement - choisissez si vous voulez que le slider soit initialisé en mode défilement.
  • Nom de classe personnalisé du slider - le nom de la classe personnalisée utilisée pour le slider.
  • Styles personnalisés du slider - les styles css personnalisés peuvent être ajoutés directement dans cette zone.
Contenu

Ce menu apparaît uniquement pour le Slider de produit.
Quand il sera configuré, appuyez sur le bouton 'Créer' (1).

  • Lier les diapositives au produit - activez si vous souhaitez ouvrir la page du produit après avoir cliqué sur la diapositive avec le produit.
  • Ouvrir dans une nouvelle fenetre - enable this option to open the product page in new window.
  • Catégories - les catégories avec produits à afficher dans un slider (Ctrl + clic pour sélectionner plusieurs catégories).
  • Tags - les tags à inclure.
  • Affiche uniquement les produits en stock - seuls les produits en stock seront affichés.
  • Afficher uniquement les produits en vente - seuls les produits en vente seront affichés.
  • Exclure les produits - ajouter des ID de produits séparés par des virgules.
  • Inclure les produits - ajouter des ID de produits séparés par des virgules.
  • Numéro de produit - le nombre de produits à afficher.
  • Nombre de premiers résultats à ignorer (décalage) - le nombre de premières diapositives qui ne seront pas affichées.
  • Trier par - le type d'ordre à appliquer.
  • Direction d'ordre - l'ordre descendant ou ascendant.

Vous trouverez ci-dessous une liste de produits qui seront affichés dans un slider. Après avoir modifié les paramètres, appuyez sur le bouton 'Aperçu des produits'(1).

Une fois que le slider a été configuré, appuyez sur le bouton 'Enregistrer'.

Ajout/édition de diapositives

Pour ajouter une nouvelle diapositive, appuyez sur le bouton 'Ajouter diapositive'(1). Pour éditer celui existant, cliquez sur 'Modifier' (2).

Paramètres de diapositive

MotoPress Slider contient l'éditeur de style. Cela permet de personnaliser les couches de diapositives, leurs styles et textes en utilisant la zone de prévisualisation et en évitant tout changement manuel de code ou de règles CSS.

Sélectionnez le slider pour éditer et choisir la diapositive pour modifier.

Général

Les paramètres de diapositives générales incluent le titre et l'état de la diapositive

Couleur

Dans l'onglet 'Couleur', il existe deux variantes de type de couleur de fond - couleur de fond et gradient. Choisissez l'option et la couleur préférable.

Si vous choisissez gradient, sélectionnez le dégradé de couleur 1, le dégradé de couleur 2 et l'angle de dégradé.

Image

L'image de fond peut être jointe à partir de la bibliothèque multimédia ou de l'URL externe.

L'image peut également être ajoutée à partir de votre dossier local à la Bibliothèque Média. Pour ce faire, appuyez sur le bouton 'Parcourir' (1).

Ensuite, choisissez l'onglet 'Télécharger Nouveau' (2) et cliquez sur la zone sélectionnée ou simplement faites glisser les images.

Vidéo

Vous pouvez ajouter de la vidéo à votre diapositive. Pour ajouter une vidéo, choisissez des sources pour différents formats vidéo et définissez d'autres paramètres pour l'affichage vidéo. Vous devrez télécharger une vidéo dans les formats MP4, WEBM ou OGG et fournir l'URL du fichier vidéo dans l'onglet Vidéo.

Les réglages pour l'affichage vidéo peuvent être ajustés.

Lien

L'onglet Lien permet d'ajouter un lien à votre diapositive, attribuer l'id, la classe, ajouter le titre du lien et la relation:

Visibilité

Les options de visibilité des diapositives peuvent être gérées à partir de l'onglet Visibilité:

Misc

La section Misc permet d'attribuer une classe css ou un id à la diapositive.

Cliquez sur le bouton 'Enregistrer la diapositive' quand vous avez fini de modifier.

Contenu de la diapositive

Ici, vous pouvez ajouter des textes, des images, des boutons et des vidéos à chaque diapositive.
Il est divisé en deux sections principales: 'Paramètres de couche' (1) et 'Tri des couches' (2). Au-dessus de la zone 'Paramètres de couche', il existe quatre onglets pour ajouter le contenu nécessaire (3). Après avoir choisi l'élément que vous souhaitez ajouter, vous pouvez continuer une personnalisation détaillée.
La grande fonctionnalité est que ces contenus sont ajoutés en couches individuelles, Afin que vous puissiez les déplacer vers le haut et vers le bas dans la section 'Tri des couches' (2).

Les couches peuvent être supprimées séparément (4) ou tout à la fois (5).

Paramètres de couche
Ajouter du texte

Cet onglet est créé pour ajouter, modifier et localiser des textes en diapositive.

  • En utilisant des carrés gris, vous pouvez rapidement définir la position du texte (1).
  • Pour l'ajuster, ajoutez la valeur 'X' et 'Y' en pixels et définissez la largeur de cet élément (2).
  • Si 'Whitespace' est réglé sur 'Normal', le texte sera enveloppé normalement. Si 'No-wrap' est choisi, l'emballage sera ignoré(3).
  • Dans la deuxième colonne, vous pouvez contrôler l'animation de l'élément - comment, combien de temps et quand commencer et finir (4) pendant la durée de la diapositive (c'est présenté ci-dessous pour votre commodité(5); pour le modifier, passez aux Paramètres du Slider -> Délai du diaporama). Vous pouvez également prévisualiser l'animation dans la fenêtre qui apparaît après avoir cliqué sur le bouton 'Editer'. Choisissez la durée, la fonction de facilité, l'effet d'animation et appuyez sur 'Play' pour prévisualiser. Ensuite, cliquez sur 'Appliquer' lorsqu'il répond à vos attentes.

Les paramètres décrits ci-dessus sont similaires pour chaque élément, c'est pourquoi les options de la troisième colonne seront mentionnées plus bas.

  • Le texte lui-même peut être ajouté dans la zone de texte(6).
  • Le style de texte peut être choisi parmi les préréglages dans la liste déroulante (7), édité après avoir appuyé sur le bouton 'Editer' (8) et désactivé, cliquez sur le bouton 'Supprimer'(9). Une fois que le style de texte a été modifié, appuyez sur le bouton 'Appliquer le style'. Si vous souhaitez modifier et enregistrer le style existant, appuyez sur le bouton 'Dupliquer', éditez-le et enregistrez-le. Pour créer le style à partir de zéro qui sera souvent appliqué, cliquez sur 'Créer un nouveau préréglage' et modifiez-le.
  • Il est aussi possible d'ajouter une classe personnalisée à chaque élément (10).
Ajouter une image
  • Pour choisir l'image, appuyez sur le bouton 'Sélectionner unr image' (1).
  • Si vous souhaitez ajouter le lien à l'image, ajoutez l'URL de la page cible dans le champ 'Lien'(2).
  • Ce lien peut être ouvert dans une nouvelle fenêtre ('On') ou dans le même ('Off') (3).
  • Certains styles peuvent également être appliqués aux images (par exemple, styles de bordure) (4).
  • Il est aussi possible d'ajouter des classes personnalisées à l'élément(5).
Ajouter un bouton

Les styles de boutons sont presque identiques aux styles d'image.

  • Ajouter le texte du bouton dans le champ correspondant (1).
  • Ajoutez l'URL de la page cible dans le champ 'Lien' (2).
  • Choisissez le style de votre bouton ou créez votre propre style (3).
Ajouter une vidéo
  • La vidéo peut être ajoutée comme un lien vers Youtube ou Vimeo, ou il peut être choisie de la Bibliothèque Multimédia(1).
  • Ajouter l'URL de la vidéo (2).
  • Ajouter l'URL de l'image d'aperçu (3).
  • Choisissez les options d'affichage vidéo (4) et ajoutez des styles (5).

Après avoir fait des modifications à votre diapositive,(1), n'oubliez pas de cliquer sur le bouton 'Enregistrer la diapositive', puis appuyez sur 'Fermer' (2) ou allez vers d'autres diapositives (3).

Importation et exportation de slider

Import & Export de Slider est très utile si vous devez transférer un slider sur différents sites Web. Vous n'avez pas besoin de passer beaucoup de temps à reconstruire des sliders à partir de zero. Si vous êtes un développeur, vous pouvez créer des sliders sur votre site Web, montrez-les à vos clients et importez ces slides sur les sites Web des clients.
Exportation de slider
Suivez ces étapes faciles pour apprendre à exporter le Slider Motopress.
  • Allez à Motopress Slider dans votre panneau d'administration (1, 2).

  • Cliquez sur le bouton 'Exporter' (3).

  • Choisissez les sliders que vous voulez exporter (4) et cliquez sur le bouton 'Exporter les Sliders' (5).

  • Vous serez invité à enregistrer le fichier .json exporté sur l'ordinateur.
Importation de slider
Pour importer Motopress Slider, procédez comme suit:
  • Allez à Motopress Slider dans votre panneau d'administration (1, 2).

  • Appuyez sur le bouton 'Importer' (3).

  • Sélectionnez le fichier .json exporté à partir de votre ordinateur, en cliquant sur le bouton 'Parcourir' (4) et appuyez sur 'Importer' (5).

  • Les paramètres du slider, les images et autres contenus du slider devraient être exportés avec succès sur votre site.

TM Newsletter

Le module affiche une notification avec une proposition pour s'inscrire à la boutique dans une fenêtre pop-up. La vérification par é-mail peut être activée dans les paramètres du module au moyen d'e-mail de confirmation. Vous pouvez également ajuster le délai entre les rappels pour les utilisateurs enregistrés et non enregistrés. Les utilisateurs enregistrés peuvent abandonner définitivement les rappels.

Installation/désinstallation du module

Le module est installé et supprimé de la même manière que tout autre module PrestaShop.

Paramètres du module

Une fois le module est installé, vous pouvez le configurer sur la page de configuration du module.

  • Mode en direct - activer/désactiver le module.
  • Voulez-vous envoyer un e-mail de vérification après l'abonnement? - activer/désactiver l'envoi un e-mail de vérification.
  • Délai d'attente pour les invités - définissez le délai d'expiration des abonnements pour les invités.
  • Délai d'attente pour les clients - définissez le délai d'expiration des abonnements pour les clients.

Il est nécessaire d'installer et d'activer le bloc 'Newsletter' pour un bon travail de module.

TM Olark Chat

Le module pour afficher Olark Chat sur le frontend de votre magasin.

Installation/désinstallation du module

Ce module peut être installé/désinstallé comme tout autre module PrestaShop.

Paramètres du module

Une fois le module installé, vous pouvez le configurer sur la page de configuration du module.

Pour configurer Olark Chat, que vous pouvez voir sur la démonstration du modèle, vous devez vous inscrire sur le site officiel et obtenir l'ID pour votre site Web. Entrez votre ID dans le champ "ID du site Olark" et définissez le module sous "Mode en direct". Maintenant, enregistrez les paramètres en cliquant sur le bouton 'Enregistrer'.



Commande 1-Clic TM

Le module permet de rendre la commande beaucoup plus rapide qu'avant.
Il simplifie la procédure de cinq étapes à une et rend la procédure de commande plus attrayante pour les clients qui souhaitent économiser leur temps.
Grâce à cette fonctionnalité, vous pouvez obtenir plus d'achats spontanés. qui auront un impact positif sur votre entreprise.

Installation

Allez aux Modules et Services -> Modules et Services (1) dans votre panneau d'administration et trouvez le module Commande 1-Clic TM (2). Puis appuyez sur le bouton 'Installer' (3).

Configuration du module

Une fois que le module a été installé avec succès, la page de 'Configuration' avec les paramètres du module sera ouverte.
Vous verrez le nouvel élément de menu 'Commandes Rapides' (1) et une nouvelle icône apparaîtra dans le panneau de navigation(2).

Les paramètres sont divisés en trois onglets - Modèle de précommande (1), Message de réussite du précommande (2) et Paramètres (3).

Modèle de précommande
  • Ici, vous pouvez ajouter un nouveau champ en appuyant sur le bouton correspondant (1):

    Choisissez les options pour le nouveau champ et cliquez sur le bouton 'Enregistrer' (1):

    • Type - choisissez le type de champ.
    • Classe spécifique - sjoutez la classe personnalisée pour le champ actuel.
    • Nom - le nom du champ.
    • Description - la description du champ; apparaît sous l'entrée.
  • Modifier le champ existant.

    Cliquez sur le champ que vous souhaitez modifier. Les paramètres sont les mêmes que pour ajouter un nouveau champ.

  • Supprimer les champs du formulaire.
    Appuyez sur le bouton 'Supprimer' (1) dans le coin supérieur droit du champ.

Message de réussite du précommande

L'onglet permet de modifier le message pour la fenêtre d'alerte Qui apparaît après avoir cliqué sur le bouton 'Envoyer' du formulaire de commande rapide.

Ajoutez le texte / bouton que vous souhaitez afficher et cliquez sur le bouton 'Enregistrer' (1).

Paramètres

L'onglet permet d'activer ou de désactiver l'option 'Ordre Ajax'.

Cela aide l'administrateur à voir les nouvelles commandes rapides qui ont été soumises lors du traitement des commandes existantes.

Si l'option est activée, l'option supplémentaire 'Délai d'attente Ajax' apparaît.
La valeur est définie en millisecondes et signifie la période entre chaque vérification des nouveaux ordres rapides.

Cette option permet d'ouvrir de nouveaux précommandes sans rechargement de page. Pour les voir dans la liste des commandes rapides, appuyez sur le lien "Charger Nouveaux Commandes"(1) dans le menu Commandes -> Commandes Rapides.

Traitement des commandes

Allez vers Commandes -> Commandes Rapides (1) dans votre panneau d'administration.

Il a quatre onglets - Nouveau, Créé, Supprimé et Recherche.

  • Nouveau - les nouvelles précommandes qui ont été soumis par les clients.

    Dans la partie gauche, il existe un bouton pour créer un nouveau pré-ordre(1) et une liste de préordres (2).

    droite, vous pouvez voir les détails de précommande (3) divisé en onglets (Informations de précommande, Client, Langues et devises, Panier, Bons, Adresses, Livraison, Résumé).

    Si l'ordre vient d'être créé, vous ne verrez que trois - Informations de précommande, Client, Langues et devises.

    Lorsque vous complétez les informations sur le client, trois autres onglets apparaîtront- Panier, Bons et Adresses. Lorsque les informations d'adresse sont ajoutées, les onglets Livraison et Résumé s'affichent. Les onglets où toutes les informations requises ont été ajoutées avec succès, sont colorés en vert. Les onglets de couleur jaune nécessitent plus de détails sur les commandes. Les bleus sont informatifs, ils sont générés automatiquement.
    Lorsque l'onglet Résumé apparaît, il y a un bouton 'Créer Commande' dans l'onglet Résumé (1).

    Après avoir cliqué, le précommande sera transféré de 'Nouveau' à la liste des précommandes 'Créé' (1).

    Si vous devez supprimer l'ordre, Il y a une icône de 'poubelle' dans le coin supérieur droit(1).

    Appuyez sur cette icône et le pré-ordre sera transféré dans l'onglet 'Supprimé'.

  • Créé - les précommandes déjà traités par l'administrateur.

    Choisissez la commande à gauche et cliquez pour voir les informations détaillées à droite.

    Vous pouvez aussi appuyer sur le lien 'Afficher' pour voir les informations complètes sur le client(1), l'ordre (2) et l'employé(3).

  • Supprimé - les préordres annulés.

    La précommande dans cet onglet peut encore être récupérée en cliquant sur le bouton '+' (1). Ensuite, il sera transféré à l'onglet 'Nouveau'.

  • Recherche - la recherche de précommandes. Entrez la recherche (par l'information du client, l'information de l'employé, ID de commande, ID de précommande); vous pouvez également entrer la date/la période spécifiquede quand les préordres ont été créés.



Onglet Personnalisé du Produit TM

Le module sert à créer un onglet supplémentaire sur la page du produit pour afficher des informations supplémentaires. Le module présente un avantage par rapport à la fonctionnalité existante, en raison de la capacité d'ajouter des images, du texte, de la vidéo, des liens, etc..

Installation et suppression

Le module peut être installé et supprimé comme tout autre module PrestaShop.

Paramètres du module

Après l'installation du module, vous pouvez ajouter de nouveaux onglets pour les produits à la page de configuration du module, ainsi que sur la page d'édition du produit.

Ajout d'onglets dans la configuration du module:

Pour ajouter un nouvel onglet, appuyez sur le bouton 'Ajouter un Nouveau' (1).

  • Ajout d'un onglet à un ou plusieurs produits d'une catégorie précédemment sélectionnée.

    • Titre D'onglet - le nom de l'onglet, requis.
    • Description D'onglet - les informations sur l'onglet, il peut inclure des données au format d'une image, texte, vidéo, liens, etc..
    • Etat - l'état de l'élément.
    • Paramètres Aupplémentaires - activation/désactivation des paramètres supplémentaires.
    • Choisir une Catégorie - le choix des catégories pour lesquelles l'onglet doit être affiché.
    • Produits à Afficher - la sélection des produits des catégories précédemment sélectionnés.
  • Ajout de l'onglet aux produits appartenant aux catégories sélectionnées.

  • Pour ajouter un onglet à tous les produits, désactivez l'option 'Paramètres Supplémentaires'.

Modification de la position d'affichage de l'onglet

Faites glisser et déposez l'onglet nécessaire pour changer sa position.

Ajout d'onglets dans les paramètres du produit:

Accédez à la page du produit et cliquez sur le lien 'Onglet Personnalisé du Produit TM' dans le menu de gauche.

Si l'option 'Paramètres Supplémentaires' est désactivée, l'onglet sera ajouté au produit qui a été édité plus tôt. Vous pouvez également ajouter l'onglet aux produits qui appartiennent à certaines catégories, ou vous pouvez l'ajouter à plusieurs produits appartenant à la catégorie précédemment sélectionnée.

Pour changer la position d'affichage des onglets, faites glisser-déposer les blocs. Vous pouvez également modifier ou supprimer des onglets.

Galerie de Liste des Produits TM 2.0.0

Ce module affiche toutes les images de produits disponibles sous la forme d'une galerie sur les pages des liste de produits. Selon les paramètres que vous choisissez, le module peut afficher des images sous la forme de roulement ou d'un diaporama.

Installation et suppression du module

Ce module peut être installé et supprimé comme tout autre module PrestaShop.

Paramètres du module

Une fois le module installé, ouvrez le fichier product-list.tpl dans votre dossier racine de modèle, trouvez le code suivant:

et remplacez-le par:

    {capture name='displayProductListGallery'}{hook h='displayProductListGallery' product=$product}{/capture}
    {if $smarty.capture.displayProductListGallery}
      {hook h='displayProductListGallery' product=$product}
    {else}
      <a class="product_img_link" href="{$product.link|escape:'html':'UTF-8'}" title="{$product.name|escape:'html':'UTF-8'}" itemprop="url">
      <img class="replace-2x img-responsive" src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')|escape:'html':'UTF-8'}" alt="{if !empty($product.legend)}{$product.legend|escape:'html':'UTF-8'}{else}{$product.name|escape:'html':'UTF-8'}{/if}" title="{if !empty($product.legend)}{$product.legend|escape:'html':'UTF-8'}{else}{$product.name|escape:'html':'UTF-8'}{/if}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} itemprop="image" />
      </a>
    {/if}

Après l'installation et la connexion du module, vous pouvez le configurer sur la page de configuration du module.

Le module comporte les paramètres suivants:
  • Type - sélectionnez le type d'affichage: roulement ou diaporama.

Si vous choisissez roulement, alors vous pouvez sélectionner l'effet d'animation:

Type d'animation:
  • Glissade d'opacité - changements d'opacité;
  • Glissade horizontale - horizontal;
  • Glissade verticale - vertical.

Si vous choisissez diaporama, vous trouverez les paramètres suivants:

  • Afficher les éléments - le nombre d'éléments affichés;
  • Infini - le cycle de diaporama infini;
  • Pager - l'affichage de la pagination dans le diaporama;
  • Contrôles - l'affichage des contrôles dans le diaporama;
  • Utiliser des vignettes - l'affichage des miniatures dans le diaporama;
  • Pager - l'affichage de la pagination dans le carrousel des miniatures;
  • Contrôles - l'affichage des contrôles dans le carrousel des miniatures;
  • Position - le mode carrousel vertical ou horizontal;
  • Mode Centre - le centrage de la vue carrousel des miniatures;
  • Eléments visibles - le nombre d'articles sur une seule ligne;
  • Eléments à défiler - le nombre d'éléments défilés dans le carrousel des miniatures.


Vidéos du Produit TM

Ce module permet d'ajouter un nombre illimité de vidéos à tout produit dans n'importe quelle langue et magasin.

Installation et suppression

Le module est installé et supprimé comme tout autre module Prestashop. Il n'a pas de page de configuration et supporte les multi-magasins.

Après l'installation du module, vous verrez le nouvel onglet dans la page de configuration de votre produit (Catalogue -> Produit -> Sélectionner un produit - Vidéos du Produit TM).

Pour ajouter une vidéo à un produit, vous devez remplir les champs requis (le champ de lien est obligatoire). Le module est multilingue, alors vous devrez remplir les champs pour toutes les langues auxquelles cette vidéo est liée. Si le champ de lien n'est pas rempli pour aucune langue, la vidéo ne sera pas ajoutée pour cette langue. Le module est censé afficher des vidéos Youtube et Vimeo, alors vous devez ajouter des liens à partir de ces ressources. Après avoir effectué les modifications, cliquez sur le bouton 'Enregistrer'/'Enregistrer & Rester'.

Exemples de liens

Pour afficher correctement la vidéo, les liens doivent avoir le format suivant:

  • Youtube
    https://www.youtube.com/embed/K6VcTyaym90
  • Vimeo
    http://player.vimeo.com/video/66140585

Si le produit a une vidéo liée à cette langue, vous verrez la liste des vidéos ci-dessous.

Pour enregistrer, supprimer ou modifier la liste, il n'y a pas besoin de cliquer sur le bouton 'Enregistrer'/'Enregistrer & Rester'. Utilisez les boutons situés dans les blocs vidéo. Pour modifier l'ordre des vidéos, utilisez la méthode glisser-déposer pour changer leur position. Pour activer/désactiver la vidéo, utilisez le bouton à côté de la vidéo. Pour éditer des vidéos, remplissez les champs avec les données requises et appuyez sur le bouton 'Actualiser'.

Pour supprimer la vidéo de la liste, cliquez sur le bouton 'Supprimer Vidéo'.

En changeant de langue, seule la liste des vidéos liées à la langue apparaîtra.

Pour afficher la vidéo en format agrandi, appuyez sur le bouton 'Zoom' sous cette vidéo.



Zoom de Droduit TM

Ce module est une solution alternative pour le zoom d'image de produit standard sur la page de produit. Il est entièrement compatible avec le carrousel supplémentaire standard de la miniature des produits et les attributs du produit. Il vous permet de choisir parmi les trois options disponibles (fenêtre/lentille/interne) pour zoom d'image avec les paramètres avancés du plugin. Le module est basé sur le plugin Elevatezoom Plus.

Installation et suppression

Le module est installé et supprimé comme tout autre module Prestashop. Une fois le module installé l'effet de zoom standard du produit sera automatiquement désactivé. Après avoir supprimé le module, l'effet standard devrait re-activé à nouveau manuellement (si nécessaire) dans Préférences -> Produits -> Activer JqZoom au lieu de Fancybox sur la page du produit.

Configuration du module

Une fois le module installé, vous pouvez le configurer sur la page de configuration du module.

Par défaut, la page de configuration montre l'ensemble simplifié d'options.

  • Mode en direct - le module est on/off.
  • Fancybox - pour afficher l'image agrandie dans la Fancybox en cliquant.
  • Changer l'image en hover - changer l'image principale de la vignette en hover (par défaut, est configuré pour basculer en clic).
  • Adaptable - Permet l'utilisation de fonctionnalités adaptables pour l'affichage des plugins sur les appareils mobiles.
  • Type de zoom - Choisissez le type de mode d'affichage d'image agrandie
    • fenêtre - l'image agrandie apparaît à côté de l'image principale dans l'une des positions disponibles (16)
    • lentille - l'image est zoomée comme sous l'objectif en haut
    • interne - l'image est agrandie à l'intérieur du conteneur d'image principal, la couvrant complètement.
    The mobile devices (< 768) Les appareils mobiles ont un mode "lentille" activé immédiatement.
  • Paramètres étendus - permet des paramètres avancés pour les utilisateurs expérimentés. Vous pouvez consulter la documentation officielle pour plus de détails.
Configuration étendue du module
  • Défilement de zoom - le changement du taux de zoom sur le défilement de la molette de la souris (disponible pour tous les types).
  • Curseur - le type de curseur sur l'image agrandie. Les options suivantes sont disponibles: par défaut, curseur, pointeur (disponible pour tous les types).
  • Paramètres de zoom - disponible pour tous les types, si le 'Défilement de zoom' est activé.
    • Niveau de zoom - le niveau de zoom en hover initial
    • Min Niveau de zoom - un niveau de zoom minimum
    • Max Niveau de zoom - un niveau de zoom maximal
    • Augmentation du défilement de zoom - une augmentation du défilement de zoom
  • Assouplissement - l'effet d'apparence d'image agrandie (disponible pour tous les types).
    • Zoom arrière - effet activé/désactivé
    • Quantité d'assouplissement - effet de la valeur de retard
  • Image Crossfade - le flou de l'image principale en dehors de la zone de hover (lentille) - disponible pour fenêtre, lentille.
  • Paramètres de la fenêtre d'image agrandie - disponible pour la fenêtre.
    • Largeur de la Fenêtre de Zoom - la largeur de fenêtre en px
    • Hauteur de la Fenêtre de Zoom< - la hauteur de la fenêtre en px
    • Décalage X de la fenêtre de Zoom - le décalage de fenêtre sur l'axe X
    • Décalage Y de la fenêtre de Zoom - le décalage de fenêtre sur l'axe Y
    • Position de la fenêtre de Zoom - le choix de la position de la fenêtre par rapport à l'image principale (les positions disponibles sont présentées sur l'image ci-dessous ce champ)
    • Couleur de fond de la fenêtre de Zoom - l'image de fond de la fenêtre (uniquement pour les images transparentes)
    • Intensité du zoom augmente - l'effet du ralentissement de la disparition de la fenêtre
    • Intensité du zoom diminue - l'effet du ralentissement de la disparition de la fenêtre
    • Taille de bordure - la largeur de bordure de fenêtre en px
    • Couleur de la bordure - la couleur de la bordure de la fenêtre
  • Lentille - l'effet de la lentille (disponible pour fenêtre, lentille).
    • Lentille - on/off
    • Forme de lentille - le type de lentille. Il peut prendre les valeurs suivantes: circulaire/arrondie ou carrée/rectangulaire
    • Couleur des lentille - le ouleur de fond intérieur de lentille
    • Opacité des lentille - l'opacité du fond intérieur des lentilles
    • Taille de lentille - la taille de lentille en px
    • Lentille augmente - la vitesse de l'effet d'apparence des lentilles
    • Lentille diminue - la vitesse de l'effet de disparition des lentilles
    • Bordure de lentille - la largeur de bordure de lentilleh
    • Couleur de bordure de lentille - le couleur de bordure de lentille
    • Contenir la lentille - la restriction du débordement de lentille vers l'extérieur du conteneur d'image principal
  • Teinte - l'effet de nuance sur la zone située à l'extérieur de l'objectif (disponible pour la fenêtre).
    • Teinte - on/off
    • Couleur de teinte - le fond de la surface extérieure de la lentille
    • Opacité de teinte - l'opacité de la surface extérieure de la lentille
    • Teinte augmente - la vitesse de l'effet d'apparence
    • Teinte diminue - la vitesse de l'effet de disparition
Si vous changez le type de zoom, le réglage des options avancées est modifié en conséquence pour afficher uniquement les paramètres disponibles pour le type sélectionné.
Faites attention lors de l'édition des paramètres étendus. Si les paramètres sont réglés incorrectement, l'effet peut être laid.


Gestionnaire de Produits TM

Introduction

Le module est créé pour gérer les magasins en ligne, en particulier les magasins avec une grande quantité de produits. En utilisant ce module, vous pouvez facilement filtrer vos produits et effectuer différents changements.

Installation et suppression du module

Le module est installé et supprimé comme tout autre module Prestashop.

L'enlèvement ou la réinstallation du module ne réinitialisera pas les modifications que vous avez effectuées en l'utilisant.

Une fois le module a été installé avec succès, accédez à Catalogue -> Gestionnaire de produits TM (1) pour voir le menu principal du module.

Performance

Le menu principal du module est divisé en deux parties principales 'Choisir la section' (1) and 'Choisir l'option' (2).

La première partie est créée sous la forme d'onglets - Information, Prix, Associations et Quantité.

  • Information - les options concernant la disponibilité et la description des produits.
  • Prix - les paramètres des prix et des règles fiscales.
  • Associations -la possibilité de changer la marque, la catégorie ou les accessoires de plusieurs produits.
  • Quantité - le changement de quantité de produits.
  • Ouvrez chaque onglet pour voir les options disponibles dans cette section. Ils seront décrits plus bas.
    Chaque option a un soupçon - une brève description, qui apparaît à droite lorsque vous passez la souris sur l'option(1).

  • Choisissez l'option nécessaire et appuyez.

  • L'étape suivante est le filtrage des produits. Définissez les options de filtrage selon vos besoins et cliquez sur le bouton 'Sélectionner' (1). Pour effacer les filtres sélectionnés, cliquez sur le bouton 'Réinitialiser' (2).

    Cliquez simplement sur la croix (1) près de la valeur de la propriété du produit et elle sera supprimée.

  • Au-dessous des filtres, il existe une liste de produits correspondant aux critères sélectionnés. Vous pouvez le modifier si vous devez supprimer certains produits de la liste. Chaque produit peut être retiré séparément en cliquant sur le bouton 'Supprimer de la liste' (1). Pour supprimer tous les produits de la liste, appuyez sur les boutons 'Tout sélectionner' (2) et 'Supprimer sélectionné' (3). Si vous avez coché un grand nombre de produits et que vous souhaitez les décocher, cliquez sur le bouton 'Tout déselectionner' (4).

  • Lorsque la liste des produits sélectionnés se conforme toutes les exigences, cliquez sur le bouton 'Processer' (1).

  • Réglez l'option/options selon vos besoins et appuyez sur le bouton 'Enregistrer' (1). Si avez besoin de faire quelques modifications dans la liste des produits, appuyez sur le bouton 'Retour au filtre' (2).

    Veuillez noter que vous ne pourrez pas annuler ces changements de la même manière.

Options disponibles

Information

La section permet de configurer les options suivantes:

  • Activer/Désactiver les produits - définissez l'état ON/OFF de vos produits.
  • Disponible pour la commande - rendre certains produits disponibles ou indisponibles pour la commande.

    REMARQUE: si 'Disponible pour la commande' est réglé sur 'OUI' pour les produits avec des prix cachés, leurs prix apparaîtront automatiquement à nouveau.

  • Afficher le prix - afficher ou masquer le prix du produit.

    REMARQUE: si vous définissez 'Afficher le prix' à 'NON' pour les produits, qui sont disponibles pour la commande, ils deviendront automatiquement indisponibles.

  • En ligne seulement - appliquez 'En ligne seulement' aux éléments sélectionnés.
  • Condition - modifiez l'état de plusieurs produits.
  • Brève description - ajoutez une brève description qui devrait s'appliquer à tous les produits sélectionnés.
  • Description complète - ajoutez une description aux produits sélectionnés avec la possibilité de le placer avant la description principale, après, ou remplacez la description complète par la nouvelle.
  • Tags - ajoutez plus de tags aux produits choisis.
Prix

dans cette section, vous pouvez modifier les options concernant le prix du produit.

  • Afficher 'En vente' - afficher les éléments sélectionnés avec la marque 'En vente'.
  • Modifier les règles fiscales - choisissez les règles fiscales qui s'appliqueront à plusieurs produits.
  • Ajouter un nouveau prix spécifique - définissez le prix spécial pour certains produits avec la possibilité d'ajouter la période d'activation du prix.
Associations

Ici, vous pouvez modifier les options liées aux relations avec les produits.

  • Changer la marque - changer la marque des produits sélectionnés.
  • Changer la catégorie par défaut - choisissez la catégorie qui sera définie comme défaut pour certains produits.

    REMARQUE: vous ne pouvez choisir qu'une seule catégorie par défaut. Veuillez noter que votre catégorie par défaut actuelle sera remplacée par la nouvelle.

  • Modifier les catégories connexes - définissez les catégories liées à plusieurs produits avec la possibilité d'enregistrer ou de supprimer des anciennes relations.
  • Ajouter des accessoires - ajouter les accessoires adaptés aux produits choisis.
Quantité

Cette option permet de définir la quantité de produit ou d'augmenter/diminuer la quantité actuelle.

  • Changer la quantité - définissez la quantité requise de certains produits.


Slider de Produits TM 2.0.0

Introduction

Ce module sert à créer des galeries, en fonction des données du produit et en les affichant sous la forme de diapositives sur le frontend du site. Le module fournit 4 méthodes d'affichage de la galerie avec des paramètres individuels. Chaque méthode possède des fonctionnalités prédéfinies. La configuration avancée est aussi disponible. Le module peut afficher une quantité illimitée de produits avec des informations diverses.

Installation et suppression du module

Si vous avez la version 1.n de ce module installé dans Prestashop, il n'est pas recommandé de le mettre à jour. Vous devez d'abord supprimer l'ancienne version du module de fonctionner sans erreurs.

Le module est installé et supprimé comme tout autre module Prestashop.

Après la suppression ou la réinstallation du module, tous les paramètres et les filtres sont mis au rebut.

Ajout/suppression/édition d'une diapositive

Ajout d'une diapositive

Pour ajouter un produit à la galerie, accédez au produit nécessaire dans Catalogue -> Produits. Appuyez ensuite sur le bouton 'Editer' (1) à côté du produit nécessaire.

Dans la fenêtre pour éditer des informations sur le produit, naviguez à l'onglet Slider de Produits TM (2) et marquez (3) que vous souhaitez que le produit soit affiché dans un slider.

Enregistrez les modifications en appuyant sur le boutons 'Enregistrer & Rester' (4) ou 'Enregistrer' (5).

Suppression d'une diapositive

Il existe deux façons de supprimer une diapositive.

  • Pour exclure un produit de la galerie, accédez au produit nécessaire dans Catalogue -> Produits. Appuyez ensuite sur le bouton 'Editer' (1) à côté du produit nécessaire.

    Dans la fenêtre pour éditer des informations sur le produit, naviguez à l'onglet Slider de Produits TM (2) et retirez la case à cocher (3), ce qui signifie que vous ne souhaitez pas que le produit s'affiche dans un slider:

    Enregistrez les modifications en appuyant sur le boutons 'Enregistrer & Rester' (4) ou 'Enregistrer' (5).

  • La deuxième façon est de naviguer vers la page de configuration du module, de trouver le produit nécessaire dans la Liste des diapositives et appuyez sur le boutom Supprimer (1) à côté.

    Ensuite, confirmez la suppression.

Ordre d'affichage des diapositives

Par défaut, les diapositives sont affichées dans l'ordre où ils ont été ajoutés. Pour modifier l'ordre d'affichage, accédez à la page de configuration du module et faites glisser la diapositive vers l'endroit souhaité dans la Liste des diapositives.

Désactivation des diapositives

De plus, vous pouvez désactiver temporairement une diapositive (pour la période pendant laquelle un produit n'est plus disponible ou pour toute autre raison) sans l'enlever complètement. Pour ce faire, accédez à la page de configuration du module et marquer une coche à côté du produit nécessaire (s'il est actif maintenant) ou cliquez sur croix (s'il est inactif) dans la Liste des diapositives:

Types de galeries et paramètres recommandés

Il existe quatre types d'affichage de la galerie (standard, liste, grille, pleine largeur). Chacun d'eux peut être configuré indépendamment et vous pouvez basculer entre eux si nécessaire.

Par défaut, la galerie utilise les types d'image de produit suivants: large_default - pour l'image principale; medium_default - pour les miniatures.

Standard

Recommended settings:

  • Taille d'image (px) - 435*435
  • Largeur de galerie - 1170px
  • Hauteur de galerie - 580px
  • Paramètres avancés - off
Liste

Paramètres recommandés:

  • Taille d'image (px) - 435*520
  • Largeur de galerie - 1170px
  • Hauteur de galerie - 520px
  • Paramètres avancés - off
Grille

Paramètres recommandés:

  • Taille d'image (px) - 585*750
  • Largeur de galerie - 1170px
  • Hauteur de galerie - 750px
  • Paramètres avancés - off
Pleine largeur

Paramètres recommandés:

  • Taille d'image (px) - 435*435
  • Largeur de galerie - 1920px
  • Hauteur de galerie - 450px
  • Paramètres avancés - off

Paramètres avancés

Pour accéder aux paramètres avancés, définissez pour Paramètres avancés la position OUI.

  • Type de galerie - le type de galerie active
  • Largeur de galerie - la largeur de la galerie active
  • Hauteur de galerie - la hauteur de la galerie active
  • Paramètres avancés - las paramètres étendus; si l'option est déplacée vers la position NON, tous les paramètres étendus seront sauvegardés et vous pourrez les restaurer à tout moment. Dans le même temps, à l'interface, il sera affiché par défaut
  • Durée du slider - la vitesse de changement de diapositive
  • Utiliser la navigation - l'affichage des boutons Précédent / Suivant pour la commutation de diapositives
  • Utiliser les miniatures - utiliser des miniatures avec des informations supplémentaires sur les diapositives comme élément de commutation de la diapositive actuelle
  • Utiliser la pagination - utiliser la pagination comme élément pour la commutation de la diapositive actuelle
  • Utiliser l galerie d'images - chanter des images de produits supplémentaires à l'intérieur des diapositives
  • Autoriser la lecture automatique - permettre le changement automatique de diapositive
  • Intervalle de slider - l'intervalle de temps, après lequel la diapositive passera à une autre (disponible uniquement si 'Autoriser la lecture automatique' est actif)
  • Autoriser la boucle - allow repeating slides from the beginning after all the slides were shown

Après avoir changé la galerie, toute la configuration de la galerie précédemment utilisée est sauvegardée.

Après avoir désactivé/activé les paramètres avancés, les paramètres sont sauvegardés et vous pouvez y revenir à tout moment.

FAQ

  • Pourquoi la galerie ne s'affiche pas sur le frontend?
  • Je change les paramètres avancés de la galerie, mais je ne vois pas les modifications sur le frontend. Que peut-on faire?
Assurez-vous que la galerie a diapositives, et au moins un d'entre eux est actif.
Assurez-vous que vous modifiez les paramètres de la galerie active.

Produits Connexes TM

Le module a été conçu pour ajouter et afficher les produits connexes sur la page du produit.

Installation du module

Ce module peut être installé et supprimé comme tout autre module PrestaShop.

Paramètres du module

Après l'installation, vous pouvez modifier ses paramètres sur la page de configuration du module.

  • Afficher le prix du produit.
  • Nombre de produits à afficher.

Vous pouvez ajouter ou supprimer des produits connexes pour le produit principal dans les paramètres du produit Catalogue -> Produit.

  • Naviguez vers Produits Connexes TM;
  • Dans le champ de recherche du produit, commencez à taper le titre du produit, et choisissez-le à partir des variantes proposées;
  • Pour supprimer le produit de la liste, cliquez sur le signe X avant le produit;
  • Une fois que tous les changements ont été effectués, cliquez sur le bouton 'Enregistrer & Rester' ou 'Enregistrer'.


Recherche TM 1.1.0

C'est une version de recherche étendue qui vous permet de sélectionner une catégorie spécifique dans son contenu pour la recherche. On peut modifier la catégorie après avoir défini la requête. Il offre également la possibilité de définir l'affichage de l'information supplémentaire (description/prix/fabricant, etc.), et configurer la disposition des conteneurs des résultats de recherche, par eg., vous pouvez diviser les résultats en quelques sections avec les contrôles (pagination, suivant/précédent/afficher tout).Tous les paramètres du module sont disponibles dans le panneau d'administration.

Installation et suppression

Si vous avez installé la version 1.0.5 de ce module dans votre prestashop, il n'est pas recommandé de mettre à jour à la version 1.1.0. D'abord, vous devez supprimer l'ancienne version du module sans erreurs.

Le module est installé et supprimé de la même manière que tout autre module PrestaShop.

Configuration du module

Une fois le module installé, vous pouvez le configurer sur la page de configuration du module.

  • Activer Recherche Ajax - active la recherche en direct dans un menu déroulant.
  • Activer Recherche Instantanée - active la recherche instantanée.
  • Longueur de requête minimale - le nombre de symboles pour démarrer l'affichage des résultats.
  • Nombre de résultats affichés - le nombre de produits présentés dans la section des résultats (le ombre de produits par page pour le mode "pager" ou "navigation").
  • Afficher le bouton "Afficher tout" - Affiche le bouton "Afficher tout" au-dessous des résultats. Si on appuie sue ce bouton, il affichera tous les résultats trouvés.
  • Afficher le pager - divise les résultats en pages (ca dépend de la valeur du champ 'Nombre de résultats affichés') et affiche des liens vers eux.
  • Afficher la navigation - affiche les boutons Précédent/Suivant.
  • Position de navigation - crochet(s), pour montrer la navigation(top/both/bottom options sont disponibles).
  • Mettre en évidence le résultat de requête - met en évidence le texte qui correspond à la requête de recherche.
  • Afficher l'image dans Recherche Ajax - affiche les images du produit dans la section des résultats.
  • Afficher la description dans Recherche Ajax - affiche la description du produit dans la section des résultats.
  • Afficher les prix dans Recherche Ajax - affiche le prix du produit dans la section des résultats.
  • Afficher la référence dans Recherche Ajax - affiche la référence du produit dans la section des résultats.
  • Afficher le fabricant dans Recherche Ajax - affiche le fabricant du produit dans la section des résultats.
  • Afficher les fournisseurs dans Recherche Ajax - affiche les fournisseurs de produits dans la section des résultats.

Certains paramètres peuvent varier en fonction de la combinaison utilisée.



TM Slider

Le module est conçu pour démontrer votre contenu de manière efficace. Il dispose de tout ce dont vous avez besoin pour présenter votre contenu et créer un curseur professionnel. Le module dispose de nombreux outils de personnalisation, qui rendent le curseur facile à ajuster.

Installation du module

Le module est installé/supprimé de la même manière que tout autre module PrestaShop.

Configuration du module

Une fois le module installé, vous pouvez le configurer sur la page de configuration du module.

Pour obtenir les données requises pour la configuration du module vous devez créer une application correspondante sur la ressource nécessaire.

Il n'est pas nécessaire d'utiliser les deux variantes de connexion (Google, Facebook) en même temps, vous pouvez utiliser l'un d'entre eux.

Champs Facebook

  • ID de votre App
  • Clé secrète de votre App

Champs Google

  • ID de votre App
  • Clé secrète de votre App
  • Chemin de redirection après la connexion (votre magasin URL+index.php?fc=module&module=tmsociallogin&controller=googlelogin)

Champs VK

  • ID de votre App
  • Clé secrète de votre App
  • Chemin de redirection après la connexion (votre magasin URL+index.php?fc=module&module=tmsociallogin&controller=vklogin)

Vous pouvez consulter ces liens pour plus d'informations: Facebook App, Google App et VK App.

Le chemin de redirection doit être identique, qui a été indiqué lors de la création Google App et VK App.



Flux sociaux TM

Ce module charge les réseaux sociaux sur votre site. Il permet aux visiteurs du site d'être au courant des dernières nouvelles et publications partagées sur les réseaux sociaux.

Installation et suppression

Le module est installé et supprimé de la même manière que tout autre module PrestaShop.

Configuration du module

Après l'installation, vous pouvez modifier ses paramètres sur la page de configuration du module.

Dans la forme supérieure, vous devez ajouter des paramètres globaux pour chaque réseau social. Les différents réseaux sociaux ont des différents paramètres.

Twitter

Il suffit d'ajouter une ID de widget qui peut être prise à partir de votre compte Twitter.

  • Ajouter le bloc à la position
    afficher le bloc en position spécifique.
  • Sélectionner le thème
    le schéma de couleurs du bloc pour cette position.
  • Ordre de tri
    l'ordre de tri (le numéro d'ordre du bloc dans cette position).
  • Largeur de Widget
    la largeur du bloc dans cette position.
  • Hauteur de Widget
    la Hauteur du bloc dans cette position.
  • RSS limite de widgets
    le nombre de flux dans le bloc.
  • Activer header
    afficher le titre du bloc.
  • Activer footer
    sfficher le pied de page du bloc.
  • Activer la bordure
    afficher la bordure du bloc.
  • Afficher les réponses
    sfficher les réponses aux messages.
  • Afficher le défilement
    afficher le défilement du bloc.
  • Afficher le fond
    ajouter le fond du bloc ou laissez-le transparent.

Facebook

Coller le chemin d'accès complet à la page Facebook. La page devrait être publique.

  • Ajouter le bloc à la position
    afficher le bloc en position spécifique.
  • Ordre de tri
    l'ordre de tri (le numéro d'ordre du bloc dans cette position).
  • Largeur de Widget
    la largeur du bloc dans cette position.
  • Hauteur de Widget
    la Hauteur du bloc dans cette position.
  • Petit en-tête
    utiliser le petit en-tête à ca place.
  • Masquer la couverture
    masquer la photo de couverture dans l'en-tête.
  • Montrer les visages
    afficher les photos des utilisateurs qui ont aimé la page.
  • Montrer les messages
    afficher les messages de la page.

Pinterest

Pour ce faire, collez le chemin d'accès complet vers la page .

  • Ajouter le bloc à la position
    afficher le bloc en position spécifique.
  • Ordre de tri
    l'ordre de tri (le numéro d'ordre du bloc dans cette position).
  • Largeur de Widget
    la largeur du bloc dans cette position.
  • Hauteur de Widget
    la Hauteur du bloc dans cette position.
  • Largeur de colonne
    la largeur de la colonne de bloc

Instagram

Paramètres des widgets sociaux

Type de sélection (Obtenir Flux Par): vous pouvez définir si les images sont chargées à partir d'utilisateurs spécifiques ou par tag.

Tag par lequel les images sont chargées.

Nom de l'utilisateur dont les images seront chargées.

Paramètres du widget Instagram

Dans la deuxième partie de la page de configuration du module, vous pouvez ajouter le module à la position souhaitée. Il y a 4 positions. Vous pouvez ajouter les paramètres de blocs à chaque position. Le seul paramètre global est la donnée des réseaux sociaux dont les flux seront chargés.

  • Ajouter le bloc à la position
    afficher le bloc en position spécifique.
  • RSS limite de widgets
    le nombre de flux dans le bloc.

Le module supporte les multi-magasins.