グーテンベルク(Gutenberg)のブロックのサンプルです。テキストブロックとメディアブロックのサンプルをまとめています。デザインの確認や参考にどうぞ。
サンプルデザインについて
このページのサンプルは、WordPressテーマ「THE THOR」と独自のCSSで調整されたデザインです。
お使いのテーマが異なる場合は大きくデザインが異なる可能性があるので、ご承知のうえご利用ください。
テキストブロック
テキストブロックのサンプルです。見出しや段落はページ内で使っていますので、割愛します。
リスト
リストは、順序なしリスト/順序付きリストの2パターンが選べます。
順序なしリスト
- ・A
- ・B
- ・C
順序付きリスト
- A
- B
- C
引用
デフォルトサイズ
引用とは、広義には、自己のオリジナル作品のなかで他人の著作を副次的に紹介する行為、先人の芸術作品やその要素を副次的に自己の作品に取り入れること。
出典: フリー百科事典『ウィキペディア（Wikipedia）』
大サイズ
林内などの弱光下で形成された葉。 日なたの葉（陽葉）に比べて、厚さが薄く、面積が広いなどの形態的特徴がある。
出典 小学館 日本大百科全書
コード
1 2 | =ArrayFormula(IF(C3:C="","",TEXT(ROUNDUP(C3:C,-3),"000000"))) |
整形済みテキスト
1 2 | わ た し キレイ？ |
プルクオート
デフォルト
プルクオートは引用と似ていますが、より目を引くデザインになっています。
出典：WordPress.com
単色
投稿やページのテキストを強調する場合は、 プルクオートブロック を使用することで、特定の部分を簡単に見栄えよくできます。
出典：WordPress.com
テーブル(表)
テーブルは、デフォルトスタイル/ストライプスタイルの2パターンが選べます。
カラム単位で配置を変更したり、表の編集をしたり、右のメニューからカスタマイズできます。
最初からヘッダー/フッターセクションが1行ずつ用意されていて、表示/非表示を切り替えられます。
デフォルトスタイル
| ヘッダー1 | ヘッダー２ | ヘッダー3 |
|---|---|---|
| A | B | C |
| D | E | F |
| フッター1 | フッター2 | フッター3 |
ストライプスタイル
| ヘッダーA | ヘッダーB | ヘッダーC |
|---|---|---|
| 1 | 2 | 3 |
| 4 | 5 | 6 |
| フッターA | フッターB | フッターC |
詩
1 2 | これはいったい誰の為 |
1 2 | これはいったい何の為 |
1 2 | 使用率を知りたいブロック |
メディアブロック
画像ブロック
デフォルト
角丸
ギャラリー
音声
カバー
カバーをかける
ファイル
メディアとテキスト
他のを組み合わせて作れるからいらないブロックかも？
動画
デザインブロック
ボタン
カラム
| 7 |
| 3 |
グループ
一定範囲のブロックをdivで囲ってグループ化できます。使う機会はかなり少なそうです。
続き/改ページ/区切り
長い記事や記事を並べる時などに便利です。わかりづらくなるのでサンプルは設置していません。
スペーサー
ブロックの間に好きな高さのスペースを設置できます。
基本的にはCSSで余白を設定するので、使う機会はかなり少なそうです。
サイトロゴ
用途不明なブロックですね。サイトに設定しているものと紐付いていて、投稿内からも更新できますが・・・謎。
キャッチフレーズ
我々は令和ガイドです。令和版のガイドやマニュアルを紹介します。最新おすすめ商品やおすすめツールなども紹介します。
サイトのタイトル
謎だしページ構成が崩れるので、サンプルは設置しません。
アーカイブタイトル
本当に謎だしページ構成が崩れるので、サンプルは設置しません。
