多言語対応レンタル着物ショップサイトのコーディング事例
サイト名
浅草着物レンタル小桃
制作内容
ワードプレスのコーディング
制作ポイント
・基本的な内部SEO
・多言語対応（日本語/英語/中国語）
・レスポンシブ対応
・レティナディスプレイ対応
・高速化対策
・常時SSL化
・管理画面のカスタマイズ
着物レンタルショップの特性を踏まえて、キャンペーン情報の画像やテキストを簡単に入れ替えできるように、トップページの管理画面を徹底的に使いやすくカスタマイズしました。PC用とスマホ用の画像を別々に設定できるので、スマホの高解像度ディスプレイ（レティナディスプレイ）で表示しても画像が綺麗に見えるだけでなく、表示速度の最適化も同時に実現しています。
トップページはテンプレートを完全カスタマイズ。ヘッダー画像やお得なニュース、人気の秘密の画像やテキストは、全て管理画面から簡単に差し替え可能。HTMLの知識が一切必要ありません。
キャンペーンや料金プランのバナー画像、リンク先、画像の周囲にシャドウを付けるか付けないかなど、更新する可能性のある部分は全て管理画面から簡単に入れ替えできるように制作しています。
お店のこだわりポイントも、画像とテキストは全て管理画面から更新可能。PHPの難しいテンプレートを編集する必要がありません。
インスタグラムに写真をアップすると、サイトの表示にも自動連携されます。お客様日記（ブログ）は、新しい記事が自動で表示され、更新してから一定期間内（１週間や２週間など）の記事にはNEWSマークが自動で付くようにプログラミング。
レンタルの流れも、写真とテキストは管理画面からHTMLタグの知識がなくても更新できます。
よくある質問（Q and A）は、質問をクリック（またはタップ）すると下に開くアコーディオン形式。質問の追加や並び替えは、管理画面から行えます。
地図（グーグルマップ）は、店舗が移転したときも簡単に変更できるように、グーグルマップのページで取得した埋め込み用のコードを管理画面で貼り付けるだけで済むようにしています。地図の下の情報も、管理画面からHTMLタグを一切書かずに変更できます。
予約フォームは、スマホユーザーの操作性に配慮してタップ領域を十分広く確保してスムーズな入力を実現するとともに、入力中の離脱を防止するために入力エラーを色分けしました。
また、予約フォームは今後増やしていく記事ページにも自動で設置できるように、テンプレートを共通化しました。管理画面でフォームを表示したいページにチェックを付けるだけで簡単にフォームを追加できます。
フッターに４列あるメニューは、それぞれ管理画面からリンク名やリンク先を変更可能。SNSアイコンのリンク先も管理画面で一括設定できます。
管理画面の一部です。ページを上から順番にブロック分けし、ブロックごとの設定をタブで切替できるようにカスタマイズしています。ご覧の通り、設定欄は基本的に「テキスト」「画像選択」「チェックボックス」だけで構成しているので、HTMLタグの知識がなくても誰でも更新できます。もちろんタグの知識がある方は、テキストの中にタグを入れていただくと、サイトの表示に反映されます。