I am trying to build a menu with icons for each element.

I am using (or trying to)

* MopaBootstrapBundle
* KnpMenuBundle
* FontAwesome

The menu structure is displaying and working fine, but the **icons are not showing. Can anyone put me on the right tracks here?**

Here's what I've done so far:

Setting up config.yml:

```
assetic:
    debug:          "%kernel.debug%"
    use_controller: false
    filters:
        cssrewrite: ~
        cssembed:
            jar: %kernel.root_dir%/Resources/java/cssembed.jar
            apply_to: "\.css$|\.less$"
        yui_css:
            jar: "%kernel.root_dir%/Resources/java/yuicompressor.jar"
        yui_js:
            jar: "%kernel.root_dir%/Resources/java/yuicompressor.jar"

[...]

mopa_bootstrap:
    form: ~  # Adds twig form theme  support
    menu: ~  # enables twig helpers for menu
    icons:
        icon_set: fontawesome4
        shortcut: icon

```

Including bootstrap styles in my `/app/Resources/MopaBootstrapBundle/views/layout.html.twig`

```
{%  block head_style %}
    {{  parent() }}
    {% stylesheets filter='less,cssrewrite,?yui_css'
    'bundles/mopabootstrap/less/mopabootstrapbundle-fa4.less'
    %}
    <link href="{{ asset_url }}" type="text/css" rel="stylesheet" />
    {% endstylesheets %}

{%  endblock head_style %}

```

Building my menu:

```
public function createMainMenu(FactoryInterface $factory, array $options)
    {
        $menu = $factory->createItem(
        'root', array(
            'navbar' => true,
            )
        );

        // Main Menu -> Config
        $menu->addChild('Item 1', array(
                'route' => 'home',
                'caret' => true,
                'icon' => 'fa-home',
            )
        );

        $dropdown = $menu->addChild('Item 2', array(
                'dropdown' => true,
                'caret' => true,
                'icon' => 'fa-archive',
            )
        );
        $dropdown->addChild('Sub-item 1', array('route' => 'si1'));
        $dropdown->addChild('Sub-item 2', array('route' => 'si2'));
        $dropdown->addChild('Sub-item 3', array('route' => 'si3'));

        return $menu;

    }

```

Looking at the page source, I found all classes to be set correctly. However, in the linked style sheets, I found this:

```
/* FONT PATH
 * -------------------------- */
@font-face {
  font-family: 'FontAwesome';
  src: url(../../bundles/mopabootstrap/fonts/fontawesome-webfont.eot?v=4.2.0);
  src: url(../../bundles/mopabootstrap/fonts/fontawesome-webfont.eot?#iefix&v=4.2.0) format('embedded-opentype'), url(../../bundles/mopabootstrap/fonts/fontawesome-webfont.woff?v=4.2.0) format('woff'), url(../../bundles/mopabootstrap/fonts/fontawesome-webfont.ttf?v=4.2.0) format('truetype'), url(../../bundles/mopabootstrap/fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular) format('svg');
  font-weight: normal;
  font-style: normal;
}

```

The path `../../bundles/mopabootstrap/fonts/` does not appear to exist in my setup, which would explain the missing icons. I cannot figure out, however, how I can modify it.

In the [documentation](https://github.com/phiamo/MopaBootstrapBundle/blob/master/Resources/doc/assetic-configuration.md), I found a reference to the `@icon-font-path` variable definition. I am at a bit of a loss as to where to define it and with which value.

NB: The font files do reside in my `web/fonts` folder. All this is happening on a Windows machine.

**UPDATE:**

I am finding the FontAwesome files in these locations:

* `<my_project_path>\web\bundles\mopabootstrap\fonts\fa4`
* `<my_project_path>\web\fonts`

Only the Glyphicon font files can be found in 

* `<my_project_path>\web\bundles\mopabootstrap\bootstrap\fonts`.

I also noticed that when I define `@icon-font-path: "../fonts/";` in `/src/<my_bundle>/Resources/public/less/mystyles.less` the path in the resulting CSS file is `src: url('../fonts/fontawesome-webfont.eot?v=4.2.0');`

However, when I load my app and call up the CCS file dumped by assetic, the path is `src: url(../../Resources/public/fonts/fontawesome-webfont.eot?v=4.2.0);`