検索一覧の表示とタグの使用

検索一覧表示の罫線の設定

記事も増えてきて、そろそろ公開しても良い感じになってきた今日このごろ

ウイジェットでメニューの下にサイト検索を追加して、検索のテストをする。検索結果の一覧に罫線が設定されていなかったので、cssで設定を追加する。各カテゴリーごとに罫線の色分けはしてあったので検索の一覧ではグレーにする。

/* ボックスの罫線　基本 */
.article__container {
border: solid 2px #666666;
}

タグの使用

当初はカテゴリー「うぇぶ万覚帳」の下に子カテゴリーで「プラグイン」と「カスタマイズ」を設定していたが、このサイトではページ送りの「次の記事」「前の記事」を該当カテゴリー内の記事にしているので「プラグイン」と「カスタマイズ」でカテゴリーを分けるとweb関連の記事の繋がりが、解り辛くなると思ったのでタグに変更する事にする。
タグ記事の一覧でもカテゴリー「うぇぶ万覚帳」の表示と同じになるように罫線の色など設定する。

cssはこんな感じ。

/* プラグイン tag-plug-in */
.tag-plug-in div .article__container {
border: solid 2px #4466ff;
}
.tag-plug-in h2 a {
color:#4466ff;
}
.tag-plug-in h2 a:hover {
color:#000000;
}
/* カスタマイズ tag-customize */
.tag-customize div .article__container {
border: solid 2px #4466ff;
}
.tag-customize h2 a {
color:#4466ff;
}
.tag-customize h2 a:hover {
color:#000000;
}

タグをアイコン表示に

タグの使用は考えていなかったので設定していなかった。表示が「TAGGED」となっている。

これをアイコンに変更しよう。
single.phpを編集。元のコードはこんな感じ。

$tags = get_the_tags();
if (!empty($tags)): ?>
<div class="entry__meta-box meta-box--tags"><span class="meta-box__title"><!--?php _e('Tagged', 'border_txtd') ?--></span>
<ul class="nav nav--keywords inline">
 	<li style="list-style-type: none;">
<ul class="nav nav--keywords inline">

これを変更。’Tagged’を’＜i class=”fa fa-tags”＞＜/i＞’に書き換える。

$tags = get_the_tags();
if (!empty($tags)): ?>
<div class="entry__meta-box meta-box--tags"><span class="meta-box__title"><!--?php _e('&lt;i class="fa fa-tags"&gt;&lt;/i&gt;', 'border_txtd') ?--></span>
<ul class="nav nav--keywords inline">
 	<li style="list-style-type: none;">
<ul class="nav nav--keywords inline">

タグのアイコンが表示されました。

これから、サイト構築でメモしたことなど記事にしていくので仕様をきっちり決めておかないといかんな。