Web アプリケーションの普及に伴い、リッチ テキスト エディターを作成することがますます一般的になりました。 CKEditor は、優れたカスタマイズ性と使いやすさにより、最高のリッチ テキスト エディターの 1 つとして広く認識されています。この記事では、PHPとCKEditorを使ってリッチテキストエディタを作成する方法を紹介します。
CKEditor の概要
CKEditor は、JavaScript を通じて実装されたオープンソースのクロスプラットフォームのリッチ テキスト エディターです。フォント スタイル、書式設定、画像と表の挿入、リンク設定、スペル チェックなどを含む、直感的でわかりやすいツールバーを提供します。 CKEditor の主な機能には、カスタマイズ性、簡単な拡張性、ブラウザ間の互換性が含まれており、リッチ テキスト エディターを作成する場合に最適な選択肢の 1 つとなっています。
CKEditor を使用する前に
まず、Web サイトに PHP 環境があることを確認してください。そうでない場合は、Apache サーバー、PHP、および MySQL をインストールしてセットアップします。これらのソフトウェアをすでにお持ちの場合は、CKEditor の使用を開始できます。
ステップ 1: CKEditor をダウンロードする
まず、CKEditor の公式 Web サイト (http://ckeditor.com) から最新バージョンの CKEditor をダウンロードします。
ステップ 2: HTML ページを作成する
ファイル マネージャーでindex.html という名前のファイルを作成し、次のコンテンツをファイルに追加します:
< ! DOCTYPE html>
<title>使用PHP和CKEditor创建富文本编辑器</title> <script src="ckeditor/ckeditor.js"></script>
<textarea id="editor1" name="editor1"></textarea> <script> CKEDITOR.replace( 'editor1' ); </script>
行 1 は HTML ドキュメント タイプを宣言します。
行 2 は HTML ページのタイトルです。
3 行目では、CKEditor JavaScript ファイルが導入されています。
6 行目では、編集領域として使用される
ステップ 3: CKEditor ファイルをアップロードする
ダウンロードした CKEditor ファイルをサーバー上の Web ディレクトリに抽出します。 CKEditor ファイルは、index.html と同じディレクトリに保存することをお勧めします。
ステップ 4: リッチ テキスト エディターをテストします。
index.html ファイルをブラウザで開くと、CKEditor を備えたテキスト エディターが表示され、テキストと形式を自由に編集できます。
PHP を使用して CKEditor からデータを取得する
これで、CKEditor を使用してリッチ テキスト エディターが正常に作成されました。次のステップでは、PHP を使用して CKEditor からデータを取得する方法を確認します。以下の手順に従ってください:
ステップ 1: HTML ページを変更する
index.html に送信フォームを追加して、リッチ テキスト エディターで編集したコンテンツを PHP ファイルに送信します。変更された HTML ページは次のようになります。
<title>使用PHP和CKEditor创建富文本编辑器</title> <script src="ckeditor/ckeditor.js"></script>
< ;body>
<form action="submit.php" method="POST"> <textarea id="editor1" name="editor1"></textarea> <input type="submit" value="提交"> </form> <script> CKEDITOR.replace( 'editor1' ); </script>