キッチンの施工会社やインテリアデザイン事務所のサイトでは、写真の美しさが大切です。ただ、写真を並べるだけでは、相談にはつながりません。
訪問者が知りたいのは、「この会社は自分の希望に対応できるか」「どこまで任せられるか」「相談すると何が始まるか」といった具体的なことです。
Cocina – Kitchen and Interior Design WordPress Themeは、キッチンやインテリア関連の事業向けに検討できるWordPressテーマです。開発元は、キッチンの設計・リフォームなどを用途として挙げ、レスポンシブデザイン、レイアウトのカスタマイズ、デモインポートなどを案内しています。
この記事では、小規模なキッチンデザイン会社のサイトを想定し、導入から公開前の確認までを整理します。評価は公開情報と制作時の確認ポイントに基づくもので、実機による速度計測や長期運用のレビューではありません。
1.テーマを入れる前に、問い合わせまでの流れを決める
最初に考えたいのは、トップページの色やアニメーションではありません。
「どのような相談を受けたいのか」を決めましょう。
たとえば、ショールームへの来店予約を増やしたい会社と、設計相談を受けたい事務所では、必要な説明もボタンの文言も変わります。
設計から施工まで請け負う会社なら、次の構成が出発点になります。
| ページ | 掲載する内容 |
|---|---|
| ホーム | 対応する工事、地域、代表的な施工事例 |
| サービス | 設計・施工・設備交換などの対応範囲 |
| 施工事例 | 写真、依頼内容、設計上の工夫 |
| ご相談の流れ | 問い合わせから打ち合わせまで |
| 会社紹介 | 担当者、所在地、事業内容 |
| お問い合わせ | 相談フォーム、連絡方法 |
ページ数を増やすより、各ページの役割を明確にするほうが、文章や写真を準備しやすくなります。
あわせて、会社紹介文、対応地域、施工事例の写真を先に集めておきましょう。実際の素材があると、デモの見た目だけで判断せずに済みます。
2.テスト環境にCocinaをインストールする
既存サイトのテーマを変更する場合は、バックアップを取得し、ステージング環境で作業します。新規サイトでも、内容が整うまではテスト環境で確認してから公開すると進めやすくなります。
WordPress管理画面から、次の順に進みます。
「外観」→「テーマ」→「新規追加」→「テーマのアップロード」
ここで、インストール用のテーマZIPファイルを選択します。
ダウンロードしたファイルに説明書や関連ファイルがまとめられている場合、その外側のZIPをアップロードしてもインストールできないことがあります。「スタイルシートが見つからない」と表示されたら、まずファイル構成を確認してください。
有効化後は、同梱ドキュメントに沿って初期設定を進めます。必要なプラグインが案内された場合は、それぞれの用途を確認し、使用するレイアウトに必要なものを導入します。
テーマのPHPファイルなどを変更する予定がある場合は、子テーマの利用も準備しておきましょう。
3.デモを読み込んだら、まず不要な部分を整理する
デモインポートは、ページ構成を理解するために役立ちます。ただし、取り込んだ状態をそのまま完成形にする必要はありません。
付属の手順に従って読み込んだら、最初に次の項目を確認します。
- トップページとして設定されている固定ページ
- ヘッダーとフッターのメニュー
- 仮の住所、電話番号、メールアドレス
- 使用しない固定ページや投稿
- デモ画像の利用条件
- 問い合わせボタンのリンク先
特に、フッターの連絡先やフォームの送信先は見落としやすい部分です。見た目を調整する前に、自社情報へ置き換えておきましょう。
不要なセクションも、この段階で整理します。たとえば、実際には提供していないサービスの紹介や、運用する予定のないページへのリンクは残さないようにします。
4.最初に「施工事例を1件」完成させる
トップページから作り始めるより、施工事例を1件完成させると、テーマとの相性を判断しやすくなります。
自社の写真と文章を入れたときに、読みやすく、無理なく構成できるかを確認できるからです。
依頼前の悩みを伝える
「明るくおしゃれなキッチンになりました」という説明だけでは、工事の価値が伝わりにくいものです。
たとえば、実際の相談内容に合わせて、次のように具体化します。
「調理器具を置く場所が足りず、作業台が狭くなっていたため、収納と調理スペースの見直しをご希望でした。」
訪問者が自分の悩みと重ねられるように、依頼の背景を短く説明します。
担当した範囲を明確にする
設計だけを担当したのか、設備の選定や施工まで行ったのかを記載します。
同じ施工写真でも、担当範囲が分かると、その会社に何を相談できるかが伝わります。
写真に説明を添える
全体写真に加えて、収納内部、カウンターの納まり、照明などの写真を用意すると、工夫を説明しやすくなります。
写真から分かることを繰り返す必要はありません。「なぜこの配置にしたのか」「どのような使い勝手を目指したのか」を補足しましょう。
完成前のCGや提案用パースを掲載する場合は、施工写真と区別できる表記を付けます。
5.トップページは「誰に、何を提供するか」を先に伝える
トップページの最初の画面では、訪問者が事業内容を理解できるようにします。
抽象的なキャッチコピーだけでなく、サービスと地域が分かる一文を添えると明確になります。
たとえば、実際の事業に合っているなら、
「横浜・川崎のキッチンリフォームとオーダー収納」
という表現が考えられます。
その下には、代表的な施工事例を配置します。「収納を増やしたマンションのキッチン」「家族の動線を見直した戸建て」など、写真を開く理由が伝わる見出しを付けましょう。
続いて、サービスの概要、相談の流れ、問い合わせへの案内を配置します。
同じ内容を言い換えて繰り返すより、読み進めるたびに新しい疑問が解消される構成を目指します。
6.問い合わせフォームは、最初の相談に必要な項目に絞る
問い合わせの時点で、詳しい寸法や設備型番まで分かっている人ばかりではありません。
初回相談用のフォームなら、まずは次のような項目から検討できます。
- 名前
- メールアドレス
- 工事予定の地域
- 希望する相談内容
- 自由記入欄
予算や工事希望時期を尋ねる場合は、「未定」を選べるようにすると回答しやすくなります。必要に応じて、任意項目として扱う方法もあります。
フォームの近くには、送信後の流れを書いておきましょう。
「内容を確認後、担当者からメールでご連絡します」など、実際の運用に合う案内を掲載します。対応できない返信期限を約束する必要はありません。
設定後は、スマートフォンから実際に送信し、受信、完了メッセージ、入力エラーの表示まで確認してください。
7.スマートフォンでは写真の切り抜き方も確認する
インテリアの写真は横長で撮影されることが多く、スマートフォンでは重要な部分が切れてしまう場合があります。
パソコンで全体がきれいに見えていても、小さな画面では収納や設備が見えなくなっていないか確認しましょう。
写真の上に文字を重ねる場合も注意が必要です。背景が複雑な写真では、画面サイズによって文字が読みにくくなることがあります。
公開前には、少なくとも次を確認します。
- メニューを開閉しやすいか
- 見出しの改行が不自然になっていないか
- 本文を拡大せずに読めるか
- ボタンを押し間違えないか
- フォームが画面からはみ出していないか
- 対応地域や連絡先を見つけやすいか
画像は表示用途に合うサイズへ調整し、圧縮してアップロードします。表示速度は、実際の写真やプラグインを入れた状態で確認することが大切です。
Cocinaをどう評価するか
Cocinaを検討する理由は、キッチン関連の事業を想定したテーマであることです。自社のサービスとデザインの方向性が合えば、サイト構成を考える出発点になります。
一方で、テーマ選びでは、見た目と同じくらい更新作業のしやすさが重要です。
| 評価する点 | 確認方法 |
|---|---|
| 写真との相性 | 自社の施工写真を入れて確認する |
| 編集のしやすさ | 文章と画像の差し替えを実際に試す |
| 事例追加の手間 | 2件目の施工事例を作ってみる |
| 必要な機能 | プラグインや外部サービスへの依存を確認する |
| 運用のしやすさ | 更新担当者が迷わず操作できるかを見る |
予約、決済、多言語対応などが必要な場合は、導入するパッケージでの実現方法を個別に確認してください。デモに表示されている内容が、追加設定なしですべて使えるとは限りません。
GPLWPPassの編集視点でも、テーマを選ぶ際には、デザインと制作要件を照らし合わせることを勧めています。候補として検討する場合は、GPLWPPassのCocinaテーマ紹介ページで掲載内容を確認し、バージョンや必要な機能について不明な点を整理してから導入すると進めやすくなります。
どのようなサイトに向いているか
Cocinaは、施工事例を見せながら相談につなげたいキッチン会社やインテリア事務所で、候補に入れやすいテーマです。
ただし、複雑な自動見積もり、会員向けの案件管理、大規模な商品構成システムなどが必要なら、先に機能要件を整理する必要があります。テーマだけで事業上の仕組みまで完成するわけではありません。
まずは、ホーム、サービス、施工事例、お問い合わせの4ページを作ってみてください。
初めて訪れた人が「何を頼めるか」を理解できるか。施工事例から仕事の進め方が伝わるか。スマートフォンから無理なく相談できるか。
その確認を通じて、自社のサイトにCocinaを採用する価値があるかを具体的に判断できます。