Ich habe eine Subdomain eingerichtet und ich habe einen Fehler, den ich einfach nicht verstehe. Sobald man die Subdomain aufruft fehlen im Menü und in der Fotoslideshow die Pfeilköpfe. Im Quellcode steht hier nur ein “::before”, im Firefox ist and er Stelle nur ein “Fehlerzeichen” zu sehen, also ein kleines Quadrat mit vier Buchstaben “FI 07” oder so ähnlich. Safari funktioniert hingegen, aber Firefox ist bei unserem SHop der Hauptbrowser. Wenn ich im Shop auf das Logo klicke und die Startseite somit einmal ohen Subdomain neu lade, werden die Zeichen angezeigt. Es betrifft nur den Aufurf als Subdomain. Kann mir jemand helfen wie ich diesen Fehler korrigieren kann?
VG & vielen Dank!
Moin 
ja, dies passiert meist beim Build Prozess der CSS-Datei also wenn man diese minified von z.B. auf styles.css auf styles.min.css.
Du könntest die CSS Anweisungen auslagern in eigene CSS-Datei und gesondert referenzieren, damit das Problem nicht mehr auftritt.
Update: Bei Dir könnte noch zusätzlich hinzukommen, dass die Subdomain ggfs. auf die Hauptdomain verweist. Dies solltest unterbinden und auch das CSS über die Subdomain einbinden, wenn die Subdomain aufgerufen wird.
Viele Grüße
Tim
diese Zeichen sind im Font Awesome enthalten.
Öffne mal die styles.min.css und suche nach FontAwesome →
der Font wird unter der angegebenen src:url(…) nicht gefunden
Ich habe mir eine Google Font gedownloaded und ausgetauscht. Dazu habe ich aus der base.tpl den Google-Webfont-Code gelöscht und in der CSS lade ich die Schriftart nun vom eigenen Server als ttf-Datei. Die weitere CSS ist dafür angepasst worden. Aber das Problem bleibt wenn man den Shop über die Subdomain aufruft. Auch bei anderen Schriftarten werden diese Schriftzeichen nicht angezeigt.
Es muss eine globale Einstellung der Zeichencodierung sein die erst aktiviert wird, wenn die “echte” Shop-URL angeklickt wurde, nicht aber die Subdomain. Oje … ??
Dies kann ich nicht nachvollziehen. Es handelt sich dabei um Icons und nicht Schriftarten meines wissens. Der Fehler wird verursacht, weil die Icons in der CSS-Datei durch ein minified Prozess fehlerhaft kompiliert wurden sind, dies hat mir in meinem Fall mit meiner Webseite geholfen.
Bei mir war das Problem das ich über die Technik Webpack die minified Variante der CSS-Datei eingebunden habe und diese nachträglich beim Deployment kompiliert wurde. Nachdem ich die original CSS-Datei hinterlegt hatte und diese kompiliert wurde ist der Fehler behoben.
Die Wechselwirkung kommt aus meiner Sicht zu Stande, indem der Browser versucht diesen Fehler auszugleichen.
Update: Aber könntest Recht haben, dass man zusätzlich noch sicherstellen muss, dass die Font Family für die Icons korrekt gesetzt ist.
Mein Unterschied war in theme.min.css stand:
.ci-home:before {
content: ""
}
und in theme.css steht:
.ci-home:before {
content: "\e946";
}
@webchallenge stimmt ein weiterer Unterschied zwischen meinen beiden CSS Dateien theme.min.css und theme.css ist, dass in der Datei theme.css zu Beginn noch
@charset "UTF-8";
vermerkt ist.
Danke für die Infos, ich versuche es zu verstehen. Ich finde keine theme.css in meinem Paket und in der normalen CSS keinen Eintrag für “ci-home:before” ?? Ich habe nur eine style.min.css Ich würde es ja gerne mal testen was passiert wenn man das Charset anpasst. (CE 6.4, liegt es an der CE das ich die theme.css nicht habe?)
Update: Es werden auch das Blog- und Youtube-Icon unten zu beginn nicht angezeigt, der Rest schon.
Das liegt daran, dass dies sich auf mein Custom Theme unter bisweb.me bezieht und daher gibt es die theme.css bei Dir nicht.
In Standard Themes für OXID eShop gibt es die styles.min.css. Das ist korrekt z.B. im Flow Theme flow_theme/styles.min.css at master · OXID-eSales/flow_theme · GitHub
Dann könntest am Kopf der Datei styles.min.css die Zeile @charset "UTF-8"; ergänzen und testen.
das war es leider nicht … 
schon doof das einiges fgeladen wird und anderes nicht …
Hast Du auch geprüft ob die Zeichenkette der UTF-8 Code korrekt in Deiner styles.min.css hinterlegt ist?
Ggfs. wurde die CSS in der falschen Zeichenkodierung auf Deinen Server geladen.
Für das Blog Icon sollte dort
.fa-wordpress:before {
content: "\f19a";
}
stehen.
Ja, die CSS ist in UTF-8 codiert und Charset ist auch in der ersten Zeile korrekt gesetzt. Den Eintrag für das Blog-Icon konnte ich auch wie von Dir angegeben finden.
Mittlerweile sehe ich das wesentlich mehr Icons davon betroffen sind, auch der Warenkorb und die Icons daneben werden bei der Subdomain am Anfang nicht richtig geladen.
Dann wäre noch interessant ob in der meta Angabe im HTML Head auch UTF-8 gesetzt ist
Des Weiteren solltest noch sicherstellen, dass in Deiner Subdomain auch die CSS-Datei über die Subdomain und nicht Hauptdomain eingeladen wird.
Ein weiterer Punkt welcher mir noch einfällt, es sollte auch sichergestellt sein, dass die CSS-Datei mit HTTPS eingebunden wird.
schau dir mal den Quellcode deines Shops an: Dort wird die styles.min.css mit Domain und komplettem Pfad eingebunden.
In der styles.min.css wird aber FontAwesome relativ zur index.php des Shops - also zur Subdomain - aufgerufen. Dort gibt es aber die Bibliothek FontAwesome nicht!
Abhilfe quick and dirty: in der styles.min.css FontAwesome absolute verlinken
1 Like
danke … ich habe soeben mit dem Provider gesprochen und er hat mir zu Plan B geraten. Die Hauptdomain direkt in den Source-Ordner lenken. Das bringt zwar bisschen mehr arbeit mit sich da viele andere Verzeichnisse mitwandern müssen um erreichbar zu sein, aber dann habe ich keine Subdomain und auch ansonsten saubere kurze Links ohne …/source/…
1 Like
Normalerweise lässt sich auch für die Subdomain das Document-Root auf das /source/ Verzeichnis setzen.
ja, aber wenn ich die Hauptdomain verwenden kann ist das besser.
1 Like