PHTMLページとCMSブロックに静止画像を追加します：Magento2

PHTMLページおよびCMSブロックに静的画像をMagento2に追加するにはどうすればよいですか？Magento 1.xでは、それを使用して可能でした$this->getSkinUrl('images/xyz.jpg')

私はMagento2に次の方法を試しています

Phtmlファイル内：

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

CMSブロック内：

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

しかし、それは適切に機能していません。私の間違いを教えてください

image url構文はとの両方で問題static blockありphtmlませんが、このコードを静的ブロックで記述するときは必ず確認してください

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

フロントエンドでは次のようになります

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

どこにMagento/lumaあるpackage名前とtheme名前、あなたはあなたに置き換えることができますpackageし、theme名前

だからあなたは世話をする必要 slide-bg.jpgがあります

pub/static/frontend/Magento/luma/en_US/images ディレクトリ。

あなたの場合、

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

構文は問題ないようですが、フロントエンドでは次のようになります

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

だから、それがfooter-logo.png存在することを確認する必要があります

pub/static/frontend/Magento/luma/en_US/images ディレクトリ。

忘れないで "[quotation marks]

カスタムモジュールの場合、次のようなディレクトリ構造を作成します

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

そして、phtmlでは次のコードを使用します

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

簡単な解決策：

1. Magento 2のパスに画像を配置します。

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

2. このコードを使用して、phtmlファイル内の画像を呼び出します。

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

物事をもう少し整理したい場合は、カスタムテーマの下にオーバーライドされたコアモジュールの画像を追加できます。たとえば、ニュースレターフォームの画像が必要です。に画像を追加しました

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

私のapp/design/frontend/<Vendor>/<theme>/Magento_Newsletter/templates/subscribe.phtmlファイルでは、画像ソースを取得するために以下のように使用しました

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

Magento v2.2を使用しています

これを行う別の方法は、インライン画像を使用することです：

<?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();