functions.phpで呼び出せだぁ~?【WP】

ブログエンジン「ワードプレス」はなんとなくは理解したような気持ちになっている。けれど、

もともと、MTを使っていたので(あ、バイクのではなく、そうです、愛車の、あ、いえ愛車とはいえ乗ってないですけど、乗ってないから愛車じゃないなんて誰が決めたんですか!あ失礼、愛車のMT-09のことじゃないですよ、ブログエンジンのムーバブルタイプのことです。これもMTというのです)、かなり取っつきやすかった。

Movable Typeは主にPerlとPHPで書かれており、動作に必要なのはPerlのみとなっている。データストアにはリレーショナルデータベースを採用しており、MySQL、PostgreSQL、SQLiteなどに対応していたのだが、Movable Type 5からはMySQLのみ対応になった。

また、企業向けには別製品としてMovable Type Advancedが存在する。これはMovable Typeを基に、イントラネットでの利用を想定した大量のブログやユーザ、組織や権限などの管理、LDAP対応、Oracle DatabaseやMicrosoft SQL Serverといったエンタープライズ向けのデータベース対応などの追加機能を有償で提供するものである。

のだけれど、ちょっと行き詰まった。嗚呼、フォーラムに質問しに行かないとならないっぽい。このままでもいいのだけれど、先々を考えると直しておいた方がいいと思える。

functions.php

style.css

子テーマのフォルダに入れてそれを中心に直して行けば、テーマがバージョンアップした時に上書きされて「微妙な直し」がお釈迦にならずにすむ。子テーマシステムは本当によくできていてMTが如何にユーザー軽視かを思い知る。商売に走っちゃったのかな。完全に明暗が分かれたようで、もはやWP一択のご時世(のようです。違う?)。

 Theme Name:   Twenty Fifteen Child
 Theme URI:    http://example.com/twenty-fifteen-child/
 Description:  Twenty Fifteen Child Theme
 Author:       John Doe
 Author URI:   http://example.com
 Template:     twentyfifteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-fifteen-child
*/

@import url('../twentyfifteen/style.css');

この@import~の一行を入れて、親テーマからcssを呼び出してやるのが主流だと思っていたのだが、どうやら最近はそうではないらしく、

最後のステップでは、親テーマと子テーマのスタイルシートをキューに入れます。以前は @import: を使用して親テーマのスタイルシートをインポートしていましたが、これはもはや良い方法ではありませんので注意してください。親テーマのスタイルシートをキューに入れる正しい方法は、子テーマの functions.php で wp_enqueue_script()を使用する方法です。したがって子テーマには functions.php を作成する必要があります。子テーマの functions.php の最初の行は、PHP の開始タグ (<?php) で始め、続けて親テーマと子テーマのスタイルシートをキューに入れます。

と、ワードプレスのオフィシャルに記されていた。げげげ。つまり、functions.phpを子テーマに入れるのみならず、functions.phpから親テーマのcssを呼び出す設定にしないと行けないらしい。今まで(といってもここ数週間だけど)ずっと子テーマに入れたcssに@import_url云々の行を加えてやっていたよ。その方が格段に楽だったんだもの。それなら僕ぐらいのレベルだとfunctions.phpを用意しなくても良かったんだもの。だって、functions.phpは「入力ミスをするとダッシュボードさえ入れなくなってしまうという物凄く恐ろしい事態が頻繁に起こるでしょう。何度も起きたし。

出来てるけどね、@import~でも出来てるんだけど、どうせならオフィシャルが言う通りにしたいじゃないか。で、やってみようと思ったのさ。ああ、こんなんとっかかるんじゃなかったと思ったよ。他の仕事をしていても気になって仕方ない。

一番新しいWPのテーマは「twentyfifteen」。それで子テーマのフォルダを用意してそこに上記だけ記入したstyle.cssを入れる。で、そのあとに、

@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    font-family: Helvetica, Arial, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
}

