Heim > Artikel > Backend-Entwicklung > Online-Editor Ckeditor (1) - PHP (30)
Online-Editor
Der Online-Editor wird auch WYSIWYG-Editor genannt und ist ein gängiger HTML-Quellcode-Editor.
Was Sie sehen, ist, was Sie bekommen: Bei der Benutzereingabe können sowohl Format als auch Stil vom System intakt gespeichert werden. Bei der Anzeige kann die Ausgabe schließlich auf der ursprünglichen Struktureingabe des Benutzers basieren.
Online-Editor-Kategorie
Es gibt viele gängige Online-Editoren auf dem Markt, FCKeditor (Online-Editor Ajax-Browser-Server-Dateimanager, kostenlos), Ckeditor (Content und Wissen, der Online-Editor ist vom serverseitigen Dateimanager getrennt, der Online-Editor ist kostenlos, der serverseitige Dateimanager ist kostenpflichtig (CKfinder)), Baidus Ueditor, Kindeditor
Online-Bearbeitung Die Funktion von der Editor
Der Online-Editor ist das, was Sie sehen, ist das, was Sie bekommen.
Funktion
Ckeditor&Ckfinder
Ckeditor hat eine lange Geschichte und wird häufig in Webprojekten im In- und Ausland eingesetzt.
Grundsätzlich sind alle Online-Editoren gleich, bis auf die Anzahl der Plug-Ins (Funktionen)
Warum Ckeditor verwenden?
Ckeditor-Installation
Entpacken Sie den erhaltenen Ckeditor und legen Sie ihn zur Verwendung am entsprechenden Projektspeicherort ab.
Basic: Basic, mit weniger Funktionen
Standard: Standard, mit allen gängigen Funktionen
vollständig: vollständig, mit allen Funktionen
Download:
2 In das angegebene Verzeichnis entpacken
3 Entpacken Sie den Ckeditor Datei Clip es an den Speicherort des Projekts, das Sie verwenden möchten
Ckeditor-Verzeichnisstruktur
Ckeditor verwenden
Derzeit können Sie die Datei bearbeiten Formularelement des HTML-Quellcodes: textarea
Daher basiert die Verwendung des Online-Editors auf dem Textarea-Element
1, das die Ckeditor-JS-Datei lädt. /ckeditor/ckeditor.js
2 Es muss ein Textarea-Element in der Schnittstelle vorhanden sein.
3 Ersetzen Sie textarea durch den entsprechenden Ckeditor-Editor
a) Der einfachste Weg: Fügen Sie dem Textarea-Tag ein Klassenattribut mit dem Wert Ckeditor hinzu
Das Textarea-Element muss eines der ID- oder Namensattribute haben
b) Standardmethode: Verwenden Sie die von Ckeditor bereitgestellte Klasse CKEDITOR und deren Ersetzungsmethode replace
myck1 kann der Wert von id oder der Wert von name attribute sein
c) Erweiterte Möglichkeit: Verwenden Sie jQuery zum Ersetzen von Textbereichen
Zum ersten Laden jQuery.js
Laden Sie die von CKEDITOR bereitgestellte Schnittstellendatei jquery.js für jQuery. /ckeditor/adapters/jquery.js
JQuery-Syntax verwenden, um das Textarea-Element zu ersetzen
Konfigurieren (anpassen) Ckeditor
Ckeditor bietet drei Konfigurationsmethoden
Konfigurationsdatei ändern
Wirkung
Funktionen: Alle Ckeditoren im Projekt werden von config.js betroffen sein.
2 Passen Sie die Konfigurationsdatei an. Das Format stimmt mit der Systemkonfigurationsdatei config.js überein.
Erstellen Sie eine neue Benutzerkonfigurationsdatei. Das Format der Konfigurationsdatei stimmt vollständig mit der Konfiguration überein. js-Format
Konfigurationsoptionen ändern
Laden Sie die angepasste Konfigurationsdatei in die Ckeditor-Instanz, die die angepasste Konfigurationsdatei verwenden muss Konfigurationsdatei.
Hinweis:
Wenn Sie Ckeditor mit der Basisversion laden, gibt es keine Möglichkeit, benutzerdefinierte Konfigurationsdateien zu verwenden
Es können nur die Standardversion und die JQuery-Version verwendet werden
Funktionen: Nur Ckeditor-Instanzen, die mit benutzerdefinierten Konfigurationsdateien geladen sind, sind betroffen, andere sind nicht betroffen. (Diese Methode wird häufiger verwendet)
Das Obige hat den Online-Editor Ckeditor (1) - PHP (30) vorgestellt, einschließlich der relevanten Inhalte. Ich hoffe, dass er Freunden, die sich für PHP-Tutorials interessieren, hilfreich sein wird.