猫サイト専用登録式リンク集の猫ネコサーチエンジンに、画像掲示板を新たに付けてみました。迷い猫や里親募集などに役立つよう、都道府県や市区町村も簡単に選択できるjQueryの連動選択ボックスも付けてあります。

昨年末にリニューアルした際、トップページに画像スライダーのようなものは付けており、いずれは掲示板投稿データをここに流しこんだりしてみたいとは思っていましたが、なかなか時間が取れずにやれずじまいにいたので、今回はそれを実装してみた話になります。

猫ネコサーチエンジンについてはこちらの記事でも機能をご紹介しています。ぜひどうぞ。

画像掲示板のプログラムとしては、画像掲示板の泉で長年使ってきたプログラムがあるので、これを流用すれば簡単に実装できますが、以前の記事でもご紹介したように、html書き出し型の古い掲示板プログラムですので、なかなか制御のきかないブラウザキャッシュにまた四苦八苦するのも嫌だったので、今回はPHPとSQLで作り直してみることにしました。

作業としては、手持ちの画像掲示板プログラムのファイル更新処理部分をDB化するイメージでしたが、ファイル操作や配列操作をゴリゴリする必要もなく、とってもスッキリした感じにできました。

画像掲示板をPHP&SQLで制作するとなると、いまどきは細かいこと気にせずに画像もバイナリにしてBLOB型で保存といったことをやっちゃうのかと思い少々調べてみましたが、こちらの議論を見る限りでは、保存しない派がまだ多いようでしたので、DB保存しない派の私も一安心でした。

バイナリにすると取り回しは楽そうですが、やっぱりHTMLのソース見たときのバイナリ文字列にはガックリしますので。猫ネコサーチエンジンの登録サイトのスクリーンショットも、GoogleのPagespeed APIを使ってバイナリを取得していますが、見るとこんな感じなのでちょっと微妙な気にはなります。

HTMLソースimgタグのバイナリ文字列…

ちなみに、バイナリデータが嫌といっても、サイトのスクリーンショット自体は凄くきれいにとれるので、APIでサイトのスクリーンショット取得に興味があればこちらの記事をご参照ください。

さて、冒頭に書きましたが、猫の情報交換掲示板ということで、迷い猫・保護猫・里親募集を書き込むとなると、お住いの地域をささっと選択できる方が便利だろうとは思いましたので、都道府県を選ぶとその市区町村がプルダウンで更に選択できる、よくあるあのセレクトボックスをつけてあります。

色々調べてみましたが、「都道府県連動型市区町村プルダウンメニューをjQueryでできる限り少ないコード数で書いてみた – Lan’s note」これが一番スッキリシンプルな感じでしたので、そのまま拝借してあります。元となる都道府県・市区町村 jsonデータも毎日更新されているとのことで、ありがたい話です。

フロント側はこれでささっと実装できるのですが、生成されるセレクトボックスに入るvalue値はjsonデータ内のid値になるので、DBから引っ張り出して県名などを表示する際は、PHPでもjsonを読み込んで、idに対応する都道府県名、市区町村名を抽出する必要があるので細工が必要になります。

PHPでjsonデータの値取得はこちらの記事も参考にどうぞ。

まだ投稿がなくて、ページング処理も付けてなかったりですが、これからゆっくりカスタマイズしていこうと思っています。

町の猫情報一覧 | 地域の猫情報掲示板 – 猫ネコサーチエンジン