Simplicity2の設定(タグ・カテゴリーの表示変更)

こんばんはヤス虎です(*’▽’)

Simplicity2設定の覚え書き、タグ・カテゴリー編です。

スポンサーリンク
広告336

内容 タグ・カテゴリーの表示変更

初期設定のままですとタグとカテゴリーの表示がテキスト表示でなんか味気ないので少しボタンみたいな感じに変更します。

タグはタグ付けの多いタグほど文字が大きくなるので大きさが変わらない様にして、ついでに表示順も変えます。

カテゴリーは並びが縦に一列表示なので横並びに変更します。

タグの変更

functions.phpに下記コードを書き込みます。

//タグクラウドの設定変更
function tag_cloud_customize($args) {
    $myargs = array(
        'smallest' => 9, 	//最小フォントサイズ
        'largest' => 9,  	//最大フォントサイズ
        'orderby' => 'name', 	//表示順(名前)
        'order'   => 'DESC', 	//ソート順(降順)
    );
    $args = wp_parse_args($args, $myargs);
    return $args;
}
add_filter('widget_tag_cloud_args', 'tag_cloud_customize');

style.cssに下記コードを書き込みます。

/*タグクラウドのスタイル */
.tagcloud a {
    display: inline-block;
    margin-bottom: 5px;
    padding: 6px 12px;
    color: #FFF;
    text-decoration: none;
    border-radius: 2px;
    border: 1px solid #e6e6e6;
    background: #0072c6;
}

.tagcloud a:hover {
    transition: 0.3s;
    color: #7db4e6;
    background: #EFEFEF;
}

カテゴリー変更

style.cssに下記コードを書き込みます。

/*カテゴリーのスタイル */
.widget_categories ul {
  margin-left: -16px;
}

.widget_categories li {
    display: inline-block;
}

.widget_categories a {
    font-size: 12px;
    display: inline-block;
    margin-bottom: 5px;
    padding: 6px 12px;
    color: #FFF;
    text-decoration: none;
    border-radius: 2px;
    border: 1px solid #e6e6e6;
    background: #0072c6;/*#7db4e6;*/
}

.widget_categories a:hover {
    transition: 0.3s;
    color: #7db4e6;
    background: #EFEFEF;
}

以上でこんな感じに表示されます。

まとめ

実際、見た目でフォントサイズやら細かな設定をしてるのでカテゴリーとタグが同じ大きさでない様な気がしますが気にしない事にします。(^_^;)

では、最後に間違っているかもしれないので試す人は自己責任でお願いします。

スポンサーリンク
広告336
広告336

シェアする