WordPress × Cocoon × Gutenberg|5. テーマブロック編

Gutenbergまとめ記事

ナビゲーションやクエリーループを挿入することができる!けど、実際に投稿記事で使うブロックはほとんどないかもしれません…
こういう事ができるんだ、ってさらっと目を通してもらえればOK!なテーマブロック全23種類です

ウィジェットブロックも攻略しました!残すはテーマ・埋込・Cocoonブロックのみ
実は、今回のテーマブロックと次回の埋め込みブロックは、さらっと概要だけ説明だけして終わりにしようと思っています
そのくらい簡単です!種類が多いだけなので怖くありません

また、うまく表示されない・ちょっとよくわからないブロックも多々あったのですが
あまり使用頻度が高くなさそうなので深追いしていません_(._.)_

ではいってみよう!

WordPress × Cocoon × Gutenberg|テーマブロック編

スポンサーリンク
  1. テーマブロックは一目瞭然!そしてほぼ使わない、きっと
      1. 私の環境
    1. テーマブロックの種類は全部で 23個
  2. ナビゲーション ☆☆☆
  3. サイトロゴ ☆☆☆
  4. サイトのタイトル ☆☆☆
  5. サイトのキャッチフレーズ ☆☆☆
  6. クエリーループ ★☆☆ ↓下3つの記事が見出しにも反映
  7. 愛用ガジェット
  8. 初投稿!
  9. Appleが好きすぎて株まで買ってしまった話〜Appleへの愛を語る
  10. 投稿一覧 ☆☆☆ ↓下3つの記事が見出しにも反映
  11. PS5 音の可能性を引き出す|4K120Hzを維持しながらG One × DACで至高の音響環境を
  12. STEPN日記 思い切ってB国参入・運営突然の発表〜STEPN-verse MADNESS編
  13. M1 MacBookでゲーム実況がしたい|3. どんなスタイルで実況するか?編
  14. M1 MacBookでゲーム実況がしたい|2. どのゲームを実況するか?編
  15. 投稿タイトル ☆☆☆ ↓下1つの記事が見出しにも反映
  16. WordPress × Cocoon × Gutenberg|5. テーマブロック編
  17. 投稿の抜粋 ☆☆☆
  18. 投稿のアイキャッチ画像 ☆☆☆
  19. 投稿コンテンツ ☆☆☆
  20. 投稿者 ☆☆☆
  21. 投稿日 ☆☆☆
  22. 投稿カテゴリー ☆☆☆
  23. 投稿タグ ☆☆☆
  24. 次の投稿 ☆☆☆
  25. 前の投稿 ☆☆☆
  26. 投稿コメント ☆☆☆
  27. コメント
    1. コメントをどうぞ コメントをキャンセル
  28. ログイン/ログアウト ☆☆☆
  29. タームの説明 ☆☆☆
  30. アーカイブタイトル ☆☆☆
  31. Post Author Biography (=著者プロフィール)☆☆☆
  32. Avatar(=アバター) ☆☆☆
  33. Post Author Name (=投稿者名)☆☆☆

テーマブロックは一目瞭然!そしてほぼ使わない、きっと

テーマ」とひとくくりにされており、数は多いですが
「ウィジェット」ブロックにかなり近い存在です

ちょっと理解しづらいのが「テーマ」という言葉
CocoonはWordPressで使える「無料テーマ」ですが、
このテーマブロック自体とは切り離して考えたほうが良さそうです
(初心者にとってはここは特に重要ではなさそうなので深追いしません )

ブログ記事本文にはあまり使う機会はなく、固定ページとかページ全体で使うかな‥?
くらいで、使用頻度はこのブロック自体低いです

ブログ初心者に必須な項目を見出しに★★★ で表現しました

目指せWordpressマスター!

私の環境

WordPress 5.9.3, Cocoon Child バージョン: 1.1.3, スキンなし,
Gutenberg 12.9.0
(2022.04.11時点での最新バージョン)
M1 macOS Monterey 12.2.1
ブラウザはBrave バージョン: 1.36.117

テーマブロックの種類は全部で 23個

まずは、トップメニュー、もしくはコンテンツエリアの「+」マークを押して、
テーマブロックを開いてみましょう、全部で 23種類 あります

全 23 種類 を上から順に紹介していきます

スポンサーリンク

ナビゲーション ☆☆☆

ブログに設定している「トップのメニュー」「ピックアップ」「フッター」などを設置できます
ツールバー「空から始める」を選んで、自分で自由に記事をメニューとして作り込むこともできる…
らしいのですがうまくいきませんでした汗

↑トップのメニューなどは、ダッシュボード>外観>メニューから作成します

詳しいサイトを見つけました!

