【コピペOK】WordPress related Postsプラグインの「Modern」の表示崩れを直す

表示いきなり崩れてる！

WPの記事ページに関連記事をスマートに表示してくれるプラグイン「WordPress related Posts」。

設定も簡単だしワーイってなったのもつかの間、よく見るとむっさ崩れています。

きっと皆さんも設定後に表示崩れで困ってここにたどり着いたのではとお察しします。

こんな感じ↓

clearfix完全に効いてない。。。

これは微妙すぎます！

 

ということで、とりあえずコピペでCSSを上書きしちゃいましょう。

.wp_rp_content .related_post li { 
overflow:auto!important;
display:block!important;
clear:both!important;
margin:10px 0!important;
border-bottom:1px dotted #666!important;}

.wp_rp_excerpt {
	display: block;}

無理やり上書きしてます。

元のcssも!importantで強気の姿勢なので、

こちらは「.wp_rp_content」という親要素から継承させることで優先順位を上げつつ、!importantで上書きしました。

 

その結果はこちら

はい！完璧です。

 

設定で本文も表示させたところ、これまた微妙で、「タイトルの横にそのまま表示！？」

適当すぎませんか？もっといいプラグインないんすか？？

取り急ぎwp_rp_excerptにclear指定して、タイトルの下に抜粋が表示されるようにしました。

必要ない方はこのクラスはスルーしてください。

 

というか！

正直「Modern」以外も微妙だけど

他のスタイルも試しましたが、widthがpx指定なので、どんなスタイルを選んでも、

はみ出す

余る

このどっちかで、見た目が超微妙。。。

レスポンシブサイトに組み込むことがほとんどなので、modern以外のスタイルはほぼ使えない。

組み込んでテストしてみても、クライアントに出せるレベルではなかったです、はい。

僕はもっぱらリスクも少なく見た目もいい感じの「Modern」推しです！

 

ちなみに他に困る点として、「Two Columns」を選択するとChromeでエラーがでるというのも多く見かけます。

Chromeが落ちたり、エラーでページが開けなくなったりと、いろいろあったらしいです。

今入れているバージョンは3.6ですが、「Two Columns」を採用したところ、右側の記事のみサムネイルが表示されない、という謎のエラーでした。

もちろん直せなかったですよ（笑）