外部リンクを「はてなブログカード」に置き換えて表示させるWordPressプラグイン「Pz-HatenaBlogCard」を公開しています。
WordPressテーマによっては、サムネイル画像やファビコンまわりがズレて表示されてしまうようです。
[2015/08/22追記]公式プラグインディレクトリにて公開しました。ダッシュボードからインストールやバージョンアップが行えます。
テーマ付属のスタイルシートで画像に枠が付けられる
「STINGER3」や「賢威」といったWordPressで表示がズレていたようです。
この不具合は、ver1.0.2で対応しました。
[linkurl=”https://popozure.info/20150810/8065″]
対応はしたものの「新しく追加したパラメータ」なので、古いバージョンから使っていただいている方は、設定が「無効」になっています。
対処方法
WordPress管理画面の「設定」→「Pz ブログカード」から設定画面を開き、「CSSリセット（img）」という項目にチェックを入れて、「変更を保存」を押してください。
既にチェックが入っていた場合にも、「変更を保存」を押すことで、CSSファイルが再作成されて、表示が直るはずです。
原因
詳細は「ver1.0.2の記事」に書いたとおり、特定のテーマでは、スタイルシートで画像に対して「太目の枠」を付けたり、「下の余白」を付けたりします。
これは、サイト全体のデザインのためだったり、「画像であること」を分かり易くしているものですが、これがカードの中のファビコンなどにも適用されてしまったため、枠が付いたり余白ができたりしてしまいました。
なお、外部リンクに関しては「はてなブログカード」に置き換えているだけであり、はてなブログカードはiframeという仕組みを使っているからか、自サイトのスタイルシートに影響を受けないようです。
同じ内容の記事ではありますが…
今回、内容的には「ver1.0.2の記事」と同じことを書いてしまいましたが、先の記事は、「プログラムの更新」をお知らせする書き方だったので、今ひとつ自分の不具合とむすびつきづらいかと思いました。
「サムネイルとファビコンに枠が付いてズレちゃう！」というアプローチで書いてみました。
このようなテーマを使っていて、「自分で画像を置いたら枠が出ちゃって困る！Σ(ﾟロﾟ)oﾞ」という場合には、強制的にstyleを指定してあげると良いかも知れません。
<img src="https://popozure.info/favicon.ico">
↓
「img」タグに「style=”margin: 0; border: none;”」を追加して、余白と枠を無くす。
<img style="margin: 0; border: none;" src="https://popozure.info/favicon.ico">
↓
では(^-^)o
コメント