Gelöst: Font-Awesome Icons verschwinden

Wie hast Du FA konfiguriert?
Und wie bindest Du sie ein? Mit Modul, mit Code oder im CSS?

Ich habe es als Modul.

Hast du denn die Bibliothek auch mittels Git heruntergeladen und die entsprechende Konfiguration vorgenommen?

Nee, ich lade die Fonts via CDN, werden ja auch dargestellt, verschwinden aber beim Editieren dann wieder...

Hi.

Wenn die Fonts auf der Webseite dargestellt wird aber beim Editieren nicht,
dann ich schätze mal das der Editor den du verwendest(IMCE,CKE???) einen anderen Font benutzt.
Hast Du mal nachgesehen ob das der Fall ist?

MfG

Robert

Ach das. Das liegt daran, dass die Icons im Admin-Theme nicht geladen werden. Du kannst entweder dein Frontend-Theme als Admin-Theme setzen und entsprechend ausbauen, oder die libraries, bzw den CDN-Part im Admin-Theme laden, damit CK-Editor die Icons anzeigt, dann geht das so, wie du es dir vorstellst.

Das Problem ist nicht unbedingt die Darstellung, sondern , das der Code dann weg ist, d.h. ich muss den nochmal neu engeben..

Verwendest Du den CKEdito und mit welchem Text-Format?
Irgendwas muss man in der Konfiguration ändern, damit das angezeigt wird.
Ich hatte das auch mal und musste was ändern, damit es funktioniert.
Ich bin dann aber wieder von dem Modul abegekommen und füge dann z.B. im Quelltext ein.

Ich habe folgende Einstellungen bei Font-Awesome:
Font-Awesome-Tag: i
Font-Awesome-Methode: Webfont mit CSS (weil ich teilweise bei Klassen mit :before oder :after FA-Icons einfüge)
Haken bei CSS-Pseudoelemente zulassen?
Haken bei Version 4 der Shim-Datei verwenden?
Keinen Haken bei Externe Datei (CDN) / lokale Datei verwenden?

Ich verwende CKEditor mit Volsltändigem HTML:
Bin nicht mehr sicher, ob ich da was ändern musste an den Einstellungen, glaube aber nicht.

Ja, CKE mit vollständigem HTML.

Haken bei CSS-Pseudoelemente zulassen? Nein.
Haken bei Version 4 der Shim-Datei verwenden? Ja.
Keinen Haken bei Externe Datei (CDN) / lokale Datei verwenden? Haken bei CDN.

Wenn ich z.B. einen Block aufrufe, dann ist kurz der Code zu sehen, dann ist alles leer!

Du verwendest Drupal 8?

Hast Du mal geschaut, ob der Code im Editor noch steht?
Also wenn Du auf Quelltext umstellst?
Oder wie sieht es aus, wenn Du den Quelltext im Frontend untesuchst?

Hast Du mal versucht, den Beispielcode mit dem Drupal-Icon in der Quelltext-Editieransicht des CKEditors einzufügen?
Also ohne Zuhilfenahme des Moduls?

Und kann man das im Frontend ansehen?
Wird da evt. mit CSS was ausgeblendet oder verdeckt?

Füg das mal zur Konfiguration deines Textformmates hinzu, dann sollte das auch im Backend funktionieren

Ich halte zwar seit dem inkrafttreten der DSGVO absolut nix mehr von jsdeliver. Aber ich bin ja keine Rechtsberatung :-D

@dinmikkith, Vielleicht solltest Du noch dazu schreiben, in welche Datei man das schreiben muss.
Bei mir war das nicht nötig, bzw. man kann das doch auch in der Konfiguration des TExt-Formats machen und das i-Tag als erlaubten HTML-Tag hinzu fügen?

Bei mir war das allerdings nicht nötig.
Habe extra noch mal in meiner Konfiguration nachgeschaut.
Zumindest nicht wenn ich das Icon im Quelltext hinzufüge.

Das mit der DSGVO sehe ich auch so.
Deswegen habe ich den Haken entfernt.

Ich habe im Ordner libraries die FA-Library hinterlegt.

Also ich gehe quasi immer bei CMSen in den Code-Editor. Wie geschrieben, bei Aufruf flackert der Code kurz auf, dann ist er weg. Bei Abspeichern ist dann ALLES weg. Also auch wirklich weg.

