current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Magento Stack Exchange is a question and answer site for users of the Magento e-Commerce platform. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top
up vote 2 down vote favorite

I'm using webicon script in my theme to use svg/png as icons. This is the code from my jQuery widget:

_create: function () {
    $(document).webicons({
        icons: {
            tile: 'http://magento2.dev:8888/project/pub/static/frontend/vendor/theme/en_US/images/tile.png',
            user: '../images/user.png'
        }
    });
}

If I hardcode the whole path the image displays correctly, second one doesn't display. I've tried other approaches that also wont display. Is there a way to do this directly in JS? I know I could load the path with data-mage-init in PHP and pass it in with config options, but I'd like to know if anyone found a way to do this directly in JS?

share|improve this question
up vote 3 down vote accepted

This is not a solution, but it is an explanation on why you SHOULD use the data-mage-init approach.
You kind of HAVE TO provide the calculated image paths via a template or something because of the theme fallback mechanism.
Also, if you provide the full path to something in the pub/static folder your widget will crash if the static resources are not deployed.
You need something that generates the image in pub/static before using it. passing it as a parameter from a template will ensure that.

share|improve this answer
    
Thanks Marius, it did do the trick, i passed the the url to static folder with: data-mage-init='{"stickyFooter": {"baseUrl": "<?php echo $block->getViewFileUrl('images'); ?>"}}' and prepended the url to '/user.png' in JS. Worked like a charm. – belfort1 10 hours ago
    
you should use <?php echo $block->getViewFileUrl('images/user.png'); ?> directly instead of appending user.png at the end because of the same fallback mechanism. The way you built it, if you change the theme and you have an images folder in your theme but not a user.png file, magento will not find the image and it will not fall back to the default theme/module – Marius♦ 10 hours ago

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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