ふと、「カテゴリーの色も変えれたらいいですよね~」とうかつなことを言ってしまったので、Ignisテーマをカスタマイズすることになりました。
ワードプレスの中でもIgnisは写真を扱っている人には使いやすいテーマじゃないでしょうか。
ちなみに
メインの「I'm a designer」とかを消したい場合
.ignis-hero-area has-media をdisplay:none; にしてあげてください。(メディアクエリ only screen and (max-width: 1024px) がスマホ用なので、それもdisplay:none;に)
あと、探ってわかったのは、
カテゴリ―別表示は
archive.phpに記載されていますね。
archive.phpのループ部分のポストは、カスタマイズ用っぽいフォルダの下にあるphpでした。
・・・・・・・・・・・・・・・
投稿ページのほうのカテゴリ―が表示される場所
Ignis: content-single.php (template- parts/content-single.php)
<footer class="entry-footer">
<?php ignis_show_cats(); ?>
<?php ignis_entry_footer(); ?>
</footer><!-- .entry-footer -->
・・・・・・・・・・・・・・・
・Aタグでクラス名が吐き出せるようにすればいいかな…、は×
・なぜなら、二つタグが並んだ時色が変えられないから
・ページIDのクラス名とのand指定も同じ理由でだめ→Wordpressは、bodyタグにカテゴリー名のクラスが割り振られるようにすることができます。例えば以下みたいな感じ。ここでcategory-8をとるとか、できます。ページIDの取得もできます。
body class="archive category category-news category-8 hfeed sticky-header"
解決:プラグイン「Advanced Custom Fields」とfunction.phpで解決
結果的に、プラグインはこちらを入れました。
参考:
ものすごくわかりやすいです。
ちなみに、このプラグインだけだとIgnisでは自動ではカラー変更されません。
なので、function.phpに、
function ignis_show_cats() {
$cats = get_the_category();
if(!empty($cats)){
if(!is_wp_error($cats)){
foreach($cats as $cat){
$cat_link = get_category_link($cat->term_
$cat_name = $cat->name;
$cat_id = $cat->cat_ID;
$cat_color = 'category_'.$cat_id;
$back_color = get_field('ca_color_band',$
$txt_color = get_field('ca_color_txt',$cat_
echo '<p class="category"><a href="'.$cat_link.'" style="background-color:'.$
}
}
}
}
こちらを追加してください。先ほどcontent-single.phpで見た部分の「 ignis_show_cats() 」が入っていますね。
後自分はcssに
- padding: 1px 8px;
- display: inline-block;
- margin: 0 2px 2px 0;
- border-radius: 5px;
これを追加しました。
こんな感じで、カテゴリーごとに色を付けることが「Ignis」でもできました。
今日はこんな感じです。