How I can Add a static image on PHTML page and CMS Blocks into Magento2? in Magento 1.x it was possible using $this->getSkinUrl('images/xyz.jpg')

I am trying following method into Magento2

In Phtml File:

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

In CMS Blocks:

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

but it's not working properly. Please suggest me my mistakes

  • Your try seems good. You need to flush your cache from backend as well as remove the cache file manually from /var/cache Dec 14, 2015 at 10:12

7 Answers 7


image url Syntax is ok for both static block and phtml, But make sure that when you write this code in static block

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

on front-end it looks like


Where Magento/luma is package name and theme name, you can replace with your package and theme name

So you have to take care for slide-bg.jpg is exist in

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

In your case,

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

Syntax seems ok, but in front-end It looks like


So you have to make sure that footer-logo.png exist in

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

And don't forgot about "[quotation marks]

  • view for pub/static/frontend/Namespace/theme/locale store for site url Nov 22, 2016 at 10:35

For your custom module create a directory structure like


and in phtml use following code

<img src='<?php echo $this->getViewFileUrl('Company_Module::images/image-icon.png'); ?>' alt="image-icon" width="30" height="25">
  • thx, saved me a lot of time for searching :D
    – ZFNerd
    Jun 5, 2018 at 10:54
  • @ZFNerd Most Welcome
    – Manish
    Jul 31, 2018 at 6:20

Easy solution:

  1. Put your image on Your Magento 2 Path:

    /app/design/frontend/< Vendor >/< theme >/web/images
  2. Use this code to call the image in phtml file:

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

If you would also like to keep things a little more organised you can add images for your overridden core modules under your custom theme. For example, I need an image for the newsletter form. I added an image in


and in my app/design/frontend/<Vendor>/<theme>/Magento_Newsletter/templates/subscribe.phtml file I used it like below to get the image source


I use Magento v2.2


Another way to do this is using an inline image:

// 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);

<img src="data:image/jpeg;base64, <?= $imagedata; ?>" alt="alt text" />
$imageUrl = $this->helper('Magento\Catalog\Helper\Image')
                        ->init($mainProduct, 'product_base_image')
                        ->resize(281, 281)->getUrl();

Use Module image : $block->getViewFileUrl('Vendor_Module::images/test.jpg');

Use Theme image : $block->getViewFileUrl('images/test.jpg');

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.