サイトロゴ ☆☆☆

ファビコンとは違うのかな‥?一応設定してみたのですが、特に表示もされず、よくわかりませんでした!すみません汗

一度アップすると「サイトロゴ」として登録されるようではあるんですが‥

↓ここに埋め込んでみました

サイトのタイトル ☆☆☆

elliemylove

サイトのタイトルをH1で挿入できます

ダッシュボード>設定>一般 の「サイトのタイトル」を反映させます

なんでこのタイトルなの?って感じですがとくに深く考えずつけてしまいました。。!

サイトのキャッチフレーズ ☆☆☆

おすすめガジェット紹介・使い方を解説

こちらは、ダッシュボード>設定>一般 の「サイトのキャッチフレーズ」を反映しません!
このブロックで入力したことが反映されるようです ややこしい‥

簡単な挨拶を登録してしまうのもありかもしれませんね笑
ただ、登録したフレーズを変更すると、サイトのキャッチフレーズブロック全てに反映されますので注意

クエリーループ ★☆☆ ↓下3つの記事が見出しにも反映

これ、凄いですが難しいです!
これまでウィジェットブロックで「最新の記事一覧」なんかを挿入できていたのですが、
そういう記事たちを「最新」ではなく「自分の好きな単語」などでまとめたものを、
一覧として表示させることができるよ という機能のようです!

これは若干説明が難しいので、機会をみて解説したいと思います
↓にクエリーループブロックを表示させてみました
「Apple」というキーワード「過去からさかのぼって」「3件グリッド表示」でソートした記事一覧です
背景グラデーションも試してみました

  • 愛用ガジェット

    スポンサーリンク クリックできる目次 愛用機材Apple製品キーボード・トラックボール(マウス不使用)PC周辺機器音響関係DTM機材機材を選ぶときの基準 愛用機材 Apple製品 iMac 24inch 2021 iPh […]

    続きを読む

  • 初投稿!

    新しくブログ運営を開始しました、ellie(えりー)と申しますこれからたくさん記事を書いていきたいなあと思っています!頭の中でいっつも「あれをしたいこれをしたい」とぐるぐるしていてそれらを全部形にしていきたい!っていうか […]

    続きを読む

  • Appleが好きすぎて株まで買ってしまった話〜Appleへの愛を語る

    スポンサーリンク クリックできる目次 Appleが好きすぎて初めての出会いは父が買ったmacだったこれまで使った製品現在使っているApple製品たちついにAAPL株を買いました今後欲しい製品おすすめの漫画や本I like […]

    続きを読む

かわいい!これは使いこなせたら楽しいのかもしれない‥
でも実際使うかな・・?!

投稿一覧 ☆☆☆ ↓下3つの記事が見出しにも反映

これも先程のクエリーループの「最新投稿」でソートしたもの、という風に考えましょう
先程のクエリーループと同じでこのようなアイキャッチを含んだもので、リスト表示 or グリッド表示が選べるようです(クエリループのが選べる種類は多かった)

  • PS5 音の可能性を引き出す|4K120Hzを維持しながらG One × DACで至高の音響環境を

    PS5 音の可能性を引き出す|4K120Hzを維持しながらG One × DACで至高の音響環境を

    朝から晩まで働き、唯一の休息は一人ゆっくりとPS5のゲームに向き合う時間… その時間、「音環境をグレードアップさせる」ことで更に心地よいものにしませんか?

    続きを読んでみる


  • STEPN日記 思い切ってB国参入・運営突然の発表〜STEPN-verse MADNESS編

    STEPN日記 思い切ってB国参入・運営突然の発表〜STEPN-verse MADNESS編

    この記事は仮想通貨で今まで損したことあり、 トレーダーでもなくブロックチェーンゲームにも明るくない一般人の日記です もちろん投資助言ではありません! むしろここ最近の流れは防風雨みたいな感じなので、 正直やめておいたほう […]

    続きを読んでみる


  • M1 MacBookでゲーム実況がしたい|3. どんなスタイルで実況するか?編

    M1 MacBookでゲーム実況がしたい|3. どんなスタイルで実況するか?編

    いざゲーム実況をやるぞ!と思っても意外と決めることが多いもの。有名な実況者をチェックして、自分に合ったスタイルを考えてみよう!

    続きを読んでみる


  • M1 MacBookでゲーム実況がしたい|2. どのゲームを実況するか?編

    M1 MacBookでゲーム実況がしたい|2. どのゲームを実況するか?編

    どうやらMacBook でもゲーム実況は出来るみたいだ、じゃあなんのゲームを実況してみようかな?好きなソフトをやればいい、そうなんだけどガイドラインとかも複雑で‥せっかくだから調べてみた!

    続きを読んでみる


