Share
Dans ce didacticiel, nous allons explorer le concept de mise en page dans OpenCart. Nous commencerons par explorer les principales dispositions disponibles dans OpenCart et, au fur et à mesure, nous verrons comment vous pouvez créer de nouvelles dispositions. De plus, nous verrons l’association de mises en page avec des produits, des catégories et des modules.
Je suppose que vous utilisez la dernière version d'OpenCart 2.0. Bien entendu, les mises en page sont également disponibles dans les versions précédentes d'OpenCart, mais nous nous en tiendrons à la dernière version car l'interface n'est pas exactement la même que celle des versions OpenCart 1.x..
Les "mises en page" dans OpenCart sont le concept d’organisation et de fourniture de modèles pour différents types de pages dans le frontal. Qu'est-ce que cela signifie quand vous dites un "type" de page différent? Si vous jetez un coup d'œil aux différentes pages d'OpenCart, vous remarquerez que la "structure" de la mise en page n'est pas la même dans toutes les pages. Par exemple, la présentation de la page "liste de produits" n'est pas la même que celle de la page "détails du produit"..
En outre, la structure varie dans les différentes pages, telles que "Pages de compte", "Page de contact", "Page de paiement", etc. C'est donc ici qu'intervient la mise en page. Vous pouvez dire que les mises en page sont les modèles de décorateur qui préparent la page complète en remplissant les emplacements et les modules disponibles pour cette mise en page particulière..
D'autre part, les dispositions sont également utiles dans OpenCart pour affecter différents modules à la page. Par exemple, si vous souhaitez afficher un module "Bannière" sur la page de détail du produit, vous pouvez le faire depuis le back-end car la disposition de détail "produit" est déjà disponible dans le noyau. OpenCart vous permet également de créer de nouvelles mises en page à partir du back-end, de manière à pouvoir remplacer les mises en page par défaut affectées aux différentes pages du front-end..
Regardons les mises en page intégrées disponibles dans OpenCart. Rendez-vous sur le back-end d'OpenCart. Dans la navigation, allez à Système> Conception> Mises en page, qui listera les mises en page de base.
Comme vous pouvez le constater, il existe toute une liste de dispositions existantes. Clique sur le modifier icône de la Accueil mise en page, comme indiqué dans la capture d'écran ci-dessus, pour configurer les paramètres liés à la mise en page.
Voyons ce que chaque section de la configuration représente exactement.
C'est juste le nom de la mise en page. Il devrait être réglé sur quelque chose de raisonnable, car cela nous aidera plus tard au cours de l'assignation du module..
La chose importante ici est la valeur de la colonne "Route", qui suggère à OpenCart que chaque fois qu’une URL contenant "common / home" sur la page d’accueil doit activer ce paramètre lié à la mise en page. Cela signifie qu’il activera tous les modules assignés à cette mise en page lors de la demande de page d’accueil dans le front-end.
Dans cette section, vous pouvez voir que les modules sont déjà configurés pour s'afficher sur la page d'accueil. Trois modules sont affectés à la position "Contenu supérieur", bien que vous puissiez ajouter d'autres modules pour les afficher à des positions différentes sur la page d'accueil. Par exemple, vous pouvez ajouter un module "Bannière" à la position "Contenu inférieur"..
De la même manière, vous pouvez également configurer les paramètres pour les autres présentations. OpenCart fournit une interface très pratique pour assigner des modules à différentes positions de la mise en page.
Dans les deux prochaines sections, nous verrons comment vous pouvez créer une nouvelle présentation et utiliser cette présentation pour remplacer les présentations principales d'OpenCart..
Dirigez-vous vers le Système> Conception> Mises en page page. Clique sur le + signe pour ajouter la nouvelle mise en page. Entrez les informations requises comme indiqué dans la capture d'écran suivante et enregistrez-les..
Nous avons entré "Mise en page du produit personnalisé" comme nom de la mise en page. Nous avons également affecté le module "Bannière> Catégorie" à la position "Colonne droite". Cela signifie que chaque fois que notre mise en page est activée pour toute demande au début, elle affichera le module "Bannière" dans la barre latérale droite..
Il existe deux manières d'activer la présentation pour toute demande frontale. Nous avons déjà discuté du premier, l’affectation "Route" dans les paramètres de configuration de la présentation. L'autre est l'option "Remplacer" disponible pour certaines pages du front-end. Nous allons procéder à la deuxième option pour le cours de ce tutoriel.
Maintenant que nous avons créé la mise en page personnalisée, voyons comment utiliser la fonctionnalité de substitution de la mise en page dans OpenCart. Je vais utiliser l'exemple des produits par défaut disponibles dans OpenCart pour faciliter les choses.
Aller à Catalogue> Produits, qui listera tous les produits disponibles dans le magasin. Éditons le produit "iMac" dans la catégorie "Ordinateurs de bureau> Mac".
Dans l'interface d'édition du produit, accédez à la Conception onglet, où vous devriez voir le Remplacement de mise en page option pour le magasin par défaut. Sélectionner CustomLayout dans la liste déroulante et enregistrez le produit.
Vous venez de remplacer la présentation par défaut du produit "iMac" par notre présentation "CustomLayout"! Cela signifie que chaque fois que quelqu'un visite la page de détail du produit "iMac" dans l'interface principale, "CustomLayout" est activé pour cette page. Et comme nous en avons discuté dans la section précédente, le module "Bannière" sera affiché dans la position "Colonne droite". Testons-le au début!
De la même manière, vous pouvez également remplacer les présentations pour les catégories!
J'espère donc que vous devriez avoir une compréhension de base du fonctionnement des mises en page dans OpenCart. Les mises en page sont vraiment utiles pour remplacer les mises en page par défaut et affecter des modules à différentes positions dans OpenCart. Partagez vos pensées sous forme de commentaires et de requêtes en utilisant le flux ci-dessous!
Accentsconagua