User CSS
Die user.css ermöglicht ein personalisiertes Design des WebKatalogs.
Einrichtung
Die User CSS wird im 3D office Datenportal unter Profil → User CSS bearbeitet und gespeichert. Ein Farbwähler fügt Hex-Codes ein. Änderungen an CSS-Variablen werden erst nach einem Neuladen des WebKatalogs sichtbar.
Verwendung
Der WebKatalog lädt die user.css automatisch zum Token des Benutzers – ein URL-Parameter ist nicht nötig:
html
<link id="usercssserver" rel="stylesheet" href="{BASE}/api/ofml.dll/ofml/user.css?token={TOKEN}">Stabile Selektoren
Diese Selektoren werden bei Updates nicht umbenannt (automatisch geprüft). Andere Klassen können sich ändern.
| Bereich | Selektoren |
|---|---|
| 3D-Ansicht | #WebGLCanvas, #articleThreeView, .controls |
| Katalog | #catalogContainer, #catalogOpener, .catalogItem, .catalogItemName |
| Breadcrumbs | #breadcrumbs, .breadcrumb, .breadcrumb-item |
| Menü / Kopf | #menu, #currentManufacturer |
| Informationspanel | #informationOpener, #informationView, .information, .informationView, .informationButtons, .tabbutton |
| Merkmale | #propertyview, .properties, .property, .propclass, .propclass_header, .propertySelect, .propertySelectSelected, .previewimage, .groups-container |
| Preis / Text | #pricetextview, .text-section |
| Downloads | .download-accordion, .format-btn, .resolution-item, .action-card-btn |
| Zustände / Sonstiges | .selected, .expanded, .show, .toggle, .full-width, .section-header, .material-icons |
Weitere CSS-Klassen untersuchen
Tipp
Öffnen Sie den WebKatalog im Browser, drücken Sie F12 und nutzen Sie das Element-Auswahl-Werkzeug, um die gewünschten CSS-Klassen zu identifizieren.