テーマのインストール手順とカスタマイズ方法

WordPressで全体のレイアウトやデザインを変えるためには「テーマ」からテンプレートを選びます。

初期状態でもデフォルトテーマが設定されていますが、他にも数多くあるため好きなテーマを見つけてきましょう。

本ページでは無料かつ初心者向けの「Lightning」というテーマを用いてインストール手順とカスタマイズ方法を解説します。

テーマ本体のインストール

WordPressではテーマのインストールや切替を簡単に行えます。

①管理画面で「外観」＞「テーマ」をクリックします。
②テーマ画面で「新規追加」をクリックします。

③検索ボックスに「Lightning」を入力します。
④Lightningテーマが表示されたら「インストール」をクリックします。

⑤インストールが完了したら「有効化」をクリックして切り替えます。

専用プラグインのインストール

Lightningには便利な拡張プラグイン（ExUnit）があります。

SNSとの連携やGoogle自動広告の挿入などが簡単に行えるためインストールしておきます。

①Lightningを有効化すると「VK All in One Expansion Unit」と「VK Blocks」の通知がされるため「プラグインのインストールを開始」をクリックします。

②対象プラグインをチェックし、インストールを選択して適用をクリックします。

③インストールが完了したら「必須プラグインのインストール画面に戻る」をクリックします。

④対象プラグインをチェックし、有効化を選択して適用をクリックします。

⑤ダッシュボードに戻って追加要素があれば対応します。

⑥日本語表示にするために「更新」をクリックします。
⑦WordPressの更新画面で「翻訳を更新」をクリックします。

⑧ExUnit画面にて、SNSとの連携、Analyticsの設定、Google自動広告の挿入などが簡単に行えます。

子テーマの作成

インストールしたテーマを直接カスタマイズすると、アップデートの時に上書きされ設定が戻ってしまう場合があります。

設定が戻ってしまわないよう子テーマを作成してからカスタマイズを行っていきましょう。

フォルダーの作成

子テーマを作るためには親テーマと同じ階層にフォルダーを作成する必要があります。

フォルダーの作成はFFFTP等のファイル転送ソフトを使って行います。

エックスサーバーでのFFFTP設定手順
https://www.xserver.ne.jp/manual/man_ftp_ffftp_setting.php

WordPressのテーマは、エックスサーバーのWordPress簡単インストールを使った場合は「/ドメイン名/public_html/wp-content/themes」に格納されています。

①テーマが格納されているフォルダーの何もない箇所で右クリックをして子テーマのフォルダーを作成します。

②ここではLightningの子テーマを作成するため「lightning-child」という名前のフォルダーにします。

style.cssの作成

子テーマには2種類のファイルが必要になります。

そのうちの1つが「style.css」です。

作成したファイルに以下の内容を記述してください。

Theme Name : 子テーマの名前
Template : 親テーマのフォルダー名

Lightningの場合は以下の記述になります。

Theme Name: Lightning Child
Template: lightning

functions.phpの作成

2つ目のファイル「functions.php」を作成します。

以下を記述します。

<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
  wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
  wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style')
);
}
?>