大きなカスタマイズはとりあえずこれ以上やる気はありませんが、写真の上下に無駄にマージンというか余白が空いてる部分が多いんでなんとかしたいなぁとずっと思ってたので実行に移すことにしました。
基本的な原因は画像の[/caption]や地図リンクで使ってるプラグインExifographyのショートコード[exif id=”xxxx”]の後に改行を入れちゃってたためでした。そのせいで画像の下に無駄な余白が入ってました。
この無駄な改行をまとめて削除するのにSearch Regexというプラグイン使って試行錯誤してみましたが全然うまくいかない。検索の仕方間違っとるのか?データベースの中身はいったいどうなっとるんだと言うことでとりあえずダウンロードしてみました。
データベースの中身を見てみると[/caption]や[exif id=”xxxx”]の部分は
[/caption]\r\n
や
[exif id=\”xxxx\”]\r\n
となっています。\r\nが改行と言うことですね。確かに\rなんてのは検索語に入れてなかったなぁ。
で、Search Regexで改めてやろうかなとも思いましたが、データベースの中身が判明したのでデータベースの管理画面phpMyAdminの置換機能を使った方がいいんじゃないかと言うことでphpMyAdminを使うことにしました。まとめて置換したいだけなのでSearch Regexじゃなくても問題なし。
例えば[/caption]\r\n を [/caption] に置換することで[/caption]の後ろの改行部分が無くなります。改行が複数ある場合は繰り返せばいいだけですね。これで画像の下の変な余白は解消。真似したい人はバックアップは取っときましょうね。復元の予行演習もしといた方がいいかも。
ちなみに[exif id=\”xxxx\”]\r\nの方だとちょっとややこしくて、xxxの部分がバラバラなので正規表現は使いたくないってこともあり\”]\r\nとなっている部分を検索するだけにしました。これでも私のブログの無関係の場所に影響がないのは確認済み。これを置換後は\”]にしたいんだけど、データベースだと「”」の前には「\」がくっついていますが、置換後の文字列に入れる必要はないようです。
今回の置換は正規表現使ってませんが、正規表現だと置換後の文字列をどう記述すればいいのかがちょっと悩みますな。
画像とその上の文章との間に余白があるやつとないやつがありますが、画像と文章の間の改行をなくしても変化無しでしたのでいじれず。モバイルで使ってるテーマでも同じなのでWordPressのバグじゃないですかね。
あとは画像と文章の基本的なマージンや地図リンクの上下のマージンや表示位置は追加CSSに情報を追加して調整。実は知識のない私にはこれも凄く苦労しましたが結果的に追加したのはこれだけ。
.wp-caption { (中身は省略) } ul li { (中身は省略) }
.wp-captionの方で画像と文章の間隔を調整してます。
ul liの方は地図リンクがリストになってるのでいじったのですが、私は他にもリストを使ってて影響が出ちゃったので影響の出た方をclass指定でCSSを個別に指定しました。サイドバーのメタ情報も位置が大きくずれちゃったのだけど、メタ情報なんて表示してない方がいいかもってことで消しました。ってことで色々影響あるかも知れないのでul liの方は真似しない方がよいと思います。
ってことでだいぶすっきりしましたので完了ですかね。ブログ開設以来11年も掛かっちゃったわ。
ゲストブックはスパムが多いので昨年11月頃に閉鎖してます。書きたいことがあったら新しい記事のコメント欄に書いてもらえばいいしね。アクセス解析プラグイン見てるとホーム見てゲストブック見てコメント欄がないので諦めるパターンがかなり多いので閉鎖の効果はあるっぽい。
あ、そうそう、最近動作が重くて表示に時間が掛かることがありますが、このリニューアルのせいじゃなくてサーバの同居人が悪さをしているようです。サポートも色々調査してくれてるようなんだけど。