自作で不動産屋ホームページ制作。検索機能の作り方は難しくない。

<   イントロダクション   >

 
不動産屋で重要な営業ツールの一つ、ホームページ。そのホームページを自作で制作してます。ワードプレスを利用して自作で不動産ホームページを制作しようとしている方に向けた内容になっています。
 
以前に不動産Webに必要な最低限の機能とは何かを定義しました。
詳しくは以下の記事を参照ください。
src: url /  #  不動産屋、自作でホームページ作成にはWordpressがいい!  /
 
その最低限の機能の一つである“物件検索機能”についての制作方法について簡単に紹介させて頂きます。検索機能の制作なんて難しそうってイメージがある方、私も最初はそう思っていましたが作ってみると意外とすんなりできました。
 
どの程度の完成度を求めるかにもよりますが、今回紹介する方法で、ある程度のことはできると思ってます。
 
ちなみに完成形はこんな感じです。
 

 
 

<   ポイントは検索機能の仕組みを理解すること   >

 
ワードプレスで機能を実装する時はプラグインを利用することがほとんで、だいたい一つの仕組み(機能)に対して一つのプラグインで完成します。これが検索機能を実装する場合だと、2つの仕組みと2つのプラグインが必要になります。

検索機能 = 2つの仕組み + 2つのプラグイン

この複数プラグインを使うことも難しく感じさせる要因の一つかもしれませんが、それぞれの仕組みを順番に制作していけば難しくありません。
 
</>
 
 
 
 

<   検索機能の2つの仕組みとは   >

 
検索機能の2つの仕組みは以下となります。

・評価づけの仕組み
・検索の仕組み

評価づけの仕組みとは、 管理者(サイト制作者)が、一つの不動産を複数の項目に分け、各項目ごとに事実に基づいて評価していくことです。ちょっとわかりにくいですね。(笑)


項目
 

・値段
・間取り
・広さ
・地域
・駅から何分か
 
上記が項目となります。


任意に設定した上記のような項目にそって管理する物件を評価していきます。
 
例:項目      例: 評価
 ・値段       → 8万円
 ・間取り      → 1LDK
 ・広さ       → 20㎡
 ・地域       → 港区
 ・駅から何分か   → 8分


上記のように管理する物件を項目ごとに評価することで検索結果として表示できるようになります。つまり検索結果を表示するための項目づくりが”評価づけの仕組み”ということになります。
 
検索の仕組みとは、ユーザーが評価を条件に物件を選定する仕組みです。つまりユーザーが評価を選定するための項目づくりが”検索の仕組み”ということになります。
 
評価付けの仕組み検索の仕組みも共に項目づくりがキーポイントになります。
  
</>

 
 
 
 

<   仕組みごとにプラグインを利用する   >

 
使用したプラグインは以下です。

・評価づけの仕組み   src: url /  #  Advanced Custom Fields  /
・検索の仕組み     src: url /  #  Search & Filter Pro  /

不動産物件検索用の上記二つがパッケージになっているプラグインその名も”不動産プラグイン”というのがありますが、私は上記二つの組み合わせの方が使いやすく感じました。
 
興味がある方は → 
src: url /  #  不動産プラグイン  /
 
検索の仕組みで利用するプラグインSerach&Filter Proは有料(20ドル)となりますが、外注することを考えれば十分すぎる値段だと思います。また検索結果の表示にこだわりたいのであればカスタマイズが必要になってきます。ちなみに私はカスタマイズしてません。
 
</>
 
 
 
 


<   参考にしたチュートリアルとブログ   >

 
各仕組みの制作にあたり参考にさせて頂いたチュートリアルとブログを紹介させて頂きます。上記二つのサイトをメインとし下記二つを補足として参考にさせて頂いておりました。


基本はこの二つ
 
src: url /  #  さとやんチャンネルさん  /

こちらの動画のみでも十分だと思います。
 
 
src: url /  #  のまろぐ2.0さん  /
こちらBLOG形式ですが実例もありお勧めです。

 
辞書がわりとして
 
src: url /  #  バズ部さんのサイト
  /
Advanced Custom Fieldsについてはこれで十分だと。
 
 src: url /  # 
未来的Life Styleさん  /
Advanced Custom Fields と Search&Filter PROについて。応用編になると思います。

</>
 
 
 
 

<   どうしても解決できない時はどうしたら良いか?   >

 
「手順どおりにやっているのにできない。」ってことたまにあります。そんな時はエンジニアに聞いちゃいましょう!

・わからない時の解決サイト   src: url /  #  teratail  / 

teratail(テラテイル)はプログラミングに特化したQ&Aサイトです。実現したい機能やエラーなどについて質問するとエンジニアの方がアドバイスや解決方法を具体的に教えてくれます。しかも無料です!CSSについての初歩的な質問でも丁寧に教えて頂きました。とてもお勧めです!
 
</>

 
 

 
 

<   まとめ   >

 
・検索機能 は
 
ラベルづけの仕組み+検索の仕組み


・プラグインは
 
ラベルづけの仕組み →   src: url /  #  Advanced Custom Fields  /
検索の仕組み    →      src: url /  #  Search & Filter Pro  /


・チュートリアルは
 
src: url /  #  さとやんチャンネルさん  /
src: url /  #  のまろぐ2.0さん  /
 
の二つを参考にする


・解決できないことは
 
src: url /  #  teratail  / 
 
を利用する

以上です。
自作で不動産ホームページを制作される方の参考になれば幸いです! 

</>