Personalizzazione del javaScript di navigazione principale (topmenu) di Magento 2


8

Ho trascorso una fiera a scavare nel modulo del tema e nei modelli vuoti cercando di apportare modifiche alla navigazione principale di Magento2. Finora ho creato un modulo personalizzato per controllare il contenuto reso nella pagina (Aggiunta di collegamenti a subnav) ma non riesco a capire dove sia il menu di navigazione javaScript.

Riesco a vedere un file navigation.menu.js nel modello vuoto e un menu.js nel modulo tema, ma nessuno di questi sembra essere per il menu principale e non riesco a trovare altri posti in cui cercare JS.

Poiché il blocco è generato da XML e la navigazione sembra funzionare sull'interfaccia utente di jQuery, non ho molto da usare per la ricerca. Fino ad ora ho principalmente modificato un modello personalizzato creato sul modello di base cercando nella directory del fornitore ma sto andando in bianco.

Sto eseguendo Magento 2.1 con un modello personalizzato basato sul modello di base, Se qualcuno potesse indicarmi la giusta direzione sarebbe di grande aiuto.

Edit1:

Quindi dopo ulteriori ricerche su google e test ho finalmente trovato un secondo file menu.js in lib / web / mage che sembra essere il posto giusto, tuttavia ora non sono in grado di sovrascriverlo.

Con le mie nuove informazioni mi sono davvero imbattuto nei documenti di sviluppo di Magento2, che ha un esempio sulla sostituzione del menu e dei menu di amministrazione. Quindi ho aggiunto quanto segue al mio modulo

Namespace / modulo / immagine / frontend / require-config.js

var config = {
    map: {
        '*': {
            'menu': 'Test_Topmenu/js/navigation-menu'
        }
    }
};

Spazio dei nomi / modulo / view / frontend / web / js / navigazione-menu.js

define([
    'jquery',
    'jquery/ui',
    'mage/menu'
], function ($) {
    "use strict";
    $.widget('Test_Topmenu.navigationMenu', $.mage.menu, {
        _init: function () {
            console.log('new init');
        }
    });
    return $.Test_Topmenu.navigationMenu;
});

Ora guardando nel file vendor / magento / module-theme / view / frontend / templates / html / topmenu.phtml posso vedere che hanno usato un data-mage-init del widget menu. A quanto ho capito, questo dovrebbe usare la versione modificata del file, tuttavia non sembra funzionare. Ho aggiunto un registro della console all'init predefinito e ho provato numerose connotazioni di casi e spazi dei nomi per assicurarmi di non averli impostati in modo errato (ho visto molti esempi ma le persone tendono a usare o meno in altri posti) , ma non riesco a far chiamare il nuovo init.

Ho anche svuotato la directory pub / static / frontend e ridistribuito dopo ogni modifica per assicurarmi che solo le versioni corrette potessero essere chiamate.

Risposte:


1

Se vuoi sovrascrivere il menu di navigazione.js devi aggiungerlo al tuo tema:

app/design/frontend/{yourVendorName}/{yourThemeName}/web/js/navigation-menu.js

Successivamente è necessario eseguire:

php bin/magento setup:static-content:deploy

e svuota la cache, per essere sicuro.

Spero che questo possa essere d'aiuto!

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.