ホーム画面を固定ページにする方法。カテゴリー別表示

スポンサーリンク

ホーム画面をとりあえず変更したい。ブログを見に来てくれた人が分かりやすいように、関連記事を探しやすくなるようにカテゴリー別に表示したいって方のための記事ですよ。何も分からない状態ではじめ、ホーム画面をカテゴリー別表示にする方法・・・一番戸惑いました。さっぱりわかりませんでした。なぜわからなかったか?先人の方たちが見ていた画面と私の見ている画面が全く違うのです。ネットで調べると上の方に沢山の項目がありました。私のには全くない。なぜ?勝手にいきついた結果ですが、ネットはどんどん更新されています。このCocoonのプログラムもどんどん変更されているのだと。見たまま編集に近い形に変更したのではないかと、思いました。でもね、やっている人にとっては分かりやすくても、やったことのない人には画面が違う!ってなるんですよ。。。。そこで、2019年1月後半からブログを作り始めたわたしが、今から作るよ!さっぱりだぜ!って方にあつかましくも説明します♪

まずは私が一番戸惑った固定ページの編集です。

カテゴリーごとに表示させたいので、ネットで調べました。出てくるんですよね。これをはりつけるだけで私の何日間の努力の形が手に入ります!って。私もやってみましたよ・・・まず編集画面の見た目が全く違うので、さっぱりできません。それで頑張ってみましたが無理でした(笑)

これは私のホーム画面の一部ですが、ちゃんとカテゴリーごとに表示されています!ここまでくるのに本当に「??????」だらけでした。さあ、まずは初歩の初歩!この状態の固定ページを作りましょう!

固定ページの前に自分のブログの記事のカテゴリーを作っておきましょう!それがないと固定ページで入力する文字列が分かりません。カテゴリーを作る方法は左のバーにある投稿からカテゴリーを選択しカテゴリー名をつけるだけという簡単設定です。後でカテゴリーごとに表示するためにカテゴリーを編集した時に上に表示されるアドレスのID=4←この数字はカテゴリーごとに変わってくるので、覚えておくか後でまた表示させて確認してください。

さぁ!固定ページをさくっと作ってしまいましょう~画面上の方に「+新規」という項目があるので、そこを選択。固定ページを選択します。

さて・・・でたのではないでしょうか?びっくりするほどまっさらのページです。

予定と違う。と思ったでしょ?私も思いました。ここからどうすればいいの????と。

でも知ってしまえば意外と簡単でしたのでどうぞ~!!!!!

まずはよくわからないのでタイトル記事を付けます。とりあえずでいいので、なんでも。私はいまだによくわかっていないのでカテゴリー別新着記事と入れています。


ここでプラスのマークを探して下さい。そこに「カラム」というものがあります。それを押すと画面が縦に2分割した状態で表示することができます。パソコンでは私のホーム画面のとおり2分割表示でスマホで見ると分割では小さくなって見にくいので勝手に分割されず縦にならんで表示されていました。

カラムを使って2分割できたら、先ほど表示されていた+マークが右側と左側の2か所に表示されるようになります。この+マークは常に出ているものではないので、このへんかな?と思うところにカーソルを合わせてみてください。ピョコっと表示されるはずです。

表示したい情報を+マークを押して表示させると言う仕組みのようです。

①カラムで2分割する。

②+マークを探してカテゴリーの見出しをつける。

③ショートコードを選択して、カテゴリーごとに表示させるショートコードを記入する。

↑たっとこれだけの作業でした。


new_list count=3 cats=7 type=default children=1

↑このショートコードを[]でかこむと反映されるようになります。[]を入れてしまうと文字として表示されないので[]を抜いています。使用する時は[]で囲んでくださいね。

さて、このコードの中に数字と訳の分からない英語?が出てきます。最初のカウント=3は表示させたい記事数だそうです。基本的には5記事までだそうで。私のブログは出来て間もないので3にしています。

catsと言うのがカテゴリーのアドレスに表示されている数字になりますので、こちらは自分がカテゴリーを作った時に表示されているアドレスをみて記入してください。上記でも説明したアドレス内にあるID=4←この数字です。

typeというのが表示形式です。記事のアイキャッチを前面に表示する方法。私のようなアイキャッチの横に記事のタイトルが表示される方法などがあります。

Cocoon本家のわいひらさんが分かりやすく説明してくれています。↓下記リンクを参照してください。

新着記事一覧を表示するショートコードの利用方法
新着記事ウィジェットのようなリスト表示を実現できるショートコードの利用方法です。

さぁて!初歩の初歩!メイン画面に設定する固定ページができ上がりましたので、次はメイン画面に設定する方法です。↓の記事を参考にしてください。

コメント

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