Share
Magento est depuis longtemps la référence parmi les cadres de commerce électronique disponibles sur le marché. Le mérite en revient à la pléthore de fonctionnalités intégrées riches qui l'accompagnent et à l'extension du cadre de base lui-même pour développer des extensions sur mesure..
Dans ce didacticiel, vous allez apprendre le concept des widgets dans Magento et comment les utiliser. Je vais vous montrer comment créer un widget personnalisé, ce qui est un moyen très puissant de brancher des fonctionnalités supplémentaires dans Magento..
En tant que développeur ou administrateur de site Magento, vous connaissez probablement la structure de présentation frontale de Magento. Presque tous les éléments de contenu affichés dans le frontal de Magento sont générés par des "blocs de contenu". Les blocs Magento sont un moyen très puissant de structurer le contenu frontal et vous permettent de les gérer avec des fichiers XML..
D'autre part, les widgets sont de petits avantages qui permettent aux administrateurs de site d'activer de nouvelles fonctionnalités frontales à l'aide d'un ensemble prédéfini d'options de configuration. Nous pouvons dire que les widgets sont plus conviviaux pour les administrateurs que les blocs, car ils n'ont pas à gérer les codes de fonction de bloc pour insérer les blocs. Pour insérer un widget dans la page, il vous suffit de sélectionner le widget dans la liste déroulante des widgets et de sélectionner les options de configuration, le cas échéant..
Essayons de comprendre cela à travers un exemple simple. Dans les pages d'information de votre site, vous souhaitez afficher les liens "Imprimer" et "Nous contacter". Le lien "Imprimer" permet aux utilisateurs d'imprimer la page sélectionnée et le lien "Contactez-nous" leur permet d'envoyer un message d'interrogation au service d'assistance. Pour ce faire, nous pouvons simplement développer un widget Magento qui permet aux administrateurs de site d'insérer ce widget dans la page statique sélectionnée du site..
Donc, sans perdre plus de temps, allons de l'avant et voyons exactement ce qu'il faut pour développer un widget personnalisé! Et oui, je vais m'en tenir à l'exemple mentionné ci-dessus.
Nous allons développer un widget personnalisé qui permettra à l'administrateur du site d'insérer les liens "Imprimer" et "Nous contacter" dans les pages du système de gestion de contenu. Nous fournirons également la configuration du widget pour les liens afin que l’administrateur puisse sélectionner les liens qu’elle souhaite afficher dans la page du CMS..
Je suppose que vous connaissez la structure des modules de Magento. Voyons d'abord la structure de fichier que nous devrons implémenter pour notre widget personnalisé.
Accentsconagua
app / etc / modules / Envato_All.xml: C'est un fichier utilisé pour activer notre module de widgets.app / code / local / Envato / WidgetLinks / etc / config.xml: C'est un fichier de configuration de module.app / code / local / Envato / WidgetLinks / etc / widget.xml: C'est un fichier de déclaration de widget utilisé pour déclarer des informations et des paramètres de widget.app / code / local / Envato / WidgetLinks / Model / Options.php: C'est un fichier de modèle qui fournit les options pour la configuration.app / code / local / Envato / WidgetLinks / Helper / Data.php: C'est un fichier qui est juste là selon les normes.app / code / local / Envato / WidgetLinks / Block / Links.php: La logique d'affichage du widget va ici.Conformément aux conventions de Magento, nous devons d’abord créer le fichier activateur de module. Créer app / etc / modules / Envato_All.xml et collez le contenu suivant dans ce fichier. Nous avons utilisé "Envato" comme espace de noms de module et "WidgetLinks" comme nom de module. Cela activera notre module "WidgetLinks" par défaut.
vrai local
A partir de maintenant, nous allons créer les fichiers requis sous app / code / local / Envato / WidgetLinks, qui est notre chemin de module de widget. Créer app / code / local / Envato / WidgetLinks / etc / config.xml et collez le contenu suivant dans ce fichier. Comme vous pouvez le constater, nous venons de déclarer les noms de classe de modèle, d'assistance et de bloc conformément aux conventions XML du module Magento..
0.0.1 Envato_WidgetLinks_Helper Envato_WidgetLinks_Block Envato_WidgetLinks_Model
Maintenant pour les choses intéressantes: créons le app / code / local / Envato / WidgetLinks / etc / widget.xml déposer et coller le contenu suivant dedans.
Options d'impression et de consultation Permet d'ajouter des options de lien d'impression et de requête 1 1 sélection multiple widgets / options
Comprenons ce fichier avec un peu de détail. Tout d'abord, nous déclarons notre widget en l'enveloppant à l'aide de l'identifiant unique widgetlinks_links. Ensuite, le type attribut est utilisé pour mapper le nom du fichier de widget-dans notre cas, il sera app / code / local / Envato / WidgetLinks / Block / Links.php. le Traduire et module les attributs sont explicites.
De plus, comme nous voulons fournir la configuration de notre widget, nous avons déclaré cela en utilisant le app / code / local / Envato / WidgetLinks / Model / Options.php, d'où nous aurons nos options pour la liste déroulante.
Ensuite, créons le fichier de modèle app / code / local / Envato / WidgetLinks / Model / Options.php.
'print', 'label' => 'Print Button'), tableau ('value' => 'email', 'label' => 'Bouton de demande de courrier électronique'),); Cela nécessite-t-il une explication? Il est simplement utilisé pour renvoyer les options de notre liste déroulante de configuration.!
Pour aller plus loin, créer le app / code / local / Envato / WidgetLinks / Block / Links.php fichier et insérez le code suivant dans ce fichier.
getData ('link_options'); if (empty ($ link_options)) return $ html; $ arr_options = explode (',', $ link_options); if (is_array ($ arr_options) && count ($ arr_options)) foreach ($ arr_options en tant qu'option $) Commutateur ($ option) case 'print': $ html. = 'Impression'; Pause; case 'email': $ html. = 'Contactez nous'; Pause; return $ html; C'est le fichier qui fera le vrai travail d'afficher les liens de widgets dans le front-end. Tout d'abord, nous récupérons la valeur de la variable de configuration link_options en utilisant l'extrait de code suivant.
$ link_options = $ this-> getData ('link_options');
Ce ne sont que les options sélectionnées par l'administrateur du site lors de la configuration du widget dans la page du CMS. Le reste du code est assez facile à comprendre, car nous venons de préparer le html sortie selon les options configurées.
Enfin, nous devrons créer le app / code / local / Envato / WidgetLinks / Helper / Data.php fichier juste pour s’assurer que le système de traduction de Magento fonctionne correctement. C'est presque un fichier vierge, mais ça devrait être là! Alors créons-le.
Merci pour la patience, nous l'avons presque fait! Dans la section suivante, nous verrons comment utiliser notre widget personnalisé dans les pages CMS du back-end..
Branchez le widget à l'aide de l'interface utilisateur d'administration
Désactivez maintenant toutes les caches de l’arrière de Magento et assurez-vous que notre module est activé. Après cela, allez à CMS> Pages et ajouter une nouvelle page CMS en utilisant Ajouter une nouvelle page. Remplissez les informations nécessaires selon vos besoins et pendant que vous êtes dans la Contenu onglet, il y a une icône dans l'éditeur WYSIWYG comme indiqué ci-dessous.
Cliquez sur cette icône, ce qui ouvrira le Insertion de widget interface comme indiqué dans la capture d'écran suivante.
dans le Type de widget champ, sélectionnez notre widget personnalisé Options d'impression et de consultation. Lorsque vous sélectionnez cela, il devrait afficher l'option de configuration Options de lien. Sélectionnez les options que vous souhaitez et cliquez sur le bouton Insérer un widget bouton pour insérer notre widget dans la page CMS. Voici à quoi cela ressemble après son insertion dans la page du CMS.
Enregistrez maintenant la page du CMS après avoir rempli toutes les informations requises et rendez-vous au début pour voir à quoi elle ressemble!
Comme vous pouvez le constater, deux liens sont affichés sur la page du système de gestion de contenu de Magento: Impression et Contactez nous. Il s’agissait donc d’un exemple très simple de compréhension du concept de widgets, et j’espère que vous pourrez l’étendre à quelque chose de plus utile dans votre cas, selon vos besoins..
Conclusion
Les widgets dans Magento permettent d'enrichir les fonctionnalités frontales spécifiquement destinées aux administrateurs back-end non techniques du site. En dehors de cela, Magento vous permet de créer des widgets personnalisés selon vos propres besoins, ce qui est également très facile à configurer..
J'espère donc que ce tutoriel vous a aidé à comprendre le concept de widgets et le développement de widgets personnalisés! Dans l'attente de vos commentaires dans le flux ci-dessous!
