1. TOP
  2. Spearly CMS
  3. マニュアル
  4. リッチテキストエディタの使い方

リッチテキストエディタの使い方

フィールドタイプでリッチテキストを選択すると、コンテンツ編集時にリッチテキストエディタが使用可能になります。

ここでは、リッチテキストエディタの使用方法について説明します。


基本的な使い方


  1. テキストを入力します。
  2. 書式を変更したい文字を選択、または、行全体の書式を変更したい場合はその行にカーソルを合わせます。
  3. エディタ上部のメニューから書式を設定したい種類を選択します。

クイック挿入


空行にフォーカスすることで、クリック挿入を使用できます。

画像や動画、表などを素早く挿入することができます。


  1. 任意の空行にフォーカスします。
  2. 「+」アイコンをクリックし、画像を挿入をクリックします。
  3. 任意の画像を選択します。
  4. エディタ部分に画像が挿入されます。

HTMLタグ表示


リッチテキストエディタの機能を使うことで

フィールドの値をHTMLとして編集することも可能です。

エディターのメニューに用意されていない書式(<h4>タグなど)を設定したい場合はこちらから設定可能です。


  1. エディタ上部のメニューのその他から、HTMLタグ表示をクリックします。
  2. 現在のフィールドの値がHTMLとして表示されます。
  3. この状態で最下行にテキストを追加し、もう一度HTMLタグ表示をクリックします。
  4. HTMLとして入力した文字が、表示されます。

使用可能な書式


太字

選択したテキストを太文字で表示します。


斜体

選択したテキストを斜体で表示します。


取り消し線

選択したテキストに取り消し線を表示します。


リンクの挿入

選択したテキストをリンク化します。

テキスト未選択の状態でリンクの挿入をクリックした場合は、URL入力時にテキストも入力し決定します。


リンクの削除は、リンクにフォーカスした時に表示されるツールチップから可能です

より多くのテキスト

下線や文字色, 下付き文字など、より細かい設定が開かれます。


下線

選択したテキストに下線を表示します。


コード

文中にコードを書くためのcodeタグを当てます。


下付き文字/上付き文字

行の下部または上部に小さなテキストを表示します。


フォントサイズ

テキストの大きさを変更します。


文字色

テキストの色を変更します。


背景色

テキストの色を変更します。


書式のクリア

選択したテキストの書式を削除します。


ヘッダー

見出しを設定します。

ただし、h4〜h6を使用したい場合は、HTMLタグ表示から設定をする必要があります。


引用

テキストを引用として表示します。


コード

選択したテキストをコードとして表示します。


箇条書き

選択したテキストを箇条書きリストとして表示します。

タブキー、または上部メニューのインデントを減らす、インデントを増やすでリストのインデントが可能です。


プルダウンからリストの先頭のドットのスタイルを変更できます。(● or ○など)


段落番号

選択したテキストを番号付きの箇条書きとして表示します。

箇条書きと同じくインデントの操作が可能です。


プルダウンからリストの先頭の数字のスタイルを変更できます。(ABC or αβγなど)


インデント

箇条書き、段落番号のインデントを増減します。



文字揃え (左揃え、中央揃え、右揃え)

「もっと段落」から、テキストの左、右、中央、両端揃えを設定できます。


画像の挿入

画像のアップロード

画像をアップロードします。

アップロードした画像をクリックして、リンク/代替テキストの挿入、サイズ変更、画像の削除などが行えます。

最大サイズ:10MB


画像URLでの挿入

Web上に公開されている画像のURLを入力することで、画像を埋め込む事もできます。


画像を横並びにする

画像のインライン表示機能を用います。

画像をクリックして詳細設定を開き、「インライン」表示に変更します。


動画の挿入

動画のアップロード

動画をアップロードします。

アップロードした動画をクリックして、配置/サイズの変更、動画の削除などが行えます。

ファイル形式:MP4
最大サイズ:30MB


動画共有サイトの動画を埋め込む

動画共有サイトのURLを使って動画を埋め込む事ができます。

Youtube, Vimeo, Daily Motion などに対応しています。


埋め込みコードを使って動画を埋め込む

動画共有サイトなどで発行された、埋め込みコードを使って動画を埋め込み事ができます。


表の挿入

表を挿入します。


行列数を選び、マウスクリックで決定します。

既存のテーブルにフォーカスが当たっている状態で同じ操作をすることで、テーブルを入れ子にすることができます。

セルを選択することで、その他の表のオプションを利用できます。

絵文字

絵文字を挿入します。


ファイルアップロード


ファイルをアップロードし、リンクとして表示します。


アップロードしたファイルにフォーカスすることでリンクの編集や削除が行えます。


最大サイズ:10MB

水平線の挿入

水平線を挿入します。


段落/改行の方法の変更


フィールドの作成・編集で、入力したテキストをp要素で括るかどうかを設定できます。

「段落にp要素を使用する」にチェックした場合

テキストをp要素で括ります。

Enterキーで一度p要素を閉じ、新たなp要素を次の行に追加します。(下画像の上赤枠)

Shift + Enterキーで、p要素内でbr要素を使用して改行します。(下画像の下赤枠)

フィールド作成時の初期値はチェックONです。

コンテンツ編集画面表示時、要素に括られていないテキストは自動的にp要素で括られます。

「段落にp要素を使用する」のチェックを外した場合

Enterキーでbr要素が追加されます。(下画像赤枠)

既にp要素で括られているテキストはそのままp要素で括られたままとなります。

最終更新日: