WEB関連 WordPress

WordPressテーマ「Stinger3」とプラグイン「WordPress Related Posts」でチェック画像の表示が重なる件

こんばんは、ぶんちょうです。

以前から地味に且つ確実に気になっていた件、自己解決しましたので方法を掲載します。

素朴な問題過ぎるのかしてネット上で探せませんでしたが、結構同じ症状のブログをよく見かけます。お困りの方は是非参考になさって下さい。

課題

WordPressでプラグイン「WordPress Related Posts」を入れたが、「関連記事」というタイトルがチェックマーク画像と重なって表示されてしまう。

ちなみにテーマは「Stinger3」です。

症状

・パソコンブラウザ画面において「関連記事」というタイトルがチェックマーク画像と重なって表示されてしまう。なんかいやだ。
relatedpost_kasanaru

 

対応策

まず、「WordPress Related Posts」が使っている「h3タグ」のあたり、スタイルシートが原因なのは明白ですが、どこにあるのやらさっぱり。

ソースを見ると以下のように「related_post_title」というクラスを編集すれば良さそうですがなかなか見つかりません。

少なくともテーマの管理画面にはなさそうです。。。

 

解決方法

CSSファイルのありか

Chromeのデベロッパーツールでちくちくして、見つけました。

www.●●●.jp/wp/wp-content/plugins/wordpress-23-related-posts-plugin/static/themes

をFTPソフトで開いて「vertical-m.css」を編集します。※Wordpressの管理画面からはたどり着けません。

ftp_relatedpost

編集内容

おそらく冒頭にある「padding〜」を行削除します。これだけです。

importantと注釈がありますが今のところ問題は起きていません。もちろんモバイル側にも影響はありません。

vertical-m_css

 

まとめ

「Stinger3」に限らず、デザイン的によくあるパターンですので別のテーマをお使いの方も使える手だと思います。

今回はプラグイン側を編集したので「WordPress Related Posts」がバージョンアップした際にはまた治さなければならないかもしれませんが(子テーマ作ればいいんかいな?)、ともあれ分かってしまえば簡単なことですのでどうぞお試し下さい。

また、ついでに言うようで大変恐縮ですが、「Stinger3」という素晴らしいテーマをご提供下さり、作者様には大変感謝しております。ソースがきれいなので私のような若輩者も頑張れます。これからもどうぞよろしくお願いします。

最後までご覧頂きありがとうございます。ほかにもワードプレス関連記事や都内お出かけ情報などもありますので是非ご覧下さい。

 

 

オニオン座のオススメ記事

1

この記事では、Amazonプライム会員になるメリットとデメリットを整理してご紹介します。配送料無料やAmazonビデオ、Amazonミュージックなどのサービスははたして会費に見合うものなのでしょうか。 …

2

先日、スマホで使えるAudible (オーディブル)というオーディオブックサービスが1ヶ月無料という情報を聞いたので、実際に申し込んで本を購入してみました。ついでに解約方法も確認しておきました。 この …

3

このブログ「オニオン座」では、便利グッズや役立ちアイテムのレビュー記事を掲載しています。普段から自腹で購入したグッズで気に入ったものしか紹介していませんが、そのなかでも今回は「Amazonで買って良か …

-WEB関連, WordPress
-, ,

Copy Protected by Chetan's WP-Copyprotect.

Copyright© パパママ世代応援ブログ:オニオン座 , 2019 All Rights Reserved.