Simplicityと「bbPressフォーラム作成プラグイン」を併用するときにstyle.cssに貼り付けるとデザインが整うスタイルシート

このサイトでは、bbPressを使ってフォーラムを作成しています。

ただ、Simplicity＋bbPressプラグインでフォーラムを作成すると、ちょっとした事ではありますがデザインが崩れたり、文字が薄かったり小さくなりすぎたり（bbPressの仕様ですけど）してしまいます。

これを修正するスタイルを自分用に書きました。けどせっかく書いたので、「誰かbbPressインストール時に自分と同じ違和感を感じるかもしれない」ということで紹介したいと思います。

bbPressの設置方法は以下を参照してください。
意外と簡単に作れるWordPress掲示板「bbPress」プラグインの使い方

現在このスタイルは、Simplicityデフォルトのスタイルに組み込まれています。

スタイルが崩れる例

例えば、bbPressフォーラムは、投稿ではないので作成日が表示されなくなります。あと、検索フォームの高さがおかしくなります。

トピックをクローズすると、文字が薄すぎて読みづらいです。

書き込んだ文章の文字が小さすぎて読みづらい。

なんて事になります。

Simplicity＋bbPressのスタイル修正

上に書いたようなSimplicity＋bbPressのスタイルを修正するには以下のスタイルをテーマ（子テーマ）のstyle.cssにコピペして追記するだけです。

/*SimplicityでbbPressのスタイルを整える*/
.bbp-breadcrumb-home,
.bbp-breadcrumb-home+.bbp-breadcrumb-sep,
.topic .post-date,
.topic .post-update,
.topic .footer-post-meta,
.post-0 .post-date,
.post-0 .post-update,
.post-0 .footer-post-meta,
.forum .post-date,
.forum .post-update,
.forum .footer-post-meta{
    display: none;
}

#bbp_search{
    font-size: 17px;
    height: 28px;
}

.post-0 .post-meta{
    height: 27px;
}

.bbp-reply-content{
    font-size: 16px;
    line-height: 170%;
}

.bbp-forum-title{
    font-size: 16px !important;
}

.bbp-topic-permalink{
    font-size: 14px !important;
}

#bbpress-forums .status-closed,
#bbpress-forums .status-closed a {
    color: #555 !important;
}

style.cssの編集は、Wordpress管理画面から「外観→テーマの編集」からでも行えます。

細かなスタイルの調整は、運営サイトを見ながら行ってください。

適用後のスタイルは、フォーラムを参照してみてください。

まとめ

そもそも、Simplicity＋bbPressを使うことはあまりないので需要はないと思います。

けれどももし、bbPressをインストールしてみて、表示に違和感があったら上記のスタイルを試してみてください。