温泉デモサイト作成しました。

こんにちは。

クリンクスデザインです。

冬の季節の定番行事といえば、『温泉旅館』ですよね。

私も今年は家族と東北に温泉に行ってきます。

そんな事もあり、和や日本的な特徴のサイトをテーマに今回は制作してみました。

仕上がりとしてはとてもクオリティの高いサイトに仕上がったと思います。

それでは、機能的にカスタマイズ一覧をご説明していきたいと思います。

温泉トップページLP

和を特徴としたサイトのほとんどはメインビジュアルで決まると思ってます。

ファーストビューの写真やカラーなど『伝統的』な雰囲気を出す工夫が必要になり、ポイントずつそれらのコンテンツをトップページに入れ込んでみました。

日本、伝統、和でこの部分をサイトに入れれば大体オシャレになるというポイントを上げます。

・メインヘッダー画像もしくは動画のクオリティ高い素材にする
・2カラムコンテンツを入れる
・余白を付ける
・テキストの縦書きを加える

https://clinks-design.com/wp-content/uploads/2021/05/納品ほほえみ女性客-300x300.png
女性のお客様

縦書きはいかにも和風なサイトのイメージになりますね!

 

温泉探しの検索機能

こちらは「VK filter search」を利用しています。

プロ版の方が使い勝手はいいみたいので、今後購入してカスタマイズをしていこうかと思います。

ひとまず、無料でも必要な機能だけであれば全然利用は出来ます。

https://clinks-design.com/wp-content/uploads/2021/05/納品角細眼鏡+紺色-300x300.png
制作会社

こちらのプラグインはとても利用しやすかったので国内プラグインなので購入価値ありです。

株式会社ベクトル「公式ホームページ

 

ブロークングリッド表示

今回の表示方法はグリッド表示で写真は大きめのサイズで表示させました。

画像やテキストを浮かびさせる表示にするアニメーション機能を追加するのもありです!

ただ今回は静的な雰囲気のサイトを作成したかったので、エフェクト機能は入れていません。

https://clinks-design.com/wp-content/uploads/2021/05/納品角細眼鏡+紺色-300x300.png
制作会社

普通のサイトに飽きた方などに使えますね。

JS(動的)なサイトは入れすぎるとサイト表示が遅くなるので入れ過ぎは厳禁だなと、個人的な考えです。ページ読み込みが遅いと離脱率も高くなるので注意です。

 

予約機能

こちらは外部クラウドサービスを利用しました。

導入予約フォーム「Stores(旧Cubic)」公式サイト

今回はStoresという予約システムを使ってみました。

Storesは初めて使ったので、少し感想を伝えます。

予約サイトでは他にも沢山利用経験あり

 

シンプルでわかりやすい管理画面

こちらはホームページと作りが似てる管理画面で「予約ページ」で新規ページを作成が行えます。

https://clinks-design.com/wp-content/uploads/2021/05/納品角細眼鏡+紺色-300x300.png
制作会社

管理画面のみやすさはとても重要な項目です。
設定テキストリンクが多い管理画面は正直みにくく疲れますし調べる時間が増えます。

今回色んなサイトの管理画面を見てきましたが、「Stores」がダントツで見やすかって使いやすかったです。

編集画面ではこんな感じで2カラム構成

見ての通り直感で編集場所がわかるので初心者の方でもすごく親切な管理画面だと思います。

セレクトタイプの方が細かな設定項目が多いのですが、管理画面のみやすさと必要な機能はStoresでも備わってるので全然良いですね。

ただ、有料プランでしか使えない機能が多かったのが難点で金額も結構高めです。

 

有料プラン

スタンダートとプラチナは今後利用することはないでしょう。。

https://clinks-design.com/wp-content/uploads/2021/05/納品角細眼鏡+紺色-300x300.png
制作会社

ライトプランでさえ金額が月8,778〜と高い!と感じました。

機能はよかったのですが、スタンダートプランに比べると機能は結構変わったので試したい方は『お試し期間』で試すのもありですね。

詳しい機能紹介はこちら

ただ決済機能はフリープランでもあったのでこれはよかったですね!使えます!

フリープランでは2サイトしか作成できないので、2サイト使い終わったら他の予約サイトやプラグインを探しに行きます。

 

下層ページコンテンツ

旅館サイトを参考にレイアウトは組んでみました。

下層ページでどんな感じで作成するとオシャレなページになるかなどよく質問頂きます。

今回のデモサイトのブロックパターン

①背景ヘッダー
②見だしタイトル(ロゴかもしくはテキストタイトル)
③画像(デモサイトでは2カラム構成)
④見出し3〜4
⑤説明文章
⑥詳細説明(短めの説明)※テーブル機能でもいいかも
⑦リンクかもしくはボタン

こんな感じですね。

こういうブロックはまた使う機会があるので、できれば再利用ブロックやテーマによれば、パターンブロックに保存していつでも呼び出せるので登録をしておくと時間短縮になります。

 

温泉や旅行系向けプラグイン

  • お問い合わせフォーム
  • バックアッププラグイン
  • SEO系
  • カルーセルプラグイン

お問い合わせプラグイン

ホームページ定番な『Contact Form 7』です。

お問い合わせフォームは大体ホームページに入れますが、予約フォームも作成出来てしまいます。

※予約希望日、プラン、何名様など追加すれば予約ページに追加するだけです。

デフォルトだと、シンプルすぎて淡白なのでスタイリング(CSS)でカスタマイズする方がよいかと思います。

お問い合わせフォームカスタマイズはこちら(有料会員+購入)

https://clinks-design.com/wp-content/uploads/2021/05/納品角細眼鏡+紺色-300x300.png
制作会社

色はサイトの雰囲気に合わして下さい

 

バックアッププラグイン

こちらも定番なプラグイン『All-in-one WP Migration』です。

インポート、エクスポート、バックアップの三種類から選べます。

バックアップ以外にもサイトの引っ越しにもよく使われます。

サイト容量が多い場合は、無料版では引っ越し出来ないのでプロ版に変更しないといけません。※プロ版は容量無制限です。

 

SEO系

こちらは色んなSEO対策のプラグインがありますがオススメのプラグインは2種類です。

①All in one seo pack
②Google XML Sitemaps

集客や売上げアップに繋げるには、やはり検索上位表示が必須でしょう。

コンテンツ毎にSEO対策したり、Googleにインデックスさせるのを早くしたりしてサイトを一人でも多く見てもらえるプラグインです。

 

カルーセルプラグイン

色んなカルーセルプラグインを利用してきましたが、こちらのプラグインはとても使いやすかったです。

ダウンロードはこちら

簡単な設定ですのでギャラリーに画像追加してショートコードページに追加するだけです。

編集としては無料だと画像にリンクが貼れないので、リンクを追加するのはプロ版が必要になります。

プロ版は表示カスタマイズや、リンク、その他の細かな設定が行えます。

まとめ

いかがでしたでしょうか?

温泉系や旅行日本的なデモサイトは今後も増やしていきますのでぜひとも参考にして下さい。

サイト制作も請け負っておりますので是非こちらからお問い合わせ下さい。

制作申し込み

クリンクス デザイン

クリンクス デザイン

クリンクスデザインにようこそ。 ホームページ制作、運営代行、制作カスタマイズなどお客様の営業をホームページ活用面でサポートし、ビジネスパートナーとして重宝されるよう努めています。

関連記事

TOP