WordPressテーマ『Hantus』でオシャレな店舗サイトを作ろう

WordPressテーマ『Hantus』でオシャレな店舗サイトを作ろう

WordPressテーマ『Hantus』を使った店舗・施設向けのサイトの作り方を解説。

Hantusの特徴

Hantusは美容健康を意識したエレガントなWordPressテーマです。
スパ・美容室・ネイルなどの美容健康系はもちろんの事レストラン・飲食店であってもオシャレで魅力的なサイトに仕上げる事ができます。

Hantus外観イメージ
画像をスライドできるようなオシャレなサイトを誰でも簡単に作成できるのがHantusの特徴です。

Hantusインストール

まずはHantusをインストールしましょう。
WordPress管理画面の外観→テーマの新規追加を開き検索欄に『Hantus』と入力して出てきたものをインストール。
インストールできたら有効化します。

有効化したら外観→カスタマイズをクリックします。
カスタマイズ画面に出てきた『Clever Fox』というプラグインをインストール&有効化します。

正常に有効化できれば以下の画面に切り替わります。

これがHantusの外観になります。ここから自店舗向けサイトにカスタマイズしていきます。

お問い合わせと固定ページの追加

サイトトップのメインメニューに配置する『お問い合わせ』と『固定ページ』を作成します。

メニューはご自身のサイトに合った固定ページを作成、表示させる事ができます。
ここでは『お問い合わせ』『コンセプト』『メニュー』『ギャラリー』『インフォメーション』の固定ページをそれぞれ作成していきます。

【お問い合わせ】
お問い合わせフォームを作成します。まずはContact Form7というプラグインをインストールします。
管理画面のプラグイン→新規追加→検索欄に『contact form』と入力して検索→『Contact Form7』をインストールして有効化します。

管理画面左に追加されたお問い合わせからフォームを作成します。

保存するとショートコードが表示されるのでコピーします。

続いて固定ページの作成です。
固定ページ→新規追加からお問い合わせの固定ページを作成。

※Word Pressのバージョンによってページの作成画面に違いがあります。
本サイトではプラグイン「Classic Editer」を用いて作成しています。使用したい場合はプラグインの新規追加から「Classic Editer」をインストール→有効化してください。

【コンセプト】【メニュー】【ギャラリー】【インフォメーション】の固定ページ作成。
それぞれ固定ページ→新規追加でタイトルと文章を入力して公開します。

続いてメニューを作成します。
外観→メニューを開いて先ほど作成した固定ページが追加されているのを確認し、メニューを作成をクリックします。

メニューに固定ページを追加したい場合や削除したい場合はここから。

メニュー設定のメインメニューにチェックを入れてメニューを保存をクリックして完了です。

外観→カスタマイズを開いてサイト上部にメニューが追加されたのを確認してみましょう。

トップのカスタマイズ

外観→カスタマイズを開いてトップページをカスタマイズしていきます。

【サイト基本情報】

ロゴ画像のアップロードや文章を入力。

【ヘッダーセクション】
ヘッダーセクションのヘッダー連絡先情報をカスタマイズ。
※お問い合わせのURLは固定ページ一覧のお問い合わせページのパーマリンクをコピーします。

メールではなく電話番号を直接掲載したりする事も可能です。

【ホームページのセクション】

ホームページの各セクションをカスタマイズします。



※各セクションごとに表示の有無を変更できるので必要のないセクションは削除してください。

『Slider Section』
slide項目のSliderを開いて画像をアップロードしてテキストを入力していきます。

同じようにスライド2枚目、3枚目のセクションをカスタマイズしていきます(無料版ではスライドは3枚まで)。
不要なスライダーの削除や文字色を変更する事もできます。

『info Section』『Service Section』『Testimonial Section』を同じ要領でカスタマイズしていきます。

『ブログセクション』
ここに投稿された記事が表示されます。店長ブログなどを更新していきたい場合は活用します。

【フッターセクション】

ページ最下部のフッターを必要に応じてカスタマイズします。

【ウィジェット】

フッターウィジェットエリアをカスタマイズします。

【画像(上のHantusロゴ)を変更する場合】
WordPress内の適当な場所に画像をアップロードしてその画像URLをコピーしフッターウィジェットのテキスト内に貼りつければOKです。

以上でHantusを使ったサイトの外観設定は完了です。
自分の店舗に沿ったカスタマイズをしてユーザーの心を掴む魅力的なサイトにしていきましょう!