を入力して、「テーマが指定しているフォントが表示されないじゃないか問題」を回避しつつゴシック体に変えることに成功。だが、上記だと、ウェジットのプルダウンメニューの中の日本語が「明朝」から変えられない。悔しい。あれは、なにで指定するの? 誰か知ってたら教えてっ! その数文字(知らないけど)を上記の{の前に「,」をつけて入れればいいんでしょ?(いや、きっとそうだろう。だとしたら教えてーわかるひとー)

で、そのあとに、小見出し(<h4>)とかの個別指定を入れていけばいいので、とても楽。だが、

これはもはや良い方法ではありませんので注意してください。

と言われているので残念ながらこのままではよくないらしい。で。泣く泣く、怖いけど、@impoertの一行を削除して、つまり子テーマのcssから親テーマのcssを呼び出すのではなくfunctions.phpに記述するオフィシャルお勧めのやり方を試みた。

が、cssと違って関数が絡むと猛烈にわかりづらくなってしまうのが初心者の僕ちゃんだ。MTの関数とはまた違うからんもう。しかも、functions.phpはWPの中でも他の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' );
}
?>

と入力したfunctions.phpを「忘れずに!」Unicode(UTF-8)形式で保存して(これ忘れがち。てか随分前に購入した秀丸エディタがここまで活躍し続けるとは思わなかった)、子テーマのフォルダにアップロードしてみた。これで子テーマはstyle.cssとfunctions.phpだけが入ったことになる。あ、他にもfooter.phpとかチョイ直したものも入れたけど。

で。いざ。子テーマを選び「有効化」してみた。どきどき。う。お。おおお。動いた。ちゃんとエラーにならずに良かった!と思いきや、作業をしてみると、ヘッダーを直そうとすると凍り付く。おや。まやり直してみるが、ヘッダーの背景画像を変えようとすると凍る。動かない。そして、テーマのカスタマイズでヘッダーの色を変えようとしても変わらない。ずっと白いままだ。おんや? なんかおかしい。

で。勉強したことを思い出してみる。そうか。cssファイルが「style.css」一つですべてをまかなっている場合のみ上記の記述でオッケー。そうかそうか。他にあるのかな、cssが。でも、twentyfifteenは軽くなってるし簡素だからおそらくその辺りの「子テーマカスタマイズ」も学習しやすくなってんのかと思ってたけど、他にcssファイルあるのかな。見たけど、一個だけだったような。

ええと。と、ffftpを開いて見てみると、あ。

テーマのフォルダの内にcssフォルダなんていうものがありやがる。開くと「editor-style.cssとie.css、更にie7.css」がある。そうか。これらも使って一緒に直さないとならないのね。そうかぁ。やっぱりちゃんと関数の勉強をしないとならないんかぁ。テキトーにやってみちゃあ駄目なのかなぁ。例えばほら、こんな感じ。

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

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/css/editor-style.css' );
}

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/css/ie.css' );
}

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/css/ie7.css' );
}
?>

こんな感じ?

つまり、四つコピーしてstyle.cssの所を他のcssファイルに変えた。

なんかこれでよさげな感じするんだけど、関数まるでわかんないから試してみてないけど。これでいーの?? 誰か教えてええええんっ! それでいいってんならやってみっからさ。勿論phpファイルの扱いはそれなりに気をつけているよ。<?の前には改行さえ入れちゃ駄目とか?>の後に改行入れちゃ駄目とかそういうのあるっしょ。あと、関数毎に<?phpで囲んでんじゃねえよ。とかね。そこまではなんとか理解した。と思う。全て眉唾だけどね。

本件について。自分が勉強した限りだとこうなのよ。

子テーマの functions.php の最初の行は、PHP の開始タグ (<?php) で始め、続けて親テーマと子テーマのスタイルシートをキューに入れます。以下の例は、親テーマが 1つの style.css ファイルを使用してすべての CSS を保持している場合にのみ動作します。テーマが複数の .css ファイルを持つ場合(たとえば、ie.css、style.css、main.css) すべての親テーマの依存関係を管理する必要があります。依存関係に ‘parent-style’ を設定すると子テーマのスタイルシートは親テーマのあとで読み込まれます。

ということ。誰か教えてくんないかなぁ。面倒だけど、フォーラムに書き込みしようかなぁ。なんて事を思ったりしていますよ。とほほ。

投稿者:

Miyacolor

まぁ、なんとなく楽しく生きていますよ。それで十分でありながら、それでいいのか?って自問自答する日々ですかね。