投稿タイトル ☆☆☆ ↓下1つの記事が見出しにも反映

投稿タイトルを挿入すると、今回の記事の「投稿タイトル」を見出しH2で挿入してくれます↓

WordPress × Cocoon × Gutenberg|5. テーマブロック編

投稿の抜粋 ☆☆☆

出ました!「抜粋

「続き」ブロックが挿入されていないと↓この抜粋文は表示されません
どこまでが「抜粋」かを判断できないようですね

サイドバー>投稿>抜粋 に手入力したものでもいけます
↓は手入力の抜粋が反映されているようなので
手入力の抜粋のほうが、続きブロックより優先される、 ということでしょうか

手入力の抜粋です ※詳しくは本文で!

続きを読む、この記事なんだけどね

↑自動で「続きを読む」のリンクを生成してくれます、文字は好きに変えられます

でも、同記事内で、抜粋をもう一回使うってことあるのかな‥?

投稿のアイキャッチ画像 ☆☆☆

WordPress × Cocoon × Gutenberg|5. テーマブロック編

アイキャッチ画像が設定されると反映されます

アイキャッチ画像は、
右上の歯車マーク(設定)>投稿>アイキャッチ画像 からアップロードできます

投稿コンテンツ ☆☆☆

この「投稿コンテンツ」を挿入してしまうと、
この場所から、またこのページが1から始まることになります

↓↓↓1から始まる例

ウィジェットブロックも攻略しました!残すはテーマ・埋込・Cocoonブロックのみ
実は、今回のテーマブロックと次回の埋め込みブロックは、さらっと概要だけ説明だけして終わりにしようと思っています
そのくらい簡単です!種類が多いだけなので怖くありません

また、うまく表示されない・ちょっとよくわからないブロックも多々あったのですが
あまり使用頻度が高くなさそうなので深追いしていません_(._.)_

ではいってみよう!

‥怖いですね!ちなみにエディタ画面ではコンテンツの中身は表示されず、プレビューでは見えるようになります

どういうタイミングで使うかわかりません‥!

投稿者 ☆☆☆

投稿者を挿入できます
複数人で運営しているときは必要かもですね!

アイコンが表示されないのはなんでだろう・・

投稿日 ☆☆☆

そっか‥下書き開始したの2022年02月18日でした‥2ヶ月経っちゃってる!
投稿日を更新すると、このブロックも更新されます

投稿カテゴリー ☆☆☆

カテゴリを挿入できます
アイキャッチ画像と同じく、右上の歯車マーク(設定)>投稿>カテゴリにチェックを入れる

で設定できます

投稿タグ ☆☆☆

タグを表示してくれます
タグ付けしていない場合は空白になります

カテゴリと同じく、右上の歯車マーク(設定)>投稿>タグ入力

次の投稿 ☆☆☆

次の投稿へのテキストリンクを作成できます
「次」「次の投稿」など好きに記載できます

前の投稿 ☆☆☆

タイトルを含めることもできます

公開されていないと空白になったりします

基本的にはCocoonだと記事下部に
「前の記事」「次の記事」がタイトルとアイキャッチ画像付きで表示されているので、余り使うことはないのかなぁと思います

投稿コメント ☆☆☆

コメント

コメントが入ると反映されます!
コメントがないと空白になります

ログイン/ログアウト ☆☆☆

これは難易度が高そうです‥省略!

タームの説明 ☆☆☆

タームの説明
アーカイブを表示する際、カテゴリー、タグ、カスタムタクソノミーの説明を表示します。

すみません全然わからない‥省略!

アーカイブタイトル ☆☆☆

アーカイブタイトル
クエリーしたオブジェクトに基づきアーカイブタイトルを表示します。

これもわからない‥!省略!

おそらくこちらが関連記事?かなと思います

アーカイブ(インデックス一覧等)に特定の投稿を表示させない方法
投稿一覧リストに特定の投稿を表示させたくない場合の設定。

Post Author Biography (=著者プロフィール)☆☆☆

ついに英語になった!笑

ダッシュボード>ユーザー>プロフィール>あなたについて プロフィール情報
が反映されます

Avatar(=アバター) ☆☆☆

ellie Avatar

これをどこで設定するのか見ておきます!

Post Author Name (=投稿者名)☆☆☆

やったー!とりあえず終わり!
次の埋め込みブロックもサクサクいきましょう!

若干駆け足になって不明点も多くて申し訳ないです
しかし、これらの項目は記事執筆にはほとんど使わないということは伝わったのではないでしょうか?!
もし、活用事例がありましたら知りたいです

コメント

タイトルとURLをコピーしました