「ただいま」の挨拶よりも電源スイッチONのが先な、そんな日常を綴る『ぽぽろんのパソコンつれづれ日記(ぽぽづれ)』へようこそ。XP/Vista/7の話題。2015.08.10外部リンクを「はてなブログカード」に置き換えて表示させるWordPressプラグイン「Pz-HatenaBlogCard」を公開したところ、さっそく反応をいただきましたので、もうひとつ修正しました。[2015/08/22追記]公式プラグインディレクトリにて公開しました。ダッシュボードからインストールやバージョンアップが行えます。Pz-HatenaBlogCardhttps://popozure.info/pz-hatenablogcard外部リンクを「はてなブログカード」に置き換えて表示させるWordPressプラグイン「Pz-HatenaBlogCard」を公式プラグインディレクトリにて公開しています。※更新があった場合には投稿記事でお知らせするとともに、このページの使い方を更新していきます。画像がズレる!WordPressテーマをインストールしてみる画像の周りに枠を表示してくれるテーマダウンロードとインストールメモ画像がズレる!「サムネイルを左側にすると、説明文にサムネイルが重なって表示されていまう」という報告をいただきました。URLを教えていただいていたので、確認したところ、画像の周りに太目の「枠」が付いていて、それが原因で表示位置がズレてしまって、結果記事にかぶってしまっているようです。「ファビコン」の周りや、「はてな数」が表示される辺りにも、水色の箱が表示されている状態でした。WordPressテーマをインストールしてみるこちらの方のサイトでは、「DeepJaggy-threeColumn」というWordPressテーマを使用いるようでした。このテーマは「STINGER3」を元にして、サイドバーを追加して3カラムにしたテーマのようです。原因の切り分け/現象確認のために「DeepJaggy-threeColumn」をインストールしてみようと思います。テスト環境にインストールして、サムネイル画像を左側に表示するように設定してみます。うちのサイトでも同じ現象が出ました。うちのサイトのタイトルに「つれづれ(ズレズレ?)」とあるとおり、ズレズレです。(よく分からない宣伝)サムネイル画像、ファビコン、はてな数のところにも枠があります。サムネイルを右側にしても、画像の右側と下側が切れてしまっています。Chromeでファビコンを右クリック、「要素の検証(N)」をしてみます。ファビコンが表示されている領域を見てみると、padding(緑の部分)とmargin(橙の部分)が追加されているようです。画像の周りに枠を表示してくれるテーマ背景が白い画像とか、テキストエディタの画面を貼ったものとかは、そのままだと境界が分かりづらいため、画像に枠を付けてくれるテーマやプラグインがあります。そもそもSTINGER3が太目の枠を付けてくれるので、それに準じてDeepJaggy-threeColumnも画像の周りには太目の枠が付いています。スタイルシートを見てみます。225行目で記事中の画像の下側に20ピクセルのマージンを設けていました。100%!important;}1,476行目で記事中の画像のまわりに10ピクセルの薄い水色の枠を付けていました。#ddd;}とりあえず、実験的に「pz-hatenablogcard-style.css」の先頭に、paddingとかの設定を書いてみます。none;}どうやらさくっと直りました。ファビコンとドメイン名、サイト情報の間はmarginとかで調整していたので、ぴったりくっ付いてしまいました(^-^;お行儀が良いかどうかは別として、ファビコンとドメイン名の間は「&nbsp;」を入れて感覚を調整しました。設定画面に「imgのCSSをリセットする」オプションを付けて、CSSリセットしないようにできるようにしました。初期設定ではチェックが付いた状態になっています。テーマのstyleに合わせた方が見栄えが良い場合にはチェックを外してください。古いバージョンのプラグインをインストールしていた場合、チェックが付いていない状態でCSSファイルが作成されている場合があるので、「変更を保存」を押してCSSファイルの作成を行ってください。ダウンロードとインストールVer1.1.0から、公式プラグインディレクトリからインストールが行えるようになりました。詳しい使い方などはこちらのページから。Pz-HatenaBlogCardhttps://popozure.info/pz-hatenablogcard外部リンクを「はてなブログカード」に置き換えて表示させるWordPressプラグイン「Pz-HatenaBlogCard」を公式プラグインディレクトリにて公開しています。※更新があった場合には投稿記事でお知らせするとともに、このページの使い方を更新していきます。外部リンクの...「最新版だとうまく動かない」など、このときのバージョンが良い場合、こちらからダウンロードしてください。↓ZIPファイルダウンロードサイトからのダウンロードは終了しました。プラグインディレクトリからのインストールをお願いします。メモ反応があるとついつい速攻直したくなる。使ってくれる人がいるのがやっぱり嬉しい。WordPressプラグインディレクトリに登録したい。→苦戦中Twitterとかでバージョンアップ告知してみたくなってくる。コピーぽぽろんをフォローする2この記事を書いた人ぽぽろん「ただいま」の挨拶よりもパソコンの電源を入れる方が先なパソコンおたく。プログラミングもするけど、パソコンを触っていること自体が趣味。ぽぽろんをフォローする2ぽぽろんぽぽづれ。関連記事Pz-HatenaBlogCard[Pz-HBC][1.2.7]はてブカードを表示するプラグイン更新。不具合修正と、Pz-LkCのご案内。外部リンクを「はてなブログカード」に置き換えて表示させるWordPressプラグイン「Pz-HatenaBlogCard」。ver1.2.7を公式プラグインディレクトリにて公開しました。ぽぽろんPz-Talk[Pz-TLK][1.0.0]顔アイコンと吹き出しで会話を表現するプラグイン作ってみた顔アイコンと吹き出しを表示して会話を表現するWordPressプラグイン「Pz-Talk」を公式プラグインディレクトリで申請中です。