Nee, einen ICON dafür habe ich garnicht im Editor.

Also noch mal langsam Welche Version von Drupal verwendest du?

Die 8.7.6 habe ich.

Ich hab keine Installation auf Deutsch zur Hand, aber da ist eine Konfiguration "Limit allowed HTML tags" bei deinem HTML Format. Sieh nach, ob das <i> Tag da auftaucht. Das ist im Falle, daß Du das Basic HTML Format benutzt. Dann musst Du diesen Tag hinzufügen (einfach eingeben) und abspeichern. Siehe Abbildung.

Bei vollständigem HTML habe ich das nicht. Ich dachte, dass vollständiges HTML (full HMTL) alle Tags erlaubt?

Sorry, ich habe nicht gelesen, dass Du vollständigem HTML benutzt. Die Frage ist blöd (ist nur ein Versuch), aber du stellst es als Format auch beim eingeben ein, oder? Ich meine jetzt im Edit Form. Hast Du mit einem Node versucht, vielleicht hat das nur mit dem Block zu tun (das ist auch blöd, aber es ist ein Versuch Wert). Cache gelöscht?
Das Modul hat anscheinend Probleme mit Paragraphs. Benutzt du Paragraphs?
Ausserdem wird von Problemen bei CKEditor mit SVGs berichtet. Vielleicht hat es damit zu tun: https://www.drupal.org/project/fontawesome/issues/3037527

Gruß

Wenn ich es in einem Node eingebe, dann sehe ich auf der Seite korrekt. Klicke ich dann auf Editieren des Nodes ist es weg.
Was meinst Du mit Paragraphs?

Ich habe Webfonts mit CSS eingestellt.

Wiso will mich hier eigentlich keiner verstehen?

Du hast deine Font im Frontent-Theme deiner Seite eingebunden. Damit der CK-Editor das ganze anzeigt brauchst du zwei dinge:

1. Du musst Font-Awesome auch in deinem Backend-Theme einbinden
2. Wenn du unbedingt js-deliver verwenden willst, stattt Fontawesome im Verzeichnis Libraties abzulegen, so dass es von deinem eigenen Server geladen wird, dann musst du dem CK-Editor noch verklickern, dass er das externe script auch lädt, wenn er geladen wird und du ein entsprechendes Textformat auswählst.

Außerdem sollten im Textformat die notwendigen Tags für Font-Awesome zugelassen sein.

Dein eingegebener Code wird nur dann von CK-Editor geläsjct, wenn das ausgewählte Textformat die entsprechenden HTML-Tags nicht zulässt. Angezeigt werden kann das ganze im Backend nur dann, wenn CK-Editor die Dateien, die zur Anzeige von Font Awesome benötigt werden richtig laden kann. In sofern verstehe ich ehrlich geagt auch nicht, warum dieser Thread so lang ist. Lade dir doch einfach das Font Awesome modul runter und lese die Dokumentation zum Modul. Da steht nämlich drinnen, wies geht..

Und wie macht man das? seven.info and seven.libraries.yml Dateien editieren?
Ich frage, weil ich es auch verstehen möchte.

Ich rede vom Paragraphs Modul, es hat sich erledigt dann. Vielleicht wenn Du es versuchst wie dinmikkith vorschlägt:

So, es scheint nun zugehen.Ich hatte das Modul "Font Awesome Media Entity" nebst dem Modul "SVG image" garnicht aktiviert.
Bei dem Format Full HTML kann ich keine Tags mehr auswählen, ergo das passt. Geladen werden die Fonts via CDN von https://use.fontawesome.com/releases/v5.5.0/js/all.js. U.U. lade ich sie beizeiten noch runter und binde sie lokal ein. Das Modul hatte ich btw. die ganze Zeit, nur eben das zusätzliche nicht, bzw. nicht aktiviert.

Ich weiss jetzt nicht, was Du damit meinst FA noch im Backendtheme einzubiden, aber es scheint auf jeden Fall nun zu gehen.

Danke, an alle die, die mir Tipps gegeben haben!

Also doch SVG Schwierigkeiten.

Ich weiss nicht genau. Für das Modul "Font Awesome Media Entity" musste ich auch das SVG Modul installieren bzw. aktivieren. Ich hatte ursprünglich nur das eigentliche FA-Modul aktivert. Im Grunde Blödheit.