こんにちは。プログラマーNです。
WordPressのブロックエディタ(Gutenberg)で、ブログやホームページを作成しようとする際、ブロックが多すぎて、便利なブロックを使わないままにしていませんか？
あるいは、同じブロックを使用してご自身のブロックやホームページの見栄えが良くないと感じませんか？
僕自身も各ブロック、各ブロックの設定について、知らないことが多いです。。。
そこで、WordPressで各ブロックの使い方（詳しい設定方法）について、詳しくギュっとお伝えしていきます。
このシリーズをご覧になることで、ブログやホームページの可読性を高くし、見栄えがよくなります。是非、最後までご覧ください。
今回のブロック内容
- リスト
- 引用
- プルクオート
リスト
リストは、箇条書きリストと番号付きリストがあります。
下記が箇条書きリストと番号付きリストです。
↓↓↓箇条書きリスト↓↓↓
- テストリスト１
- テストリスト２
- テストリスト３
- テストリスト４
↓↓↓番号付きリスト↓↓↓
- テストリスト（番号付き）１
- テストリスト（番号付き）２
- テストリスト（番号付き）３
- テストリスト（番号付き）４
リストの使い方・設定
リストを選択します。
リストブロックが表示されました。
表示してすぐのデフォルトは、箇条書きリストです。
文章を入力後、「Enter」キーを押すと、次のリストへ行きます。
“テストリスト３”の文章でインデントしてみます。
“テストリスト４”の文章のインデントを戻してみます。
番号付きリストは「番号付きリストに変換」を押し、表示します。
番号付きリストも箇条書きリストと同じようにインデントができます。
引用
引用は、ブログの信頼を高めたい時、根拠を伝えたい時に使用します。
引用の使い方・設定
引用を選択します。
引用ブロックが表示されました。
引用は２か所入力する箇所があります。
１つ目は引用する文章、２つ目は引用元です。
１つ目、２つ目の内容を入力します。
引用元を選択し、ツールバーのリンクを押します。
引用元のURLを入力し、URLボタンがある箇所（↑画面の背景色が灰色の箇所）を押します。
このように表示されます。
サイドバーのスタイルを「大」にしてみます。
PHP（ピー・エイチ・ピー）は “The PHP Group” によってコミュニティベースで開発されているオープンソースの汎用プログラミング言語およびその公式の処理系であり、特にサーバーサイドで動的なウェブページを作成するための機能を多く備えていることを特徴とする。
Wikipediaより引用
かなり強調されましたね！
プルクオート
プルクオートとは、引用と同じ様にブログの信頼を高めたい時、根拠を伝えたい時に使用します。
プルクオートと引用の違い
では、引用とどのように違うのか実際に表示してみます。
↓プルクオート↓
PHP（ピー・エイチ・ピー）は “The PHP Group” によってコミュニティベースで開発されているオープンソースの汎用プログラミング言語およびその公式の処理系であり、特にサーバーサイドで動的なウェブページを作成するための機能を多く備えていることを特徴とする。
Wikipediaより引用
↓引用↓
PHP（ピー・エイチ・ピー）は “The PHP Group” によってコミュニティベースで開発されているオープンソースの汎用プログラミング言語およびその公式の処理系であり、特にサーバーサイドで動的なウェブページを作成するための機能を多く備えていることを特徴とする。
Wikipediaより引用
プルクオートがより強調されているイメージです。
プルクオートの使い方・設定
プルクオートを選択します。
引用と同じように２か所入力する箇所があります。
（１つ目は引用する文章、２つ目は引用元です。）
１つ目、２つ目の内容を入力します。
ツールバーのリンクを押し、URLを入力します。
サイドバーで「スタイル」、「色」（メインカラー、テキスト色）を変更します。
（ちなみに「引用」ブロックには「色」はありません）
このような表示になります。
PHP（ピー・エイチ・ピー）は “The PHP Group” によってコミュニティベースで開発されているオープンソースの汎用プログラミング言語およびその公式の処理系であり、特にサーバーサイドで動的なウェブページを作成するための機能を多く備えていることを特徴とする。
wikipediaより引用
↑スタイル：「単色」↑
↓スタイル：「デフォルト」↓
PHP（ピー・エイチ・ピー）は “The PHP Group” によってコミュニティベースで開発されているオープンソースの汎用プログラミング言語およびその公式の処理系であり、特にサーバーサイドで動的なウェブページを作成するための機能を多く備えていることを特徴とする。
Wikipediaより引用
コメント