Comment remplacer un fichier HTML à l'aide d'un module personnalisé?


20

Je développe un module personnalisé pour la méthode de paiement dans Magento 2. Actuellement, j'utilise cc-form.html à partir du répertoire du fournisseur et le module fonctionne correctement . Voir chemin ci-dessous:

fournisseur / magento / module-payment / view / frontend / web / template / payment / cc-form.html

Existe-t-il un moyen de remplacer le fichier HTML?

Remarque: je voudrais le remplacer à l'aide d'une extension personnalisée. Voir chemin ci-dessous:

app / code / Espace de noms / Module / view / frontend / web / template / payment / cc-form.html

Toute aide serait appréciée. Je vous remercie!


Quand avez-vous utilisé ce formulaire, veuillez afficher le lien ou la carte du site.
MrTo-Kane

Réponses:


34

Solution de travail.

Créez ou modifiez simplement le fichier requirejs-config.js à partir du chemin ci-dessous.

/app/code/Namespace/Module/view/frontend/requirejs-config.js

Et placez ci-dessous le code dans requirejs-config.js

var config = {
    map: {
        '*': {
          'Magento_Payment/template/payment/cc-form.html': 
              'Namespace_Module/template/payment/cc-form.html'
        }
  }
};

Nous pouvons donc remplacer n'importe quel fichier html de cette façon.


ne fonctionne pas pour le fichier html de modèle d'e-mail dans les ventes du module?
fudu

14

Vous pouvez simplement ajouter votre fichier cc-form.html dans votre module de paiement à thème.

<mage_dir>/app/design/frontend/{Package}/{themename}/Magento_Payment/web/template/payment/cc-form.html

Vous pouvez changer selon vos besoins à l'endroit ci-dessus.

Supprimez le dossier var de la racine et supprimez le pub/static/frontenddossier.

Vous devez avoir exécuté la commande php bin/magento setup:static-content:deploy

Videz le cache de votre navigateur et vérifiez.


Je sais que cela fonctionnera bien si je place cc-form.html sous mon thème. mais je crée une extension donc je ne peux pas la placer sous le thème. je dois avoir à mettre ce fichier dans le répertoire du module.
Makwana Ketan

1
Merci rakesh. j'ai trouvé la solution sur stackoverflow.com/questions/37430036/…
Makwana Ketan

9

La solution acceptée est juste, mais je copie ici la réponse complète @AntonGuz du "Stack Overflow" (très bien expliqué):

Oui il y a. Vous pouvez regarder dans un pub statique pour voir comment le chemin vers un actif statique a été construit.

Comment ça fonctionne

Chaque élément est accessible depuis la page par celui-cienter code here "ID RequireJS". Il ressemble au vrai chemin, mais varié.

Par exemple, fichier http://magento.vg/static/adminhtml/Magento/backend/en_US/Magento_Theme/favicon.ico .

Son vrai chemin est /app/code/Magento/Theme/view/adminhtml/web/favicon.ico. Son ID RequireJS est Magento_Theme/favicon.ico. Cela signifie que le fichier peut être accessible viarequire("text!Magento_Theme/favicon.ico") une commande similaire.

Vous pouvez trouver que l' ID RequireJS se compose du nom du module et d'une partie utile du chemin (après le dossier web).

Comment remplacer un fichier

Vous avez donc un fichier
vendor/magento/module-payment/view/frontend/web/template/payment/cc-form.html

Sur la page chargée avec src as
http://magento.vg/static/frontend/Magento/luma/en_US/Magento_Payment/template/payment/cc-form.html

Son ID RequireJS est donc
Magento_Payment/template/payment/cc-form.html

Note latérale: l'intérieur des composants de l'interface utilisateur est égal à Magento_Payment/payment/cc-form . Les mots "modèle" et ".html" sont ajoutés automatiquement.

Et maintenant, vous pouvez remplacer ce fichier pour une application via la configuration RequireJS

var config = {
  "map": {
    "*": {
      "Magento_Payment/template/payment/cc-form.html": 
          "<OwnBrand>_<OwnModule>/template/payment/cc-form.html"
    }
  }
};

Cet extrait de code que vous placez dans un requirejs-config.jsfichier dans votre module. C'est tout.

Peut-être que cela aidera quelqu'un à comprendre à mesure qu'il se produit.


Comment ajouter et modifier le fichier JS pour ce html
jibin george

4

Je ne sais pas depuis quelle version de Magento2 il est requis mais si vous voulez remplacer le modèle du module Magento_Ui, vous devez fournir un chemin comme celui-ci:

var config = {
    map: {
        "*": {
            'ui/template/form/element/select.html':'Vendor_Module/templates/form/element/select.html'
        }
    }
};

Parce que dans ce fichier:

fournisseur / magento / module-ui / view / base / requirejs-config.js

Il existe un mappage de chemin:

/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

var config = {
    paths: {
        'ui/template': 'Magento_Ui/templates'
    },
    map: {
        '*': {
            uiElement:      'Magento_Ui/js/lib/core/element/element',
            uiCollection:   'Magento_Ui/js/lib/core/collection',
            uiComponent:    'Magento_Ui/js/lib/core/collection',
            uiClass:        'Magento_Ui/js/lib/core/class',
            uiEvents:       'Magento_Ui/js/lib/core/events',
            uiRegistry:     'Magento_Ui/js/lib/registry/registry',
            consoleLogger:  'Magento_Ui/js/lib/logger/console-logger',
            uiLayout:       'Magento_Ui/js/core/renderer/layout',
            buttonAdapter:  'Magento_Ui/js/form/button-adapter'
        }
    }
};
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.