ホームページ >CMS チュートリアル >PHPCMS >PHPCMS にはどのエディタが使用されますか?
PHPCMS にはどのエディタが使用されますか?
- Guanhuiオリジナル
- 2020-06-19 17:34:022894ブラウズ
# PHPCMS はどのエディタを使用しますか?
PHPCMS は CKEditor エディタを使用します。CKEditor は新世代の FCKeditor であり、再開発されたバージョンです。このエディタは、その驚くべきパフォーマンスと優れたパフォーマンスにより、世界最高のオンライン Web テキスト エディタの 1 つです。スケーラビリティにより、主要な Web サイトで広く使用されています。
CKEditor の統合
CKEditor を Web ページに統合するにはいくつかの方法があります。ここでは、最も一般的に使用される実装方法を紹介します。 。
ステップ 1: CKEditor をロードする
CKEditor は JavaScript アプリケーションです。Web ページにファイル参照を含めるだけでロードできます。
Web サイトの「ckeditor」ディレクトリに CKEditor をインストールしている場合は、次の例を参照できます。
<head> ... <script type="text/javascript" src="/ckeditor/ckeditor.js"></script> </head>
上記の方法でロードすると、CKEditor JavaScript API の準備が整い、次の例を参照できます。利用される。 。
ステップ 2: エディター インスタンスを作成する
CKEditor は、Web ページのテキスト領域 (textarea) のように機能します。シンプルで書きやすいユーザー インターフェイスとレイアウトを提供します。テキスト入力エリア。ただし、テキスト領域で同じ効果を実現するのは簡単ではなく、ユーザーが HTML コードを入力する必要があります。
ただし、実際には、CKEditor は依然としてテキスト領域を使用してデータをサーバーに転送します。このテキスト領域はユーザーには見えません。したがって、インスタンスを作成して編集する必要があります。まずインスタンスを作成します:
<textarea id="editor1"></textarea>
データベースからデータを読み取るなど、エディターにデータをロードする場合は、データを配置するだけでよいことに注意してください。 in 上の例のように、テキストエリアのすぐ内側にあります。この例では、テキストエリアに「editor1」という名前を付けています。この名前は、POST 送信されたデータを受信する際のサーバー操作で使用されます。 CKEditor Javascript API の使用を開始するには、エディター インスタンスを使用して、この通常のテキスト領域 (textarea) を「置換」します。これを行うには、次の JavaScript コードを追加する必要があります:
<script type="text/javascript"> CKEDITOR.replace( 'editor1' ); </script>
上記のスクリプト ブロックのみが可能Web ページの 4750256ae76b6b9d804861d8f69e79d3 タグの後に含める必要があります。この置換プロセスを 93f0f5c25f18dab9d176bd4f6de5d30e タグ内で実行することもできますが、この場合、DOM がロードされていることを確認する必要があります。これは通常、window.onload イベントに書き込むことができます (DOM は次の時点でロードされている必要があります)。今回) ：
<script type="text/javascript">
window.onload = function()
{
CKEDITOR.replace( 'editor1' );
};
</script>ステップ 3: エディターのコンテンツ データを保存する
前述したように、エディターはテキスト領域 (textarea) のように動作するため、次の内容を含むエディター インスタンスを送信するとき、フォームのデータも、データを受け取るためのキーとしてテキストエリアの名前を使用して、非常に簡単に渡されます。たとえば、上記の例によれば、PHP では次のようにデータを処理する必要があります:
<?php $editor_data = $_POST[ 'editor1' ]; ?>
クライアント側のデータ処理一部のアプリケーション (Ajax アプリケーションなど) では、すべてのデータをクライアントで処理する必要があります。この場合、CKEditor API を使用するだけで、エディター インスタンス内のコンテンツを簡単に取得できます。例:
<script type="text/javascript"> var editor_data = CKEDITOR.instances.editor1.getData(); </script>
推奨チュートリアル: 「PHPCMS チュートリアル 」
以上がPHPCMS にはどのエディタが使用されますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。