「テキストパーツ」は、ページ内にテキストを入力する際に使用します。
リッチテキストパーツと違い、太字・斜体・リスト・リンク設定など、より簡易的な編集や設定が可能なパーツとなっております。
※リッチテキストパーツでは文字の種類や大きさ、文字修飾、簡単な図表など様々な設定が可能です。
■リッチテキストパーツの詳細についてはこちら
＞【機能詳細】ページ編集（LP編集）／デザインパーツ リッチテキストパーツ
現在のプランでは使用できません。
※過去契約を行った一部のお客様に表示されている機能となります。
リッチテキストパーツをご利用ください。
目次
完成イメージ
項目の説明（記法の選択）
あらかじめ「エディタ」か「マークダウン記法」を選択してから設定してください。
途中で変更すると設定した内容がクリアされますのでご注意ください。
エディタの項目説明
文字の種類や大きさ、文字修飾、簡単な図表など様々な機能がついています。
＜ページ編集の場合＞
①カラー
ドラッグして選択した文言の文字色を、カラーチャートまたは16進法カラーコードで変更できます。
②背景カラー
ドラッグして選択した文言の文字背景色を、カラーチャートまたは16進法カラーコードで変更できます。
③フォント選択・太字
ドラッグして選択した文言の書体を変更できます。
Webフォント選択時には、での太字選択はできません。プルダウン
からL、R、M、B、EBを選択します。
太さを変更できるフォントを選択した場合、太さの種類を選択できます。
＜太さの種類＞
- L :Light 細
- R : Regular 中細
- M : Medium 中
- B : Bold 太
- EB : Extra bold 特太
④フォントサイズ
ドラッグして選択した文言のフォントサイズを変更できます。
指定できるサイズ
8,9,10,11,12,14,16,18,20,22,24,26,28,30,32,34,36,38,42,46,50,54,60,66,72,78,86,94px
⑤書式のクリア
ドラッグして選択した文言の、フォント・サイズ・カラーの設定が解除されます。
⑥左寄せ・中央寄せ・右寄せ
文字の寄せを変更できます。
⑦非表示ボタン
プレビュー、公開ページでは非表示になります。
⑧カスタマイズ
パーツに対して背景色・背景画像・余白・枠線を設定できます。
また、カスタムCSSを使用する場合にクラス名を設定できます。
⑨削除
パーツを削除します。
マークダウン記法の項目説明
文言をマークダウン記法で編集ができます。「斜体」「リスト化」「テキストにリンクを設定」「表組み」を設定する場合はこちらを選択してください。
①設定
マークダウン記法でのテキストの編集は、こちらの設定から行います。
※テキスト編集方法の詳細は下部「マークダウン記法のテキスト編集方法について」をご確認ください。
②左寄せ・中央寄せ・右寄せ
文字の寄せを変更できます。
③非表示ボタン
プレビュー、公開ページでは非表示になります。
④カスタマイズ
パーツに対して背景色・背景画像・余白・枠線を設定できます。
また、カスタムCSSを使用する場合にクラス名を設定できます。
⑤削除
パーツを削除します。
マークダウン記法のテキスト編集方法について
マークダウン記法では、下記の簡易的な編集や設定が可能です。
①文字を太字にする
②文字を斜体にする
③リスト化する
④テキストにリンクを設定する
リンクを設定すると[](http://sample.com)と表示されます。
[]内にリンクの名前を入れます。
また、表組みも可能です。
【表組みの記述例】
| | |
|:-----------:|:------------|
| 会社名 |株式会社ベーシック|
| 所在地 |東京都千代田区一番町17-6 一番町MSビル1F［最寄駅出口］半蔵門駅 （5番）|
| 代表取締役 |秋山 勝|
| 従業員数 |105名|
| 事業内容 |比較メディア事業 WEBマーケティング事業 フランチャイズ事業 ガジェット事業 アプリマーケティング事業|
【表組みの表示例】
項目の説明（「リンク設定」について）
プルダウンから「マークダウン記法」を選択してからテキストを編集します。
リンクを設置したい箇所の文言を選択し、リンクボタンをクリックします。
リンク先のURLを入力してOKをクリックします。
画面右側のプレビューで、文言が青色になっていることを確認し、決定をクリックします。
コードブロックについて
プルダウンから「マークダウン記法」を選択して下記のように「`」3つでテキストを囲んでください。
```
codeを記載する
```
背景色などのデザインはされていないため、下記サンプルのようなCSSをカスタムCSSに追記する必要があります。
※CSSの詳細はサポート（問い合わせ対応やレクチャー）対象外となります。
＜CSSサンプル＞
.component.text pre code {
display: block;
margin: 10px 0;
padding: 10px;
border-radius: 5px;
background: #222222;
color: #fff;
white-space: pre-wrap;
}
＜表示例＞
■ブログでコードブロックする方法はこちら
＞ブログ／項目を追加する方法「コード」
設置する方法（動画）
画像をクリックして拡大表示することができます