ブログ

ブログ

2019.04.22

WEBの知識がある方におすすめ!細かく設定できるフルエディタ編集について

今回は、「WEBの知識がなくてもWEBサイトが作れる!?Rabbity-CMSの編集機能について」で簡単に紹介したフルエディタ編集機能について詳しく解説していきます。
WEBの知識をある程度持っている方は、フルエディタ編集機能で細かい設定をしてWEBサイトを自由にカスタマイズしましょう。

フルエディタ編集機能とは?

フルエディタ編集機能とは、スタイルの設定やソースの編集など、ダイレクト編集よりも高度な編集ができる編集機能です。
ダイレクト編集のように決められた範囲のみの編集ではなく、メインコンテンツ領域全体やフリーパーツ全体の内容を編集することもできるので、ページの内容の広範囲を編集したい場合に便利な機能といえます。
WEBの知識がある場合は、ソースを直接編集することでエディタの各ツールだけではできない編集が可能です。

フルエディタ編集機能の使い方

フルエディタ編集は、フリーページのメインコンテンツ領域やフリーパーツが配置された箇所などで右クリックして表示されるメニュー内の「フルエディタ編集」を選択することで操作が可能です。
また、「フルエディタ編集」と表示されない場合でもトピックスやブログなどはダイアログ内でフルエディタ編集機能が使用できます。

1.該当する箇所で右クリックして表示されるメニュー内の「フルエディタ編集」を選択します。

右クリックしてフルエディタ編集を選択

2.領域全体が編集モードに切り替わります。

フルエディタ編集モード

3.編集が完了したら[保存]ボタンを押して完了します。

保存ボタンを押して編集完了

トピックやブログでのフルエディタ編集機能の使い方

トピックの場合

トピック一覧やトピック記事のページ上で右クリックして表示されるメニュー内の「トピックス」→「記事の編集」を選択します。

右クリックしてトピックスの記事の編集を選択

トピックスダイアログの表示後、「本文」タブを選択するとフルエディタ編集機能が付いた編集画面になります。

トピックスダイアログの本文タブを選択するとフルエディタ編集が可能
ブログの場合

ブログも同じく、ブログ一覧やブログ記事上で右クリック→「ブログ」→「エントリーの編集」を選択して、ブログダイアログの「本文」タブを選択するとフルエディタ編集機能が使用できます。

右クリックしてブログのエントリーの編集を選択
ブログダイアログの本文タブを選択するとフルエディタ編集が可能

ツールバーの移動

ダイレクト編集やフルエディタ編集で使用できるエディタツールバーは、左端のオレンジ色の部分をクリックするとウィンドウの下部へ移動させることができます。
編集箇所とツールバーが重なってしまった場合に活用してみましょう。もう一度クリックすれば上部に戻ります。

ツールバー左端をクリック
ツールバーがウィンドウ下部に移動

フルエディタ編集機能の注意点

自由に編集できるフルエディタ編集機能ですが使用する場合は下記の点に注意してください。

レイアウトの崩れ

追加したコンテンツパーツ内のHTMLタグやクラスをフルエディタ編集機能で編集した場合、レイアウトが崩れる可能性があります。
コンテンツパーツ自体のレイアウトを変更したい場合は、コントロールパネルの「管理」タブから「モジュール設定」→「コンテンツパーツ編集」を選択して編集または新規のコンテンツパーツを作成してください。

モジュール設定からコンテンツパーツ編集を選択

コンテンツパーツ編集ダイアログのパーツリストから編集したいパーツを選択します。

編集したいパーツを選択

編集画面下部のエディタ領域でコンテンツパーツの編集が可能です。

パーツの編集画面

新規でコンテンツパーツを作成したい場合は、リスト下部の[追加]ボタンを押すと新規パーツの編集画面になります。

追加ボタンから新規コンテンツパーツを作成可能

フルエディタ編集のエディタツールバーの機能解説

機能名 説明
ソース

アイコンをクリックすると内容の表示をHTML表記に切り替えます。
もう一度アイコンをクリックすると元の表示に戻ります。
ソース表記で編集したい場合や自由にタグを編集したい場合におすすめの機能です。

雛形

あらかじめ登録された雛形の一覧を表示し、適用します。

切り取り

選択した範囲を切り取ります。

コピー
選択した範囲をコピーします。
貼り付け

