2013年9月14日土曜日

【不動産プラグイン】「トップ物件表示」ウィジェットで2段目がズレる●追記アリ


画像クリックで拡大

不動産プラグインでは新着物件がウィジェットで(トップ物件表示)表示できるのだけれど、なぜか上の画像のように表示がズレることがある。

 ズレた部分がこれ
画像クリックで拡大

物件の表示数や表示する項目はウィジェットのメニューで選べる。東京4万暮らしでは、8件の表示で、「タイトル」と「家賃」(価格)、「路線・駅」の3項目を表示させている。ほかにも「地域」や「間取り・土地面積」、「物件種別」(賃貸だけでなく売買もある)なども表示できる。

 ズレる症状がいつも出るわけではないので、どうしたものか分からず、仕方が無いので当面は表示数を4件に絞っていた。ズレるのは決まって2段目だったので、4件のみの表示なら1段で収まる為にズレることはないからだ。

 しかしそれでは常に4件しか表示できない。

 しばらくサイトを運営していると、やはりこの「トップ物件」(東京4万暮らしでは「新着物件」のコーナーとしている)のところに表示された物件の閲覧数が他と比べてもかなり多いことが分かったので、せめて8件(2段)表示はさせたいと思ってちょっと触ってみた。

 結局なぜズレるのかを見ていると、表示されるセルの中のテキストの段数と関係していることが分かった。

画像クリックで拡大

上の画像を見ると、上の段の4件のセルはすべて「5行」で収まっている。例えば一番左上の南青山の物件は、

南青山のお洒落なシェアハ
ウス4万円台!
4.2万円
東京メトロ銀座緯線表参道駅
→物件詳細

となって5行。

その横のシェアハウスは

女性限定シェア駅徒歩1分
4万円
東京メトロ丸ノ内線中野坂
上駅
→物件詳細

でやはり5行。

 要は、表示させる項目にもよるのだけれど、すべてテキストが同じ行数に入るようにすればいいということだ(実際は、1段目のセルのテキストがすべて同じでなくても、少ないセルがあっても揃う)。具体的には、タイトルは基本2行にわたるようにしておき、路線・駅名が長くなると2行にわたる場合は1行に収める、というように運用している。

 東京4万暮らしの場合は、表示させているのが、タイトル、家賃、最寄り路線・駅名の3つだけだが、他の項目も表示させる場合はまた行数が変わるだろう。

 ちなみに下の段は行数が違っているが、この場合はさらにその下の段がないので大丈夫。しかしここで表示件数を12にして3段目を表示させると、3段目の一番左のセルの部分がズレてしまう。

● 追記ここから

 と、こういうエントリを書いたら、早速公式からありがたいご指摘をツイートでいただきました。



なるほど、そういうことだったんですね。スクリプトの名前からしてもう、これが原因だと分かります。これは直さねば……

@nendeb の中の方、素早いご指摘ありがとうございました!