コアブロック

【AFFINGER6】段落ブロックの使い方を紹介!

2021年6月15日

この記事は「アドセンス合格編」の3番目の記事です。前の記事はこちら「【見出し】ブロックの使い方」

AFFINGER6の段落ブロックに関するいろんな設定をまとめました!

段落ブロックの基本的な使い方についてはこちらの記事でまとめているのでこちらを先にお読みください↓

先に読む【WordPress】段落ブロックの使い方を解説! >

テキストを装飾する

【WordPress】段落ブロックの使い方を解説! の続きです。

テキストの一部を装飾する方法を紹介します。

【WordPress】段落ブロックの使い方を解説! ではWordPress側の装飾を紹介しました。今回はAFFINGER6側で用意された装飾を紹介します。

  1. 装飾したい文字を選択します
  2. 上のツールバーの書式をクリック
  3. 好きな装飾を選択

AFFINGER6のブロックエディタで使えるテキストのスタイル一覧

太字意味が重要か重要でないかは関係なく単純に文字を太くするときに使う。重要な意味のときはBを使う。
太字(赤)太字の赤文字版。
マイ細マーカーAマーカーの装飾。背景色と文字色を設定できる。設定場所は「AFFINGER管理 > Gutenberg管理 > 全体 > カラー設定 > マイ細マーカー設定」
マイ細マーカーBマーカーの装飾(2番目)。同上。
ソースコード風ソースコード風の装飾。ガチのコードはWordPress側の「インラインコード」がおすすめ。
ドット線点線のアンダーライン
[赤]赤い四角
[オレンジ]オレンジ色の四角
文字サイズ(小)文字を小さくする
文字サイズ(大)文字を大きくする

段落全体を装飾する

段落全体にデザインを施す方法を紹介。段落を枠で囲ったり、会話文にしたりすることができます。

中央の編集画面でデザインを施したい段落を選択 ( クリック ) します。次に右上にある( 設定 ) を押して右のパネルを展開します。パネルをブロックパネルに切り替えましょう。すると段落のスタイル一覧がでてきます。ここから好きなデザインを選びます。

やり方はこちら↓

  1. 段落を選択(クリック)
  2. 設定ボタン(右上)をクリックして右のパネルを展開
  3. パネルを"ブロック"に切り替え
  4. 好きなスタイルを選択する
AFFINGER6ブロックエディタの使い方(段落の装飾の仕方)

"メモ"や"会話文"を適用してみる

試しに"メモ"や"会話文"を適用してみましょう。

メモを適用してみる

試しに"メモ"のデザインを設定してみましょう。一覧から " メモ " のスタイルを選択します。するとこのよう↓にスタイル(デザイン)が適用されます。

メモのデザインを施した例
メモのデザインを施した例

会話文を適用してみる

次は会話文を使ってみましょう。

会話文のデザインを施した例
会話文のデザインを施した例

会話文は使う前にアイコンを設定する必要があります。こちらで設定しましょう。

【ダッシュボード】→【AFFINGER管理】 → 【会話アイコン】

アップロードボタンを押して会話アイコンをアップロードします。

アップロード後、再びスタイル設定画面に戻ってくると簡易会話Aにアップロードしたアイコンが反映されているはずです。

表示されない場合はGutenberg設定で有効化されているか確認してください。下の補足参照。

段落を選択した上で簡易会話Aを押すと段落が会話文に変わります。

"簡易会話"で使える会話文は2つまでです。それ以上使う場合は会話ブロックを使用します。

会話文についてはこちらで詳しく解説しています。

ふきだしの使い方("簡易会話"と"会話ふきだし") >

AFFINGER6のブロックエディタで使える段落(p)のスタイル一覧

全ての段落スタイルはこちらです。

AFFINGER6ブロックエディタの段落スタイル(メモ)
メモ
AFFINGER6ブロックエディタの段落スタイル(リンク)
リンク
AFFINGER6ブロックエディタの段落スタイル(チェック)
チェック
AFFINGER6ブロックエディタの段落スタイル(ポイント)
ポイント
AFFINGER6ブロックエディタの段落スタイル(インフォ)
インフォ
AFFINGER6ブロックエディタの段落スタイル(注意)
注意
AFFINGER6ブロックエディタの段落スタイル(注意(グレー))
注意(グレー)
AFFINGER6ブロックエディタの段落スタイル(初心者)
初心者
AFFINGER6ブロックエディタの段落スタイル(マル)
マル
AFFINGER6ブロックエディタの段落スタイル(バツ)
バツ
AFFINGER6ブロックエディタの段落スタイル(Like)
Like
AFFINGER6ブロックエディタの段落スタイル(Bad)
Bad
AFFINGER6ブロックエディタの段落スタイル(Code)
Code
AFFINGER6ブロックエディタの段落スタイル(付箋)
付箋
AFFINGER6ブロックエディタの段落スタイル(囲みドット)
囲みドット
AFFINGER6ブロックエディタの段落スタイル(ふきだし)
ふきだし
AFFINGER6ブロックエディタの段落スタイル(まるもじ)
まるもじ
AFFINGER6ブロックエディタの段落スタイル(簡易ボタン)
簡易ボタン
AFFINGER6ブロックエディタの段落スタイル(簡易会話)
簡易会話

すべてのスタイルを使えるようにするには

初期状態では段落スタイルは一部のスタイルしか使うことができません。全てのスタイルを使えるようにするには個別に有効化する必要があります。設定はGutenberg設定でできます。

【ダッシュボード】→【AFFINGER管理】 → 【Gutenberg設定】> "段落ブロック"

AFFINGER6ブロックエディタの使い方。すべての段落スタイルを使えるようにするには設定で個別に有効化する。

使いたいスタイルのチェックを外します。反対に使わないスタイルにはチェックをして無効化しましょう。


以上!AFFINGER6の段落ブロックに関するいろんな設定をまとめました!参考にいなれば嬉しいです!

以上「アドセンス合格編」の3番目の記事でした。次の記事はこちら「【画像】ブロックの使い方

-コアブロック
-