2021/11/11のUI刷新 第一弾リリースにてカラースキーム(配色設計)とタイポグラフィ(文字の書体、大きさ、配列のしかたなど)を変更しております。オンラインマニュアルに掲載している画面キャプチャと実際の管理画面の配色や文字の状態が異なる場合がございますがご了承いただけますと幸いでございます。
「SATORI」のメールテンプレート機能やHTMLパーツ機能、ウェブページ機能では、HTMLを編集するツールとして「TinyMCE」というWYSIWYGエディタを利用しております。
画像やリンクの挿入など基本的な操作は、コーディングやHTMLの知識がなくても簡単に行うことが可能です。
エディタのツールバーの概要と、利用頻度の高い基本的な操作についてご案内します(2024年6月19日時点の情報です)。
目次
ツールバーの概要
ツールバーの概要については以下に記載します。
アイコン | アイコン名称 | 操作内容 |
元に戻す |
ひとつ前に行った動作を取り消します |
|
やり直す | 直前に取り消した動作を再度行います | |
書式 | 選択した文字列やコンテンツの書式を変更します | |
太字 | 選択した文字列を太字にします | |
斜体 | 選択した文字列を斜体にします | |
左寄せ | 選択したコンテンツを左揃えにします | |
中央揃え | 選択したコンテンツを中央揃えにします | |
右寄せ | 選択したコンテンツを右揃えにします | |
両端揃え | 選択したコンテンツを幅に合わせ均等に配置します | |
箇条書き | 選択したコンテンツを箇条書きにします | |
番号付き箇条書き | 選択したコンテンツを番号付きの箇条書きにします | |
インデントを減らす | 選択したコンテンツの先頭に入っているスペースやタブを減らして、左にずらします | |
インデントを増やす | 選択したコンテンツの先頭にスペースやタブを入れて、右にずらします | |
テキストの色 | 選択したテキストの色を指定します | |
背景色 | 選択したテキストの背景色を指定します | |
リンクの挿入・編集 |
リンクを挿入・編集します 詳細はこちらを参照ください |
|
画像の挿入・編集 |
画像を挿入・編集します 詳細はこちらを参照ください |
|
メディアの挿入・編集 | メディアを挿入・編集します | |
特殊変数 ※メールテンプレート機能のみ |
特殊変数を挿入します 特殊変数についてはこちらの「特殊変数について」を参照ください |
|
トラッキングURLに置換 ※メールテンプレート機能のみ |
すべてのリンク先URLをトラッキングURLに置換します | |
プレビュー | モーダルウィンドウでプレビューします | |
ソースコード | ソースコードを編集します |
基本的な操作
画像を挿入する
事前に「SATORI」の「画像」機能に画像をアップロードしておく必要があります(貴社サーバーにアップロードしている画像を挿入する場合は不要です)。
「SATORI」の「画像」機能へのアップロードの手順は、オンラインマニュアル(「画像」について)をご参照ください。
- 画像を挿入したい場所にカーソルを移動します。
- ツールバーの「画像の挿入・編集」をクリックします(右クリックから「画像」選択でも可能です)。
- 画像の挿入・編集をします。
(1) 「画像のソース」で事前にアップロードしていた画像を選択します(貴社サーバーにアップロードしている画像の場合はURLを記入します)。
(2) 「画像の説明文」を記入します(任意)。画像が表示されなかった場合に代わりに表示する文字列になります(HTMLのalt属性に該当します)。
(3) 「画像サイズ(横・縦)」を記入します(任意)。記入しない場合は画像のデフォルトのサイズになります。
- 「OK」ボタンをクリックします。
リンクを挿入する
- リンクを挿入したい場所にカーソルを移動します。
- ツールバーの「リンクの挿入・編集」をクリックします(右クリックから「リンク」選択でも可能です)。
- リンクの挿入・編集をします。
(1) 「リンク先URL」にリンクしたいURLを記入します(カメラアイコンから事前にアップロードしていたファイルを選択することも可能です)。
「ファイル」アップロードの手順は、オンラインマニュアル(「ファイル」について)をご参照ください。
(2) 「リンク元テキスト」を記入します。
(3) 「タイトル」を記入します(任意)。マウスオーバーした場合に表示する文字列になります(HTMLのtitle属性に該当します)。
(4) 「ターゲット属性」を選択します。リンク表示を同ウィンドウではなく、新規ウィンドウにしたい場合は「新規ウィンドウ」を選択します。
- 「OK」ボタンをクリックします。
注意事項
- HTML・CSS・JavaScriptの具体的な記述方法やデバック対応、WYSIWYGエディタに関するサポートはサポート範囲外となります。
- WYSIWYGエディタでは、空のタグが削除される、不明なタグを補正・補完するなど、自動で修正が入る場合があります。
よくある質問/トラブルシューティング
エディタ上でEnterキーを押す場合とShiftを押しながらEnterキーを押す場合では、挙動が異なります。
Enterキーを押すと同じ段落内で改行し、Shiftを押しながらEnterキーを押すと新しい段落を作成します。
※「見出し」を設定する場合は、Shiftを押しながらEnterキーを押し、新しい段落を作成してください。
違いについては以下をご参照ください。
Enterキーを押す場合
段落を分けずに、同じ段落内で改行します。
エディタでの表示(一例):
ソースコード(一例):
Shift + Enterキーを押す場合
新しい段落を作成します。
エディタでの表示(一例):
ソースコード(一例):