Sehr geehrte POWERGAP-Shopbetreiber,
mit diesem Update können Sie nun selbst erstellte Synonyme in allen CSS-Dateien und SVG-Dateien benutzen und somit z.B. Farbwerte zentral pflegen und nicht in x Klassen separat anpassen. Ein enormer Zeitvorteil während der Designarbeiten.
Hier angekommen wird einem direkt die Möglichkeit geboten ein neues Synonym anzulegen. Dazu tippt man eine Bezeichnung in das Feld "Synonyme" ein, wie z.B. "hauptfarbe1", "schriftart1", "eckenRadius" usw..
In das Feld "Ersetzung" kommt der Wert durch den das Synonym ersetzt werden soll, also z.B. ein Farbwert (#005566, rgba(255,230,20,.2) usw. ), die Shopschriftart ("Arial", "Roboto" , usw.), die Möglichkeiten sind recht vielfältig.
Das Dropdown "Typ" macht ist lediglich für die Vorschau gedacht.
Hat man das Synonym gespeichert wird einem direkt auffallen, dass vor und nach dem Synonym eine # hinzugefügt worden ist, möchte man das Synonym also in der CSS verwenden muss man z.B. "#hauptfarbe1#" benutzen.
In der Hauptübersicht sehen wir neben dem Synonym seinen Ersetzungswert, seinen Typ, eine Vorschau (je nach Typ) die Anzahl wie oft das Synonym verwendet wurde und haben zuletzt die Möglichkeit diese Zeile auch wieder zu löschen.
Nachdem das Synonym einmal verwendet worden ist, kann man es nicht mehr umbenennen oder löschen, lediglich sein Ersetzungswert lässt sich jederzeit ändern. Hiermit kann man bequem die Farben im Shop und andere öfter vorkommende Dinge ändern ohne lang danach suchen zu müssen.
Die häufigste Anwendung finden Synonyme sicher unter Layout > Schriften / CSS > *.
Dort ist nun rechts in jeder CSS-Datei eine Auflistung aller verfügbaren Synonyme zu sehen, samt deren Vorschau. Klickt man nun in die Textarea zum Bearbeiten der CSS, kann bequem mit einem Klick auf dem jeweiligen "Einsetzen-Button" das Synonym an die Stelle des Cursors in der Textarea einfügen.
Das automatische Einsetzen geht nur, wenn die CSS nicht gehighlightet ist. Sonst muss man das Synonym kopieren und mit STRG+V einfügen.
Hinweis: Ändert man ein Synonym muss man die CSS erst einmal neu speichern bevor die Änderung Wirkung zeigen kann.
Unter Sonstiges > IMG-Explorer kann mit einem Doppelklick SVG-Dateien öffnen und bearbeiten. Dabei wird die selbe Auflistung der Synonyme angezeigt, wie in der CSS. In SVG-Dateien kann man die Synonyme gut für Farbcodes des fill-Attributes verwenden und auch hier über die Synonyme schnell Farben in allen Icons etc. zu ändern.
Hinweis: Synonyme in SVG-Dateien werden direkt bei ihrer Änderung neu ersetzt. Somit wirken hier, anders als bei der CSS, die Änderungen sofort.
mit diesem Update können Sie nun selbst erstellte Synonyme in allen CSS-Dateien und SVG-Dateien benutzen und somit z.B. Farbwerte zentral pflegen und nicht in x Klassen separat anpassen. Ein enormer Zeitvorteil während der Designarbeiten.
Pflege
Die Pflegemaske für Synonyme befindet sich unter Layout > Synonyme oder wenn man mit STRG + Q in das Such-Feld vor der Icon-Leiste springt und "Synonym" eintippt.
Hier angekommen wird einem direkt die Möglichkeit geboten ein neues Synonym anzulegen. Dazu tippt man eine Bezeichnung in das Feld "Synonyme" ein, wie z.B. "hauptfarbe1", "schriftart1", "eckenRadius" usw..
In das Feld "Ersetzung" kommt der Wert durch den das Synonym ersetzt werden soll, also z.B. ein Farbwert (#005566, rgba(255,230,20,.2) usw. ), die Shopschriftart ("Arial", "Roboto" , usw.), die Möglichkeiten sind recht vielfältig.
Das Dropdown "Typ" macht ist lediglich für die Vorschau gedacht.
Hat man das Synonym gespeichert wird einem direkt auffallen, dass vor und nach dem Synonym eine # hinzugefügt worden ist, möchte man das Synonym also in der CSS verwenden muss man z.B. "#hauptfarbe1#" benutzen.
In der Hauptübersicht sehen wir neben dem Synonym seinen Ersetzungswert, seinen Typ, eine Vorschau (je nach Typ) die Anzahl wie oft das Synonym verwendet wurde und haben zuletzt die Möglichkeit diese Zeile auch wieder zu löschen.
Nachdem das Synonym einmal verwendet worden ist, kann man es nicht mehr umbenennen oder löschen, lediglich sein Ersetzungswert lässt sich jederzeit ändern. Hiermit kann man bequem die Farben im Shop und andere öfter vorkommende Dinge ändern ohne lang danach suchen zu müssen.
Anwendung
Layout > Schriften / CSS
Die häufigste Anwendung finden Synonyme sicher unter Layout > Schriften / CSS > *.
Dort ist nun rechts in jeder CSS-Datei eine Auflistung aller verfügbaren Synonyme zu sehen, samt deren Vorschau. Klickt man nun in die Textarea zum Bearbeiten der CSS, kann bequem mit einem Klick auf dem jeweiligen "Einsetzen-Button" das Synonym an die Stelle des Cursors in der Textarea einfügen.
Das automatische Einsetzen geht nur, wenn die CSS nicht gehighlightet ist. Sonst muss man das Synonym kopieren und mit STRG+V einfügen.
Hinweis: Ändert man ein Synonym muss man die CSS erst einmal neu speichern bevor die Änderung Wirkung zeigen kann.
Sonstiges > IMG-Explorer
Unter Sonstiges > IMG-Explorer kann mit einem Doppelklick SVG-Dateien öffnen und bearbeiten. Dabei wird die selbe Auflistung der Synonyme angezeigt, wie in der CSS. In SVG-Dateien kann man die Synonyme gut für Farbcodes des fill-Attributes verwenden und auch hier über die Synonyme schnell Farben in allen Icons etc. zu ändern.
Hinweis: Synonyme in SVG-Dateien werden direkt bei ihrer Änderung neu ersetzt. Somit wirken hier, anders als bei der CSS, die Änderungen sofort.