<div class="wide-menu hidden-small">
    <div class="fixed-menu">
        <div class="align-center">
            <a href="{{ cms_path('posts') }}">
                {{ include('DeblanBlogBundle:skin2018:_logo.html.twig') }}
            </a>
        </div>

        <nav class="navigation">
            <ul>
                <li>
                    <a href="{{ cms_path('posts') }}">
                        <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-abacus fixed">
                            <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-house') }}" />
                        </svg>

                        {{- 'Articles' -}}
                    </a>
                </li>
                <li>
                    <a href="{{ cms_path('categories') }}">
                        <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-book-3 fixed">
                            <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-book-3') }}" />
                        </svg>

                        {{- 'Catégories' -}}
                    </a>
                </li>

                <li>
                    <a href="{{ cms_path('search') }}">
                        <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-magnifier fixed">
                            <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-magnifier') }}" />
                        </svg>

                        {{- 'Rechercher' -}}
                    </a>
                </li>
                <li>
                    <a href="{{ cms_path('hosting') }}">
                        <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-atm-card fixed">
                            <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-atm-card') }}" />
                        </svg>

                        {{- 'Hébergement' -}}
                    </a>
                </li>
                <li>
                    <a href="{{ cms_path('projects') }}">
                        <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-clover fixed">
                            <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-clover') }}" />
                        </svg>

                        {{- 'Projets' -}}
                    </a>
                </li>
                <li>
                    <a href="{{ cms_path('shared_links') }}">
                        <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-clover fixed">
                            <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-circle-forward') }}" />
                        </svg>

                        {{- 'Liens partagés' -}}
                    </a>
                </li>
                <li>
                    <a href="{{ cms_path('contact') }}">
                        <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-mail">
                            <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-mail') }}" />
                        </svg>

                        {{- 'Contact' -}}
                    </a>
                </li>
            </ul>
        </nav>

        <ul class="links">
            <li class="link link-rss"><a target="_blank" title="RSS" href="{{ cms_path('rss') }}">RSS</a></li>
            <li class="link link-gitnet"><a target="_blank" title="Gitnet" href="https://gitnet.fr/deblan">Gitnet</a></li>
            <li class="link link-github"><a target="_blank" title="Github" href="https://github.com/simmstein/">Github</a></li>
            <li class="link link-linkedin"><a target="_blank" title="LinkedIn" href="https://www.linkedin.com/in/simon-vieille">LinkedIn</a></li>
            <li class="link link-diaspora"><a target="_blank" title="Diaspora" href="https://framasphere.org/people/cf7f5710e85d013117ae2a0000053625">Diaspora</a></li>
            <li class="link link-twitter"><a target="_blank" title="Twitter" href="https://twitter.com/SimonVieille">Twitter</a></li>
        </ul>
    </div>
</div>
<div class="small-menu hidden-large hidden-medium visible-small">
    <a href="{{ cms_path('posts') }}">
        <img src="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/logo-small.png') }}" class="fixed" alt="Deblan blog">
    </a>

    <nav class="navigation  push-right">
        <ul class="list--inline">
            <li>
                <a href="{{ cms_path('posts') }}">
                    <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-abacus fixed">
                        <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-house') }}" />
                    </svg>
                </a>
            </li>
            <li>
                <a href="{{ cms_path('categories') }}">
                    <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-book-3 fixed">
                        <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-book-3') }}" />
                    </svg>
                </a>
            </li>

            <li>
                <a href="{{ cms_path('search') }}">
                    <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-magnifier fixed">
                        <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-magnifier') }}" />
                    </svg>
                </a>
            </li>
            <li>
                <a href="{{ cms_path('hosting') }}">
                    <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-atm-card fixed">
                        <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-atm-card') }}" />
                    </svg>
                </a>
            </li>
            <li>
                <a href="{{ cms_path('projects') }}">
                    <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-clover fixed">
                        <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-clover') }}" />
                    </svg>
                </a>
            </li>
            <li>
                <a href="{{ cms_path('shared_links') }}">
                    <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-clover fixed">
                        <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-circle-forward') }}" />
                    </svg>
                </a>
            </li>
            <li>
                <a href="{{ cms_path('contact') }}">
                    <svg xmlns="http://www.w3.org/2000/svg" class="si-glyph-mail">
                        <use xlink:href="{{ asset('bundles/deblanblog/skin2018/frontoffice/img/sprite.svg#si-glyph-mail') }}" />
                    </svg>
                </a>
            </li>
        </ul>
    </nav>
</div>
Insérer
<div%key%id="gist-5c1ac3c43e2d2-78a483f58bfc4b35e6fbeb104fd53ac5a308d938" class="gist-container"></div>
<script src="https://gist.deblan.org/fr/embedjs/5c1ac3c43e2d2" async></script>