Ajouter une image statique sur la page PHTML et les blocs CMS: Magento2

Comment puis-je ajouter une image statique sur une page PHTML et des blocs CMS dans Magento2? dans Magento 1.x, il était possible d'utiliser$this->getSkinUrl('images/xyz.jpg')

J'essaie de suivre la méthode dans Magento2

En fichier Phtml:

<img src=”<?php echo $this->getViewFileUrl(‘images/footer-logo.png’); ?>” alt=”Demo”>

Dans les blocs CMS:

<img src=”{{view url=”images/slide-bg.jpg”}}” alt=”” />

mais cela ne fonctionne pas correctement. S'il vous plaît me suggérer mes erreurs

La syntaxe d'url de l'image est correcte pour les deux static blocket phtml, mais assurez-vous que lorsque vous écrivez ce code dans un bloc statique

<img src="{{view url="images/slide-bg.jpg"}}" alt="test" />

sur le devant on dirait

http: //localhost/magento2new/pub/static/frontend/Magento/luma/en_US/images/slide-bg.jpg

Où Magento/lumaest packagenom et themenom, vous pouvez remplacer par votre packageet themenom

Donc, vous devez prendre soin de slide-bg.jpgson existe dans

pub/static/frontend/Magento/luma/en_US/images annuaire.

Dans ton cas,

<img src='<?php echo $this->getViewFileUrl('images/footer-logo.png'); ?>' alt="Demo">

La syntaxe semble correcte, mais en front-end

http: //localhost/magento2new/pub/static/frontend/Magento/luma/en_US/images/footer-logo.png

Donc, vous devez vous assurer que cela footer-logo.pngexiste dans

pub/static/frontend/Magento/luma/en_US/images annuaire.

Et n'oublie pas "[quotation marks]

Pour votre module personnalisé, créez une structure de répertoires comme

Company/Module/view/frontend/web/images/image-icon.png

et en phtml utiliser le code suivant

<img src='<?php echo $this->getViewFileUrl('Company_Module::images/image-icon.png'); ?>' alt="image-icon" width="30" height="25">

Solution facile:

1. Mettez votre image sur votre chemin Magento 2:

   /app/design/frontend/< Vendor >/< theme >/web/images

2. Utilisez ce code pour appeler l'image dans le fichier phtml:

   echo $block->getViewFileUrl('images/demo.jpg'); 

Si vous souhaitez également que les choses restent un peu mieux organisées, vous pouvez ajouter des images pour vos modules de base remplacés dans votre thème personnalisé. Par exemple, j'ai besoin d'une image pour le formulaire de newsletter. J'ai ajouté une image dans

app/design/frontend/<Vendor>/<theme>/Magento_Newsletter/web/images/envelope.png

et dans mon app/design/frontend/<Vendor>/<theme>/Magento_Newsletter/templates/subscribe.phtmlfichier je l'ai utilisé comme ci-dessous pour obtenir la source de l'image

$this->getViewFileUrl('Magento_Newsletter::images/envelope.png');

J'utilise Magento v2.2

Une autre façon de faire consiste à utiliser une image en ligne:

<?php
// get contents of a file into a string
$filename = "path/to/image.jpg";
$handle = fopen($filename, "r");
$contents = fread($handle, filesize($filename));
$imagedata = base64_encode($content);
fclose($handle);
?>

<img src="data:image/jpeg;base64, <?= $imagedata; ?>" alt="alt text" />

$imageUrl = $this->helper('Magento\Catalog\Helper\Image')
                        ->init($mainProduct, 'product_base_image')
                        ->constrainOnly(TRUE)
                        ->keepAspectRatio(TRUE)
                        ->keepTransparency(TRUE)
                        ->keepFrame(FALSE)
                        ->resize(281, 281)->getUrl();