magento 2: Ich möchte ein Bild in der Modulvorlagen-Phtml-Datei anzeigen

21

Ich möchte ein Bild in der Modulvorlagendatei anzeigen. Wenn jemand mein Modul installiert, kann er dieses Bild sehen. Kann ich meine Bilder in meinem Modulverzeichnis speichern oder nicht?

magento-2.0 phtml Ankush Chauhan
quelle
Ohoo Ankush Bhai Magento2
Amit Singh

Antworten:

33

Ja, Sie können Bilder abhängig vom Bereich Ihrer Vorlagen in Ihren Modul-Webverzeichnissen speichern. Der Pfad lautet: Vendor / Module / view / {frontend | adminhtml} / web / images /

Dann können Sie in Ihren * .phtml-Dateien das Bild anzeigen:

<img src="<?php echo $this->getViewFileUrl('Vendor_Module::images/image.png'); ?>" />
Miroslav Petroff
quelle
Wenn ich diese URL als Hilfsprogramm haben möchte, wie kann ich sie bekommen? oder in js datei?
Nitesh
In helper können Sie \Magento\Framework\View\Result\PageFactoryclass in Ihren Konstruktor einfügen $pageFactoryund dann $pageFactory->getViewFileUrl()method aufrufen . Bei js-Dateien habe ich keine Ahnung, wie man darauf kommt.
Miroslav Petroff
1

Ich mag es, meine PNGs mit Base-64 zu verschlüsseln und inline zu schreiben. Ich benutze https://www.base64-image.de .

        <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJ....=">
ChristianTL
quelle
0 
<script type="text/x-magento-init">
{
    <?php /* this defines the target of the widget */ ?>
    "#target_id": {
        <?php /* this defines the widget */ ?>
        "image.widget.name": {
            "imagename" : "<?php echo $this->getViewFileUrl('Vendor_Module::images/image.png'); ?>"
        }
    }
}

Sie würden das Widget-Initialisierungsskript von magento verwenden, um Ihr Javascript mit der definierten Option "imagename" zu starten. Diese Initialisierungstechnik wird normalerweise in PHP-Dateien durchgeführt. Mein Code geht davon aus, dass sich Ihr Bild in Vendor / Module / view / {frontend | adminhtml} / web / images / befindet.

Weitere Informationen finden Sie in der Magento 2-Dokumentation. http://devdocs.magento.com/guides/v2.1/javascript-dev-guide/javascript/js_init.html

Amad
quelle