賢威8にbbpressを入れて画面が乱れたときの対処法

質問

シルエット


賢威8にbbpressを入れたら、返信した内容が表示されません。
何か対処法は、ありませんか?

※この質問は、私(ケーちゃん)が実際に遭遇したトラブルに対して、行ったことを元に作成しています。

ケーちゃんケーちゃん

お答えします!

bbpressとは、簡単にWordPress上でフォーラムや掲示板を始められるプラグインです。
このサイト(https://affi-sapo.com/)でも、質問受付用として活用しています。

そんなbbpressですが、賢威8に入れたところ、少し困った事態に遭遇しました。
それがこちらの画面。

賢威8にbbpressを入れて表示が乱れた返信画面

本来なら(2)の位置に入る2回目の返信が、画面の一番上に飛び出しています。
さらに(1)に表示されるはずの、1回目の返信が消えています。

原因はcssの競合

調べてみたところ賢威8で設定しているcssのクラスが、bbpressでも使用されていました。
そのためbbpress側で意図していない位置に、返信が表示されてしまっているようです。

問題のcssがこちら。

  • .reply {
  • position: absolute;
  • top: 15px;
  • right: 15px;
  • font-size: 1.2rem;
  • }
AFFS Simple Code Viewer
Copy

これを、bbpress上では無効になるように設定してあげれば解決です。

次のcssを、カスタマイズのcss追加などに入力します。

  • .reply {
  • position: relatibe;
  • top: auto;
  • right: auto;
  • font-size: 1.2rem;
  • }
AFFS Simple Code Viewer
Copy

font-sizeは、お好みで変更してください。
削除しても大丈夫です。

これで、正常に表示されました。

賢威8にbbpressを入れて表示が乱れた返信画面(修正後)