カテゴリ一覧の設定方法が知りたいな。
本日は、こんなお悩みにお答えします。
記事の内容
- カテゴリー一覧とは?
- AFINGER5「デザイン済みデータ」のカテゴリー一覧の設定方法
- おまけ|カテゴリ一覧を始めから作成する方法
- まとめ|AFFINGER5なら入れ替えだけでおしゃれなサイトが簡単につくれます
✔本記事を書いた人
ucozi(@ucozi_ikeda)
この記事を書いている私は、ヨガスクールで宣伝部長として働いています。
仕事を通じて得た情報をもとに、信頼性の高い記事をお届けしています。
本日設定するのはトップページの「カテゴリ一覧」。
つまりこの部分を設定していきます。
ちなみに今回も、WordPressの有料テーマ「AFFINGER5(アフィンガー5)」を使ったデザイン済みデータ「Tidy」の設定方法についての解説です。
AFFINGER5(アフィンガー5)ってナニ?という方や、デザイン済みデータのインストール方法について知りたい方は、こちらの記事からご覧ください。
カテゴリ一覧とは?
カテゴリーは直訳すると「分類」「分野」「種類」などといった意味があります。
その名の通り、記事を適切に分類してあげることで、読者が目的の記事を見つけやすくなります。
AFFINGER5(アフィンガー5)には、このカテゴリー分類を簡単に表示できる機能があるので、適切に使用することでより分かりやすいブログを作ることができます。
AFINGER5「デザイン済みデータ」のカテゴリー一覧の設定方法
AFFINGER5のデザイン済みデータ「Tidy」のカテゴリー一覧は、下記の3つで構成されています。
- 見出しカバー写真
- カテゴリー一覧(おすすめ記事一覧)
- 「Read More」ボタン
順番に設定方法を解説します。
設定01:見出しカバー写真の設定方法
見出しカバー写真の設定するには、以下のように進みます。
「AFFINGER5 管理」→「AFFINGER5 管理」をクリック
「トップページ」をクリック
「挿入コンテンツ」内の「テキストタブ」をクリック
※ビジュアルエディタでも作業はできますが、見つけやすいのでテキストエディタを使用します。
ページ内検索(※windowsの場合は「ctl」+「F」ボタン)で「backgroud_image」と検索
全部で4か所が該当すると思うので、使用したい画像のURLに書き換えます。
尚、今回使用する画像は、前回作成した「ヘッダーカードの設定方法」で使用した画像を使います。
画像のアップ方法やURLの確認については、下記の記事で詳しく解説しています。
見出しカバー写真の設定が終わったら、下部の「Save」または右上の「保存」をクリックします。
設定02:カテゴリー一覧(おすすめ記事一覧)の設定方法
カテゴリー一覧(おすすめ記事一覧)をカテゴリに入れ替えます。
手順は大きく3つです。
- カテゴリを設定する
- 記事を作成する(カテゴリを設定する)
- カテゴリIDを入れ替える
順番に解説します。
step
1カテゴリを設定する
まずは「カテゴリ」を設定しましょう。
「投稿」→「カテゴリー」をクリックします。
「新規カテゴリーを追加」から「名前」と「スラッグ」を入力し、「新規カテゴリを追加」をクリックします。
※スラッグとは
これを4カテゴリ分作成します。
今回はサンプルなので、「カテゴリa~d」としてますが、じっくり考えて設定してください。
設定できたら下記のようになります。
そしたら、「ID」部分をメモしてください。
サンプルでは下記のとおりです。
- カテゴリa:2
- カテゴリb:3
- カテゴリc:4
- カテゴリd:5
こちらは後ほど使用します。
記事を作成する
続いて記事を作成します。
詳細は割愛しますが、記事作成時に先ほど作成した「カテゴリ」のどれかをチェックしてください。
サンプルでは「カテゴリa」を選んでます。
カテゴリIDを入れ替える
続いて、カテゴリIDを入れ替えます。
設定は「見出しカバー写真」と同じところで行います。
ページ内検索(※windowsの場合は「ctl」+「F」ボタン)で、今度は「st-catgroup cat」と検索
デフォルトで「0」になっている部分を、先ほどメモしたカテゴリIDに入れ替えます。
カテゴリaなら「2」です。
全部で4カテゴリ分を入れ替えたら、最下部の「save」か右上の「保存」をクリックします。
「Read More」ボタンの設定方法
最後に「Read More」ボタンのとび先を設定します。
リンク先には各カテゴリ一覧のURLを設定しています。
各カテゴリのリンクは下記の手順で調べられます。
任意の記事をクリック
ぱんずくリストをクリック
サンプルでは「カテゴリa」の部分をクリックします。
「カテゴリa」の一覧が表示されますので、このページのURLをコピーします。
設定は「見出しカバー写真」と同じところで行います。
ページ内検索(※windowsの場合は「ctl」+「F」ボタン)で、今度は「st-mybutton-mini url」と検索
デフォルトで「#」になっている部分を、先ほどメモしたカテゴリURLに入れ替えます。
全部で4カテゴリ分を入れ替えたら、最下部の「save」か右上の「保存」をクリックします。
以上でデザイン済みデータのカテゴリー一覧の設定は終了です。
お疲れ様でした。
まとめ|AFFINGER5なら入れ替えだけでおしゃれなサイトが簡単につくれます
いかがでしたでしょうか?
AFFINGER5なら、今回紹介した「Tidy」以外にもデザイン済みデータが豊富に用意されています。
これらを使えば専門知識がなくても簡単におしゃれなサイトが構築できてしまいます。
ほんと便利ですよね。
本日はこのあたりで。
今回の記事が、皆さまのお役に立てれば嬉しいです。
本日も最後までお読みいただきまして、誠にありがとうございました。
ホームページの始め方を知りたい方へ
当ブログでは、「ヨガインストラクターのためのホームページの始め方」を紹介しています!
ヨガスクールの中の人が確実で信頼性の高い情報をお届けしていますので、これから始める方は、こちらの完全ガイドをぜひご覧ください!
また、AFFINGER(アフィンガー)というWordPressテーマの購入特典として、「ヨガインストラクターのためのAFFINGER設定マニュアル」という独自のプレゼントもご用意しています(※単体での購入も可)。
ホームページの始め方・立ち上げに関する、ご質問・ご相談はボクのInstagramのDM(@ucozi_ikeda)までお気軽にどうぞ!
WordPressのテーマ
『AFFINGER 6(アフィンガー)』
購入をご検討の方へ。
当サイトから『AFFINGER 6(アフィンガー)』をご購入いただいた方の特典として、「ヨガインストラクターのためのAFFINGER設定マニュアル」を提供しております。
※すでに『AFFINGER 6(アフィンガー)』を購入済みの方には、有料でも販売しています。
「ヨガインストラクターのためのAFFINGER設定マニュアル」では、デモサイトの設定について、テーマのインストールから細かい設定まで、全ての手順について解説しています。