Einkaufswagen logo

Hey,

du musst als erstes in deinem Theme unter DEINTHEMENAME/src/Ressources/app/storefront/dist/assets/ den ordner „icon“ anlegen. Innerhalb des ordner „icon“ legst du dann einen Ordner mit dem Namen deines Icon-Packs an. Also zB.: DEINTHEMENAME/src/Ressources/app/storefront/dist/assets/icon/myIconPack

Dort kommen dann deine SVG-Dateien hinein. Du kannst dir quasi jedes x-beliebige SVG icon dort abspeichern.

Dann musst du noch in deinem Theme unter DEINTHEMENAME/src/Ressources/views/storefront falls noch nicht vorhanden, den ordner „utilities“ erstellen und dort drinnen die Datei „icon.html.twig“ mit folgendem Inhalt:

{% sw_extends '@Storefront/storefront/utilities/icon.html.twig' %}
{% block utilities_icon %}
    {% set styles = [size, color, rotation, flip, class] %}
    {% if pack is not defined %}
        {% set pack = 'default' %}
    {% endif %}
{% if namespace is not defined %}
    {% set namespace = 'Storefront' %}
{% endif %}
   <span
 class="icon icon-{{ name }}{% for entry in styles %}{% if entry != "" %} icon-{{ entry }}{% endif %}{% endfor %}">
 {% if pack == 'myIconPack' %}
 {{ source('@DEINTHEMENAME/../app/storefront/dist/assets/icon/myIconPack/'~ name ~'.svg', ignore_missing = false) }}
{% else %}
 {{ source('@' ~ namespace ~ '/../app/storefront/dist/assets/icon/'~ pack ~'/'~ name ~'.svg', ignore_missing = true) }}
 {% endif %}
 </span>
{% endblock %}

Damit „registrierst“ du dein Icon-Pack.
Um jetzt irgendwo in deinen Templates ein Icon aus deinem eigenen Icon-Pack benutzen zu können, musst du folgendes schreiben (Beispielicon heißt „myHome.svg“)
{% sw_icon 'myHome' style {'pack' : 'myIconSet'} %}

myIconSet und DEINTHEMENAME musst du natürlich auf deine Bezeichnungen und dein Theme umändern.

Wie man ein Icon überschreiben kann, so dass das Standardicon wie zB vom Einkaufswagen überschrieben wird, kann ich dir leider nicht sagen. Je nachdem wo es überall vorkommt, könntest du den Icon-Aufruf in deinem Theme an der Stelle überschreiben.

Lg Alex

1 „Gefällt mir“