ホームページ  >  記事  >  CMS チュートリアル  >  PHPCMS にはどのエディタが使用されますか?

PHPCMS にはどのエディタが使用されますか?

Guanhui
Guanhuiオリジナル
2020-06-19 17:34:022848ブラウズ

PHPCMS にはどのエディタが使用されますか?

# 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( &#39;editor1&#39; );
</script>

上記のスクリプト ブロックのみが可能Web ページの 4750256ae76b6b9d804861d8f69e79d3 タグの後に含める必要があります。この置換プロセスを 93f0f5c25f18dab9d176bd4f6de5d30e タグ内で実行することもできますが、この場合、DOM がロードされていることを確認する必要があります。これは通常、window.onload イベントに書き込むことができます (DOM は次の時点でロードされている必要があります)。今回) :

<script type="text/javascript">
window.onload = function()
{
CKEDITOR.replace( &#39;editor1&#39; );
};
</script>

ステップ 3: エディターのコンテンツ データを保存する

前述したように、エディターはテキスト領域 (textarea) のように動作するため、次の内容を含むエディター インスタンスを送信するとき、フォームのデータも、データを受け取るためのキーとしてテキストエリアの名前を使用して、非常に簡単に渡されます。たとえば、上記の例によれば、PHP では次のようにデータを処理する必要があります:

<?php
$editor_data = $_POST[ &#39;editor1&#39; ];
?>

クライアント側のデータ処理一部のアプリケーション (Ajax アプリケーションなど) では、すべてのデータをクライアントで処理する必要があります。この場合、CKEditor API を使用するだけで、エディター インスタンス内のコンテンツを簡単に取得できます。例:

<script type="text/javascript">
var editor_data = CKEDITOR.instances.editor1.getData();
</script>

推奨チュートリアル: 「PHPCMS チュートリアル

以上がPHPCMS にはどのエディタが使用されますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。