magento 2: Je veux afficher une image dans le fichier phtml du modèle de module

21

Je souhaite afficher une image dans le fichier de modèle de module. Quand quelqu'un installe mon module, il peut voir cette image. Puis-je stocker mes images dans le répertoire de mon module ou non?

magento-2.0 phtml

— Ankush Chauhan
source

Ohoo ankush bhai magento2

— Amit Singh

33

Oui, vous pouvez stocker des images dans les répertoires Web de votre module en fonction de la zone de vos modèles. Le chemin est: Vendor / Module / view / {frontend | adminhtml} / web / images /

Ensuite, dans vos fichiers * .phtml, vous pouvez afficher l'image:

<img src="<?php echo $this->getViewFileUrl('Vendor_Module::images/image.png'); ?>" />

— Miroslav Petroff
source

Si je veux cette URL en aide, comment puis-je l'obtenir? ou dans le fichier js?

— Nitesh

Dans helper, vous pouvez injecter la \Magento\Framework\View\Result\PageFactoryclasse dans votre constructeur as $pageFactorypuis appeler la $pageFactory->getViewFileUrl()méthode. Pour les fichiers js, je n'ai aucune idée de comment les obtenir.

— Miroslav Petroff

1

J'aime coder en base 64 mes PNG et les aligner. J'utilise https://www.base64-image.de .

        <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJ....=">

— ChristianTL
source

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'); ?>"
        }
    }
}

Vous utiliseriez le script d'initialisation du widget de magento pour démarrer votre javascript avec l'option "imagename" définie. Cette technique d'initialisation est généralement effectuée dans des fichiers phtml. Mon code suppose que votre image est dans Vendor / Module / view / {frontend | adminhtml} / web / images /

Pour plus d'informations, vous pouvez voir la documentation de magento 2. http://devdocs.magento.com/guides/v2.1/javascript-dev-guide/javascript/js_init.html

— Amad
source