hati_8さん
質問内容とそれますが、トピックスのタイトルが消えてしまっています。
お手数ですが
- 消える前に入れていたタイトル(覚えている範囲でもかまいません)
- 何か気づいたこと
をお教えください
こちらに記入させていただきます。
入力していたタイトルです。
「 新着記事表示にカテゴリー名を色分けして表示する方法(複数カテゴリーに所属している場合) 」
タイトルと本文を入力し、投稿ボタンを押したところタイトルだけが反映されなかった様子でした。
タイトル長かったんですかね・・・
ありがとうございました。助かりました!
こんにちは、
特別な関数を使っているようですが、そのような関数を使わなくてもちょっとした工夫で配色は可能です。
自動配色のサンプルを下に書いておきますので、工夫してみてください
<div style="border:1px solid #ccc;padding:20px;background:#000;">
<?php
$opecity = 1;
$category_count = 20;
$categories = get_categories( array ( 'number' => $category_count ) );
$html = '<span class="cat-figure indv-color-%1$s">%2$s</span>';
$css_b = '.indv-color-%1$s{ background: rgba( %2$s, %3$s, %4$s, %5$s);}'."\n";
$css_f = '.indv-color-%1$s{ color: %2$s; }'."\n";
$define_style = '';
foreach ($categories as $key=>$category) {
printf( $html, $category->term_id, $category->cat_name );
$color_value = intval( ( 255 / $category_count ) * (int) $key );
$define_style .= sprintf( $css_b, $category->term_id, $color_value, $color_value, $color_value, $opecity );
if( $color_value > 180 ){
$define_style .= sprintf( $css_f, $category->term_id, '#000' );
} else {
$define_style .= sprintf( $css_f, $category->term_id, '#fff' );
}
}
?>
<style scoped>
.cat-figure{
padding:3px;
margin:3px;
border-radius:5px;
display:inline-block;
border:1px solid #999;
}
<?php echo $define_style;?>
</style>
</div>
テンプレートの適当な場所に貼り付けてみてください。
そういえば、そういう記事を以前書いたことがあったのでした。
WordPressのカテゴリー編集画面にカラーピッカーをつける
http://gatespace.jp/2012/09/28/add-extra-fields-for-category/
もっとも書いたときのバージョンが古いので、カラーピッカー部分は最新版で検証していません。
ただ、表示部分のロジックは参考になるかと思います。
返信遅くなってしまい大変申し訳ありません。
nobitaさん、gatespaceさんありがとうございます。
カラーピッカーの記事は調べている最中に拝見させていただき、こんな便利なことがあるんだ!
と思ったのですが、今回のクライアントが親切で機能をつけるとどんどん追加要望が後からでてくるんで、この使用でやってください!の最低限でいこうかと・・
あっちで増やせるようにしたらカテゴリーを細分化して100くらい作られそうなので。
で、本題なのですがnobitaさんに提示して頂いた自動配色のサンプルを自分なりに使用してみました。
これも便利な機能だな、と感激していたのですが先方からのダメ出しと変更が。。
・カテゴリー名は白文字表示で文字バックの色を指定した色に変える。
・記事を書いた時に選択したカテゴリ名がタイトルの上に全て横並びに表示される。
・新着記事の表示件数は新着順にタイトル、日時、本文(120文字)、サムネイル付きで4件表示。
といった仕様で落ち着きそうです。(変更かからなければ)
といったところで振り出しに戻ってしまいました。
slugを使いカテゴリー名にCSSを適用させるといったイメージで作っていたのですが、
2つ以上のカテゴリーに所属している記事を呼び出したときにカテゴリー名毎にCSSを適用させるイメージができません。
(同時にslugを全て呼び出してしまうので、カテゴリー名に適切なslugを適用できない)
nobitaさんのコードを参考にもう少し色々と調べて考えてみます。
続けて、ただ単純にカテゴリー名の文字背景に色付けして、さらに複数のカテゴリー名を色分けして表示する方法でもっと別の方法がありましたら情報やヒントお願いいたします。
まだまだ理解できてない部分も多いので勉強させていただきたいと思いますのでよろしくお願いいたします。