表示されるウィンドウに入力するかコピーした内容をカーソル位置に貼り付けます。
外部データのコピーも貼り付け可能で、書式設定も引き継がれます。

プレーンテキスト貼り付け

表示されるウィンドウに入力するかコピーした内容の文字情報のみをカーソル位置に貼り付けます。
文字の書式設定などは解除されます。

ワード文章から貼り付け

Wordで作成した文章を表示されるウィンドウにコピー&ペーストすると、カーソル位置にその文章が貼り付きます(設定されたスタイルも引き継がれます)。
設定されたスタイル定義を削除することも可能です。

元に戻す
直前の操作を取り消して、元に戻します。
やり直し
戻した操作をもう一度やり直します。
書式削除
コピーしたデータ(WEBページやWordデータなど)に設定してある独自の書式(文字色など)を削除します。
太字
選択した文字を太字にします。
斜体
選択した文字を斜体にします。
下線
選択した文字に下線を引きます。
打ち消し線
選択した文字に打ち消し線を設定します。
段落番号の追加/削除

選択した段落を番号付きリストに変更します。
設定した箇所で右クリックをして「段落番号プロパティ」をクリックすると、開始番号の設定や番号の種類を変更できます。
詳しい設定方法は「リスト形式テキストの作成方法」をご覧ください。

箇条書きの追加/削除

選択した段落を記号付きリストに変更します。
設定した箇所で右クリックをして「箇条書きプロパティ」をクリックすると、記号の種類を変更できます。
詳しい設定方法は「リスト形式テキストの作成方法」をご覧ください。

インデント解除
インデント(字下げ)を解除します。
インデント
カーソルのある段落をインデント(字下げ)します。
Div作成
選択範囲にdivタグ(HTMLタグ)を挿入します。
左揃え
選択した段落を左揃えにします。
中央揃え
選択した段落を中央揃えにします。
右揃え
選択した段落を右揃えにします。
両端揃え
選択した段落を両端揃えにします。
リンク挿入/編集
選択した箇所にリンクを設定します。
詳しい設定方法は「テキストや画像へのリンクの設定方法」をご覧ください。
リンク削除
選択した箇所のリンクを解除します。
アンカー挿入/編集
ページ内の任意の箇所にリンクするための目印を挿入・編集します。
詳しい設定方法は「アンカーの設定方法」をご覧ください。
イメージ挿入/編集
イメージ(画像)を挿入・編集します。
詳しい設定方法はWEBサイトへの画像の挿入方法と詳細設定方法について」をご覧ください。
Flash挿入/編集
Flashで作成した動画を挿入・編集します。
テーブル挿入/編集
テーブル(表)を挿入・編集します。
詳しい設定方法はWEBサイトへの表の挿入方法と編集方法について」をご覧ください。
横掛線
区切り線を挿入します。
スタイル
選択した範囲に、あらかじめテンプレートに登録されているスタイルを設定します。
フォーマット

選択した範囲に、見出し1や見出し3、段落などのフォーマットを適用します。
各フォーマットには、あらかじめテンプレートによってスタイルが登録されています。

フォント
選択した範囲に、あらかじめテンプレートに登録されているフォントを設定します。
サイズ

文字のサイズを設定します。

テキスト色
文字の色を設定します。
背景色
背景の色を設定します。
編集モードタグ
選択した箇所にダイレクト編集などが可能になる編集モードタグを設定します。
エディタサイズを最大にします
ダイアログでのフルエディタ機能使用時にエディタの表示領域を最大化します。
※ダイアログでの編集時に有効な機能です。
絵文字挿入

カーソル位置に絵文字を挿入します。
※ダイアログでの編集時のみ使用可能な機能です。

Web制作・ホームページ制作に
関するお問い合わせ

Web制作のお見積り、ご相談等をご検討の方はお問い合わせフォームをご活用ください。

お問い合わせする

Rabbity-CMS
体験版のお申し込み

Rabbity-CMSの体験版をご利用したい方は申し込みフォームをご活用ください。

体験版を申し込む

Rabbity-CMSに
関するお問い合わせ

体験版の延長、CMSに関するご質問はこちらのフォームをご活用ください。

お問い合わせする

お電話でのお問い合わせ

TEL:048-421-8571
営業時間 9:00-17:00(土日祝除く)

※セールス目的でのお問い合わせはご遠慮ください。