テーマを変える
デフォルトのテーマはかっこいいんですが、ビジュアルが大きすぎてスクロールしないと投稿一覧が見えないので、テーマを変更します。
LIQUID PRESSを適用する
日本製のレスポンシブなテーマ、LIQUID PRESSを使ってみます。
/外観/テーマからインストールします。
新しいテーマで検索をすると、LIQUIDというのが出てくるのでこれをインストール、有効化します。
メインメニューが非表示になったので/外観/メニューで再度表示させます。
できました。結構見た目が変わりますね。
スマホサイトはこんな感じ。
ちなみにこのテーマ、ログインリンクが表示されないのでアドレスバーにwp-login.phpを入力してログイン画面を表示します。
Xeory Baseを適用する
最終的にはWordPressの公式にはない日本語テーマ、Xeory Baseをインストールしました。
公式テーマにはないので、WordPress内で検索しても出てきません。Xeoryのサイトでユーザー登録をしてダウンロードします。
管理画面でzipファイルをインストールしてもいいんですが、sftpあたりでサーバーにアップロードして~/www/junkworks/wp-content/themesの下にファイルを展開するとテーマの追加画面に現れます。
適用するとこんな感じ。たまたまアイキャッチ画像のない記事なので文字ばかりですが、設定されていれば表示されます。
子テーマを適用する
さて、いろいろ設定をいじっていきたいところですが、テーマがバージョンアップされると設定がクリアされてしまって、また一からカスタマイズすることになります。
これを回避するために子テーマを適用してこれをカスタマイズしていきましょう。
子テーマというのは、簡単に言うとオリジナルテーマに対する差分のみを上書きする機能です。
オリジナルテーマがバージョンアップしても上書きする差分は残っているので、カスタマイズの内容がそのまま引き継がれます。
$ cd ~/www/junkworks/wp-content/themes
$ mkdir xeory_base-child
$ cp xeory_base/style.css xeory_base-child/コピーしたstyle.cssを次のように書き換えます。
/*
Theme Name: XeoryBase Child
Template: xeory_base
〜後略〜- ２行目のTheme NameをXeoryBase childに書き換える
- ３行目のTemplate: xeory_baseを追記する
次にfunctions.phpを新規作成します。
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')
);
}
?>※LIQUID PRESSの場合はLIQUID PRESSの公式サイトにある子テーマの作り方にあるものを記述します。（ちょっとだけ違う）
以上、親テーマへの参照設定ができたらWordPressのテーマをオリジナルから子テーマに切り替えます。
最後に使わないテーマは削除しておきましょう。