マニュアル

メインコンツやコンテンツパーツ、メニュー、フリーパーツなど、編集したい箇所にマウスを合わせると表示される編集ボタンをクリックすると、その部分のみが編集画面に変わります。これを『ダイレクト編集機能』といいます。
編集したい箇所でマウスをダブルクリックするときも、ダイレクト編集機能の編集画面に変わります。
ただし、マウスを合わせた時に実線の枠線が表示される箇所のみでこの機能を使用できます。

• 編集する箇所によってはツールバーが表示されないこともあります。

⇒ サーバーブラウザーに画像をアップロードする方法はこちら

• サーバーブラウザーにアップした元の画像の横幅と、コンテンツパーツで設定された画像の横幅が違いすぎると、画像がきれいに表示されない場合があります。元の画像を表示サイズに合わせておくことをおすすめします。

ダイレクト編集機能は、コンテンツパーツの見出しやテキスト、画像などにマウスを合わせると表示される枠線の箇所でダブルクリックすると、その箇所にあった編集を行うことができる機能です。このダイレクト編集ができる箇所には、ダイレクト編集用の固有のclassとid、および編集モードタグが設定されているため、ダイレクト編集時には編集モードタグによって異なる編集画面が表示されます。
主な編集モードタグは下記をご確認ください。

主な編集モードタグ

複数行テキスト

タイトル見出しなどのパーツに設定されている改行可能な編集モード（ツールバーなし）です。

編集モードタグ例

<div class="cms-content-parts-sin000000000000000000" id="cms-editor-textarea-sin000000000000000000">～</div>

ダイレクト編集時

1行テキスト

タイトル見出しなどに設定されている改行不可の編集モード（ツールバーなし）です。

編集モードタグ例

<div class="cms-content-parts-sin000000000000000000" id="cms-editor-textbox-sin000000000000000000">～</div>

ダイレクト編集時

ミニエディタ 

テキストなどに設定されているツールバーが表示される編集モードです。

編集モードタグ例

<div class="cms-content-parts-sin000000000000000000" id="cms-editor-minieditor-sin000000000000000000">～</div>

ダイレクト編集時

画像

画像のパーツに設定されている編集モードです。ダイレクト編集時にサーバーブラウザーが立ち上がります。

編集モードタグ例

<img alt="" class="cms-easy-edit" id="cms-editor-image-sin000000000000000000" src="https://～">

• フルエディタ編集でコンテンツパーツのHTMLソースをコピーして、別の箇所に貼り付けすると、ダイレクト編集を判断する固有のidおよびclassの重複や不備が生じるため、ダイレクト編集の操作に不具合が生じますのでご注意ください。（ブログエントリーの追記やショップトップページなど固有のidおよびclassが通常と異なる場合があります）

編集モードタグの設定

編集モードタグは、コンテンツパーツの登録、ダイアログのフルエディタ編集機能のツールバーのみ設定することができます。

⇒ コンテンツパーツの登録についてはこちら
⇒ ツールバーの機能一覧についてはこちら