「habakiri」でホームページを制作する方法

この記事では「habakiri」でホームページ制作を行う上で参考にした記事を紹介しています。
また、分かりやすい説明記事がなかった部分に関しては説明を付加しているので参考にしてください。

「habakiri」のカスタマイズで役にたった記事

公式テーマ「Habakiri」をカスタマイズ(1)

出来心でHabakiriをいじってみました。Habakiri…どう見ても「腹切り」か「はばかり」です。でも、まかせて安心、WordPress公式テーマなんですよ、奥さん！一応、なんかコーポレートサイ

上記記事を読めば「habakiri」のダウンロード・カスタマイズに関して理解することが可能です。ただし、初心者目線だといくつか分かりづらかった部分があったので補足します。

この記事で補足している内容

・「habakiri」の小テーマ「habakiri-child」を追加する方法
・お問い合わせ機能の追加

子テーマの追加

子テーマの追加です。「habakiri-child」を作成して有効化する必要があるのですが、そこの部分が少し分かりづらかったのでエックスサーバーで契約している場合の具体的な方法を解説いたします。

エックスサーバーへログイン

まずは「Xserverレンタルサーバー」からログイン。
ログイン後にファイル管理のボタンをクリックします。

ファイル管理から、ドメイン名 > public_html > wp-content > themes　とフォルダの中を確認します。
「themes」のフォルダ内で、「＋新規フォルダ」をクリックし、「habakiri-child」という名前のフォルダを作成します。

続いてはパソコン内にあるメモ帳を開き、以下のコードをコピー・ペーストしてください。
重要なのは２行目と１０行目だけですが公式ルールに沿った形式で記述しています。

ファイル名は「style.css」として一旦自分のPCに保存してください。

/*
Theme Name: habakiri-child
Theme URI: http://2inc.org
Description: Habakiri の子テーマ
Author: Takashi Kitajima
Author URI: http://2inc.org
Version: 1.0.0
License: GNU General Public License
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Template: habakiri
*/

続いては、自分のPCに保存した「style.css」を、エックスサーバー内の「habakiri-child」のフォルダにアップロードします。
ドラッグ＆ドロップでも保存できますし、画面のアップロードボタンからも可能です。

最後に子テーマを有効化して完了です。
子テーマの有効化はWordPressの管理画面から変更可能です。

お問い合わせ機能の追加

お問い合わせ機能は「Contact Form 7」という、超人気プラグインを使用します。
イントール方法に関しては以下の記事で詳細に記述されているので参考にしてみてください。

【完全版】Contact Form 7の基本と使い方まとめ｜WordPressに問い合わせフォームを設置しよう | formLab

初心者でも簡単に問い合わせフォームを追加できるWordPressのプラグイン「Contact Form 7（コンタクトフォーム7）」について解説。使い方だけでなく、問い合わせの増加につながるカスタマイズ方法なども紹介しているので、ぜひ参考にしてください。

この記事内だけでは課題解決できなかった内容が、gmail等のフリーメールには問い合わせを転送できないということです。理由は詳しく分からないのですが、色々と試してみましたがうまく行かず、結局gmail以外のメールアドレスを使用することにしました。

エックスサーバーを契約された方であれば、自分のホームページに合ったメールアドレスの作成も簡単です。

おなじみの「Xserverレンタルサーバー」管理画面から、「サーバー管理」をクリック。

「メールアカウント設定」をクリックした後、使用したいアドレスのドメインを選択します。
選択したドメインがメールアドレスのドメインとなります。

例：info@kdkn.co.jp 　→　黄色の＠以下がドメイン

メールアカウントの追加を選択し、お問い合わせ用のメールアドレスを作成します。（例：info@・・・）
作成したこのメールアドレスの情報を、「contact form7」にも登録し、フリーアドレスが使えない問題を解消することができます。ちなみに、いつも自分が使用しているメールがフリーアドレスであれば、この新しく作成したアドレスに来たメールは転送する設定にしておくと便利で良いでしょう。