Magento. Wie man mit den Material Design Icons arbeitet

Von diesem Tutorial erfahren Sie, wie man Änderungen an dem Material Design Icons-Block in Magento vornimmt.

Magento. Wie man mit den Material Design Icons arbeitet

1. Drücken Sie mit der rechten Maustaste aufs Element und nutzen Sie das Werkzeug ‘Element überprüfen’ (Inspect element), um die CSS Klasse des Icons, das Sie ersetzen möchten, zu finden. Kopieren Sie diese CSS Klasse:

   

2. Öffnen Sie die Datei, die die CSS Regel enthält (die Sie vorher überprüft haben), in den Dateien Ihrer Website auf dem Server oder auf Ihrem Computer, indem Sie dazu den Code-Editor nutzen. Finden Sie den Klassencode in dieser Datei (in unserem Fall ist es /skin/frontend/tm_themes/themeXXX/css/styles.css):

   

3. Öffnen Sie die Datei skin/frontend/tm_themes/theme_XXX/css/material-design.css und kopieren Sie den notwendigen Teil des Codes:

   

   Es ist dringend empfohlen, die Sicherungskopie dieser Datei zu erstellen, bevor Sie an ihr die Änderungen vornehmen.

4. Fügen Sie den Inhaltscode, den Sie aus der Datei skin/frontend/tm_themes/theme_XXX/css/material-design.css kopiert haben, in den Eigenschaftenwert “content” Ihrer CSS Regel ein:

   

5. Speichern Sie die Änderungen und aktualisieren Sie Ihre Website:

   

Sie können auch das ausführliche Video-Tutorial nutzen:

Magento. Wie man mit den Material Design Icons arbeitet