Yii2: Docs: how to deal with images via asset manager

[samdark]

Need to write about how to serve images via asset manager.

[cebe]

What kind of images? For user generated content it may not be useful because asset folder content is temporary.

[samdark]

I mean, for example, I have CSS with relative image background: url(something.jpg) inside.

[zelenin]

Images must be in same sourcePath as a css

public $sourcePath = '@common/assets/plugin';
public $css = [ 'css/site.css' ];

Images path '@common/assets/plugin/images';

same situation as in yii2-bootstrap with fonts.
Is it should written to docs?

[samdark]

Yes.

[samdark]

Also it should be mentioned how to create a bundle w/o any CSS/JS inside.

[p0larbeer]

in my project

namespace app\assets;

use yii\web\AssetBundle;
use yii\web\View;


class HighslideAsset extends AssetBundle
{

    public $sourcePath = '@app/common/js/highslide-4.1.13/highslide';
    public $jsOptions = [
        'position' => View::POS_HEAD
    ];
    public $css = [
        'highslide.css',
    ];
    public $js = [
        'highslide-full.packed.js'
        //'highslide.min.js'
    ];

} 

namespace app\assets;

use yii\web\AssetBundle;

/**
 * @author Qiang Xue <[email protected]>
 * @since 2.0
 */
class AppAsset extends AssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $css = [
        'css/site.css',
    ];
    public $js = [
    ];
    public $depends = [
        ...
        'app\assets\HighslideAsset',
    ];
}

[mikehaertl]

This should also include other CSS assets like fonts. E.g. I try to build my custom bootstrap version from the original bootstrap less files. It fails to include the fonts when publishing the asset. I'm not sure what is the best way to achieve this.

[zelenin]

@mikehaertl $sourcePath must include css and fonts folders. Or don't I understand your question?

[mikehaertl]

@zelenin Yes, thanks. I just figured it out. But it would be nice to include this in the manual. The asset manager will publish the complete content of the $sourcePath directory.

[mitalcoi]

in my project:
layouts/main.php

$bundle = AppAsset::register($this);
<link rel="shortcut icon" type="image/ico" href="<?= $bundle->baseUrl . '/favicon.ico' ?>"/>

[DenisOgr]

Hmm. How it works?
I have widget with images:
WidgetBundle:

<?php
class WidgetAssets extends \yii\web\AssetBundle
{
    public $sourcePath = '@static'; // static/dict/[css|js|img]
    public $baseUrl    = '@web';
} 
?>

I use

$bundle = WidgetAssets::register($this);
echo var_dump($bundle->baseUrl . 'img/foobar.jpg');

it view: img/foobar.jpg
I can not see my image in app/web/img. I have not this dir, but I can see my image in web/assets/f48dfy/img/foobar.jpg

How can I set my $bundle->baseUrl use web/assets/{f48dfy} ?

[gta4kv]

Well actually I guess it still needs some documentation, cause there is no information for situation described before.

I have assets folder that located outside web folder, and I have images there. Therefore, all images are located at some path like this: /assets/{something}/img/*

How can I retrieve this path?

[saitavr]

How do I know the path for a published image to be used in a css file as background?

[SilverFire]

In case css and background are located in the same asset, you can use relative paths.

[maz0717]

What if there is no CSS? How do I know the path in order to pass it to the javascript library?

[maz0717]

For anyone looking to get the asset path from a view:

// Assign a variable when you register the asset.
$asset = SampleAsset::register($this);

// Then the baseUrl is available via
$baseUrl = $asset->baseUrl;