タグ: オリジナルテーマ

Twenty Fifteen 子テーマで公開した投稿のフォントを変更した時に気がついた、管理者ページ側の問題点

• 投稿の編集ページの入力フォームフォントが Noto Serif に設定されている。タイトル入力フォームは問題ない。
• しかしそのフォントは日本語が見つからないため設定されない。

問題解決まで

1. 設定されないフォント、Noto Serif を指定している場所を探す
2. 親テーマの functions.php で editor-style.css を検索、修正部分を特定する
3. Noto Serif フォント指定をしている関数を子テーマで先に書く（オーバーライド（上書き）はできないが親テーマが関数を if で囲っているため親テーマで読込させないことが可能）
4. 子テーマディレクトリに css/editor-style.css ファイルを作り、フォントの設定を上書きする

子テーマを作る時、CSS を読み込むポイント

• 親テーマ CSS を子テーマから読み込むには、functions.php で wp_enqueue_style 関数を使用する。
• 子テーマの style.css で @import url(“../twentyfifteen/style.css”); とする方法は古く、非推奨 ← 子テーマ – WordPress Codex 日本語版
• 子テーマで外部の CSS を読み込む時も、同様に wp_enqueue_style 関数を使用する。用途は親テーマの CSS の読み込に限定されない。

本投稿は、【WordPress】Twenty Fifteen の子テーマを作った記録！ | oki2a24 の続きですの♪「CSS の読み込み方が実は古い。」という課題を、解決しましたので記録いたしました。

実際の子テーマのソース修正部分・内容

子テーマを作り始めてから完成！切り替えるまでの大まかな流れ、概要

開発環境でテーマを作り、確認、テストも済ませてから本番環境へアップロードし、切り替えるのが１番間違いのない、おすすめの方法でございます。

ですけれども面倒ですの！ですので本番環境で直接ファイルやディレクトリを作って編集しながら、でも失敗してもできるだけ簡単に復旧できるように工夫しながら進めていった方法をノートいたします♪

• 本番環境へターミナルからログインし、CUI 環境でコマンドとエディタは Vim を使いながら進めていった

目次