Neu Glyphicons einbinden

Carinjay

Aktives Mitglied
29. Mai 2017
4
0
Hallo,
gibt es eine Möglichkeit, die Glyphicons von Bootstrap in eine Box oder eigene Seite einzubinden? Damit diese mit den jeweiligen Symbolen auf der Startseite erscheinen.
Wie geht das bzw was muss ich dabei beachten?
 

FMoche

Moderator
Mitarbeiter
15. Dezember 2014
693
68
Halle (Saale)
Du musst dafür nur die themes/base/less/bootstrap/glyphicons.less in deine Basis-Less-Datei einbinden und neu kompilieren.
Eventuell findest du die entsprechenden Icons aber auch bereits in FontAwesome? Das würde out-of-the-Box funktionieren.
 

Carinjay

Aktives Mitglied
29. Mai 2017
4
0
Der Editor löscht leider den entsprechenden Befehl
z.B. <a href="#"><span class="glyphicon glyphicon-star"></span> Star</a>
Wie kann ich das dennoch einbinden oder geht es im JTL Shop4 für die Startseite bzw. eigene Seiten über den Editor im Adminbereich nicht?
 

martinwolf

Offizieller Servicepartner
SPBanner
6. September 2012
3.159
191
Du musst ein Leerzeichen in Form von &nbsp; in den Span eintragen. Tags ohne jeglichen Inhalt, dazu zählen auch Leerzeichen, werden vom Editor nach dem Speichern oder dem Wechsel der Ansicht gelöscht.
 

Carinjay

Aktives Mitglied
29. Mai 2017
4
0
Vielen Dank! Die Icons werden jetzt angezeigt. Wenn diese Allerdings alleine in einer Zelle stehen werden Sie durch das Leerzeichen nicht richtig zentriert. Durch das Weglassen des Leerzeichens erscheint dann zwar das Zeichen, aber der Code erscheint nichtmehr im Editor und macht dann das spätere bearbeiten schwer. Gibt es eine Möglichkeit das richtig zu zentrieren ohne immer wiederholt das Icon beim bearbeiten hinzuzufügen?
 

mediaDESIGN.SK

Mitglied
7. Januar 2019
8
1
Gera (Thüringen)
Dieses Verhalten liegt am CKEditor, ist absolut nervig und weder für professionelles noch kundenseitiges Arbeiten geeignet!!!
Habe das ebenfalls ausprobiert mit dem Versuch awesome-Icons einzufügen. Wenn ich im Editor Quellcode-Modus z.B. <span class="fa fa-building-o"></span> einfüge wird das zwar gespeichert, aber beim nächsten Öffnen dieser Content-Box wird der Code bereinigt. Der komplette span-Tag wird entsorgt. Das passiert auch dann, wenn in dem span-Tag z.B. ein &nbsp; oder ein Leerzeichen eingeschlossen wird. Speichern geht, aber Speichern-Öffnen ist leer. Wenn man dann natürlich speichert, ist's dann auch im Frontend verschwunden. Das ist so frustrierend.
Das bekommt man einem Kunden als Profi nicht erklärt, dass er nicht mal kleine Texte in Boxen ändern darf, ohne dass Vorlage dabei zerschossen werden, und auch ich habe nicht Lust bei jeder kleinen Änderung wieder alle Awesome-Icons nachpflegen zu müssen.

Lieben JTL-Shop-Team! Das müsst Ihr ändern!
Ich hatte das in einem anderen Beitrag hier schon mal gepostet, dass der CKEditor unnutzbar ist. Wenn der einen so bescheidet, und ich anderen Möglichkeiten nicht habe, da wäre es besser statt eines Editors einfach nur ein textarea-Element anzubieten. Damit kann man wenigstens bleibende Ergebnisse liefern und hat die Kontrolle über den Code.

Es ist auch nicht nachvollziehbar, warum sauberer Code wie o.g. span-Bsp. entsorgt wird. Das ist Standard awesome-Icons so einzubinden, geht in jedem CMS!
Ich arbeite viel mit Joomla. Dort wird wird TinyMCE, Code-Mirror oder der selbstinstallierbar JCE als Editor eingebunden. Jeder von diesen ist besser als der CKEditor und sogar nach Belieben konfigurierbar.

Bitte! Tut da was!

Nachtrag: Ich habe als Workaround jetzt in den Span-Tags eine Punkt übergeben. Damit wenigstens meine Icons kommen (s. www.warm-rein-hell.de). Ich hoffe, das "guckt sich weg". Nun warte ich auf eine JTL-Lösung des Problems.
 

FMoche

Moderator
Mitarbeiter
15. Dezember 2014
693
68
Halle (Saale)
Versucht doch bitte einmal, die Zeilen
Code:
$.each(CKEDITOR.dtd.$removeEmpty, function (i, value) {
    CKEDITOR.dtd.$removeEmpty[i] = false;
});
nach
Code:
CKEDITOR.editorConfig(CKEDITOR.config);
in die Datei admin/templates/bootstrap/tpl_inc/footer.tpl einzufügen.
 

Anhänge

mediaDESIGN.SK

Mitglied
7. Januar 2019
8
1
Gera (Thüringen)
WOW, super! Eben mal so eingefügt, und es funktioniert!
Danke! Schnell geantwortet, prompte Lösung!

Sehe im Script, dass man hier auch gleich das Problem mit den leeren Absätzen <p>&nbsp;</p>, die leider auch immer entsorgt werden, lösen kann.
Code:
$.each(CKEDITOR.dtd.$removeEmpty, function (i, value) {
    CKEDITOR.dtd.ignoreEmptyParagraph[i] = true;
});