ページにリッチテキストを追加

!注このトピックでは、以前にContent Editorで構築されたコンポーネントの設定方法を説明します。代わりにコンポーネントでプロトタイプされたコンポーネントについて知りたい場合は、コンポーネント ドキュメントをご覧ください。

リッチテキストコンポーネントを使うことで、ウェブページ上にテキストの追加、インライン編集、フォーマットが簡単にできます。リッチテキストコンポーネントは最初にコンテンツエディターで作成され、ページビルダーの左側ペインの コンポーネント タブで利用可能です。リッチテキストコンポーネントは、ライブウェブサイトに表示されるテキストや表を表示します。

!警告リッチテキストエディタのフィールドにJavaScriptのスニペットを追加しないでください。そうすると「 Sorry, You're been blocked」 エラーが発生し、悪意あるスクリプトの実行を妨げる可能性があります。代わりに、フロントエンドアプリケーションにJavaScript要素を追加してください。

これはGoogleタグマネージャーのスクリプトには当てはまりません。これらはリッチテキストフィールドに安全に追加すれば正しく機能します。

ページにリッチテキストコンポーネントを追加するには:

1. ページビルダーエディターモードで、左側のペインの サイトツリー タブで、コンポーネントを追加したいページをクリックします。
2. コンポーネントタブで下にスクロールしてリッチテキストコンポーネントのアイコンを探してください。
3. アイコンをクリックして、ページのキャンバス上のプレースホルダーにドラッグします。
4. ページに追加したいテキストを入力したり、 コンポーネントに表 や メディアファイル を追加したりします。

CKEditorツールバーを使えば、リッチテキストコンポーネントの内容に以下のオプションを適用できます:

アイコン

レーベル

概要

太字

選択したテキストを太字にしてください。

斜体

選択したテキストは斜体で表記してください。

:mdiFormat下線:

下線

選択したテキストに下線を引いてください。

消線

選択したテキストを消してください。

ブロック引用

ブロック引用やプルクォートを含めましょう。

上標

選択したテキストを(x)に変換します。

添字

選択したテキストを(x)に変換します。

フォントの色

フォントの色を変える。カラーピッカーも含まれている。

フォントの背景色

フォントの背景色を変えます。カラーピッカーも含まれています。

見出し

あらかじめ定義された段落スタイルを選択して、コンテンツにカスタムスタイリングとセマンティックな値を適用します。

テキストの整合性

左に揃え、右に揃え、中央に揃え、または両端合わせ。

箇条書きリスト

箇条書きリストを追加してください。

:mdiFormatList番号付き:

番号付きリスト

番号付きリストを追加してください。

> [!注]
>どの値からでも番号付きリストを作成できます。これを行うには、リッチテキストエディタのツールバーで番号付きリストタイプを展開し、 リストプロパティを選択し、選択した開始値を入力します。

水平線

横線を追加してください。

インデントの減少または増加

段落のインデントを増減してください。

リンク

ハイパーリンクを作成または編集できます。また、メールアドレスやページ上の アンカー へのリンクも利用できます。

> [!注]
> CKEditorはメールリンクを自動的に認識するため、クリック時にデバイスのメールクライアントにリンクタイプを指定する必要はありません。

:mdi画像:

選択メディア

メディアファイルを挿入します。

表

テーブルを追加しましょう。

フォーマットを削除

選択したテキストからフォーマットを削除してください。

編集フォーマットコード

ソースコードエディタを開きます。また、iFrameタグをHTMLエディタに貼り付けてフィールドに埋め込むこともできます。

:mdiTrashCan概要:

フィールド値リセット

フィールド内のすべてのテキストを消してください。

内部リンクを挿入

サイトツリーから選んだ内部ページへのハイパーリンクを作成します。

電話番号を追加してください

電話番号へのハイパーリンクを作成し、クリックすると端末の電話クライアントを表示します。

!注リッチテキストエディタは キーボードショートカットをサポートしています。

ツールバーで利用可能な機能は、サイトに割り当てられたCKEditorプロファイル によって異なります。