ヘッダーの改変でもそうでしたが、当然ながらcssだけの変更では済むはずがなく、テンプレートファイルそのものやfunctions.phpを弄ることになります。ここでは functions.php について書きましょう。
前の記事、メディアクエリについての続きです。
functions.php の中身もこれまでは混沌としていました。あちらこちらの天才たちがサイトに載せている便利な関数をコピペしまくっただけのものですが、数が増えてきて管理不能に陥ります。ある関数はあるサイトで使い、ある関数はあるサイトとあるサイトで使い、と使い回しもでたらめ、ここは奮起してfunctions.phpも整理するのだ、と決意します。
整理することが可能か
たくさんのお気に入り関数があったりします。テーマに特化した関数の改造もあります。サイトに応じて必要だったり不要だったりする関数もあります。複数のサイトを管理していますので、こうした関数がそれぞれサイトで入り乱れている状況に危機感を感じていました。ですのでこれも整理していきたいと思います。整理することが出来るのか。できます。こうします。
関数ファイルを複数用意してfunctions.phpに読み込んで使う
そうです。モジュール化してパーツとして読み込むのです。
読み込む方法はいくつかあって、ひとつは include です。他に require を使う方法もありますし、それ以外にもあるかもしれません。関数を分類に応じて複数ファイルに保存し、function.php に include または require で読み込みます。
include と require の違い
賢人の言葉を借りますと、includeはエラーが出ても処理を続行し、requre はエラーが出たら処理を止めるとのことです。
例えば、存在しないファイル、パスの間違ったファイルを読み込むように指定してしまった時に include はそのまま指定を無視して他の処理が続行しますが、requre では エラーが表示されウェブページのレンダリングを止めます。エラーがあってもお構いなしってのを選ぶか、エラーに気づきやすいほうを選ぶかの違いです。そういうふうに認識していいそうです。
書き方
functions.php の書き方は、関数がだーーーーっと繋がった書き方がされていることが多いですよね。これ初心者泣かせですね。私も何年も泣いていました。意味分からないんですもん。
<?php // 処理 ; // 次の処理 ; // 次の処理 ;
何ですかこれ。
functions.phpもphpですから冒頭に
<?php
があって、そのあとはひたすら関数が続くんですよ。?> で閉じていないんですよ。どうやら、一つの関数がだーっと続いているだけのこういう書式の場合、閉じなくてもかってに閉じたことになるらしいんです。htmlの<p>と似たようなことですか？まあ、何しろ関数をだらだらと繋げて書いているのだと判れば少し進展です。
ただ一つの関数がだらだらだらーっと続くこの書き方、これ必須なのかどうなのか、必須なんでしょうか。例えば、途中で ?> で止めて、また<?php って始めてもいいんでしょうか。知りませんわかりません。駄目な気がします。
さてそんなわけで子テーマのフォルダ内に私は「lib」というフォルダを作りました。この中にfunctionsの部品を入れるのです。例えば部品の一つに「theme.php」と名付けました。ここには、twentysixteenというテーマが持つ特化した関数を書いています。
もちろん、このtheme.phpというのもfunctions.phpと同じような書き方をします。<?phpで始めて、途切れさせずだらだらと関数が続きます。関数それぞれの先頭に「//コメント」を必ず入れますね。ついでに文頭にも同じくコメントアウトで目次を作りました。目次作っておくと便利です。
これをfunctions.phpに読み込みます。
functions.phpにこう書きます
<?php require get_stylesheet_directory() . '/lib/theme.php';
なんとこれでtheme.phpの内容がfunctions.phpに読み込まれ実行されるんです。これはイケる。
get_stylesheet_directory()
は、子テーマのフォルダ在処を示す関数です。パスっていうんでしょうか。子テーマ内に「lib」というフォルダを作ってtheme.phpを読み込みますから、上記のような書き方となります。
関数を繋げて書く難しい書き方なので、途中に「.」が入って、これは「繋げる」という意味ですが、こうして繋がった一行が子テーマの読み込むべきファイルを指定しているということですね。
同様にして、いくつかの関数ファイルを作ってfunctions.phpに読み込みました。functions.phpには読み込み以外の関数がありません。すっきりです。私の例ではこのような状態に。
私のfunctions.phpはこんなです（例）
<?php require get_stylesheet_directory() . '/lib/init.php'; // 全サイト共通の必須関数 require get_stylesheet_directory() . '/lib/theme.php'; // theme 固有の関数 require get_stylesheet_directory() . '/lib/custom.php'; // カスタム関数、ショートコード require get_stylesheet_directory() . '/lib/child.php'; // チルドサイト専用 // require get_stylesheet_directory() . '/lib/movieboo.php'; // movieboo専用
この稿、functions.phpの整理について、それと、実際に試用するコードの実例なども交えて書いていこうとしていましたが、具体例については独立したポストにたほうがいいかもしれません。でもいくつか実例も出しておきましょうか。
利用している関数の例
どのサイトにも共通で使う自分必須項目ってのがあります。自分にとっての必須項目って意味です（そのままやがな）例えばこんなのがあります。
抜粋 excerpt の「…」をカスタマイズ 「続きを読む」にクラスを付ける
// 抜粋 excerpt の「...」をカスタマイズ 続きを読むにクラスを付ける
function new_excerpt_more($more) {
return ' ... <a class="more more-link" href="'. get_permalink() . '">続きを読む</a>';
}
add_filter('excerpt_more', 'new_excerpt_more');
「続きを読む」で続きへジャンプしない
// 続きを読むで続きへジャンプしない
function remove_more_jump_link($link) {
$offset = strpos($link, '#more-');
if ($offset) {
$end = strpos($link, '"',$offset);
}
if ($end) {
$link = substr_replace($link, '', $offset, $end-$offset);
}
return $link;
}
add_filter('the_content_more_link', 'remove_more_jump_link');
descriptionにタグを使えるようにする
// descriptionにタグを使えるようにする remove_filter( 'pre_term_description', 'wp_filter_kses' );
内部リンクのピンバック無効
// 内部リンクのピンバック無効
function no_self_ping( &$links ) {
$home = get_option( 'home' );
foreach ( $links as $l => $link )
if ( 0 === strpos( $link, $home ) )
unset($links[$l]);
}
add_action( 'pre_ping', 'no_self_ping' );
他にもいろいろありますが、これらがどのサイトだろうがどのテーマだろうが必須項目なのでして、こういうのを集めてinit.phpなんて格好を付けた名前にして読み込んでます。
他は、テーマに関する関数もあります。twentysixteenで用意された関数を変えたいときに使うパターンです。
親のテーマフォルダに「inc」というフォルダがあって、その中のtemplate-tag.phpやcustomizer.phpというファイルにも関数が仕込んであります。これらを改変するときは子テーマに「inc」フォルダを作って同じファイルを用意しても無駄です。これらはfunctions.phpで再定義するんですよ。知ってました？私は知りませんでしたが知りました。
そういうテーマに関する改変は私の場合theme.phpと名付けたファイルに集めました。
twentysixteen_entry_meta()を再定義
テンプレートに登場するメタ情報の関数、twentysixteen_entry_meta()を変更します。twentysixteen_entry_meta の中にはこれまた独自関数twentysixteen_entry_taxonomies()が使われていますので、これも改造します。以下はあくまで一例ですよ。
// twentysixteen_entry_metaのカスタマイズ（フォーマットとコメントを消して並べ替える）
function twentysixteen_entry_meta() {
if ( 'post' === get_post_type() ) {
twentysixteen_entry_taxonomies();
}
if ( 'post' === get_post_type() ) {
$author_avatar_size = apply_filters( 'twentysixteen_author_avatar_size', 49 );
printf( '<span class="byline"><span class="author vcard">%1$s<span class="screen-reader-text">%2$s </span> <a class="url fn n" href="%3$s">%4$s</a></span></span>',
get_avatar( get_the_author_meta( 'user_email' ), $author_avatar_size ),
_x( 'Author', 'Used before post author name.', 'twentysixteen' ),
esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ),
get_the_author()
);
}
if ( in_array( get_post_type(), array( 'post', 'attachment' ) ) ) {
twentysixteen_entry_date();
}
}
// twentysixteen_entry_taxonomiesのカスタマイズ
function twentysixteen_entry_taxonomies() {
$categories_list = get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'twentysixteen' ) );
if ( $categories_list && twentysixteen_categorized_blog() ) {
printf( '<span class="cat-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
_x( 'Categories', 'Used before category names.', 'twentysixteen' ),
$categories_list
);
}
$tags_list = get_the_tag_list( '', _x( ' ', 'Used between list items, there is a space after the comma.', 'twentysixteen' ) );
if ( $tags_list ) {
printf( '<span class="tags-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
_x( 'Tags', 'Used before tag names.', 'twentysixteen' ),
$tags_list
);
}
}
それから、「前へ」「次へ」のナビゲーションもtemplate-tagsで定義されているのですが、これを改造します。
[追記] これ勘違いでした。ナビゲーションの設定はfunctions.phoじゃなくてテンプレート.phpが受け持っていました。このカスタム関数はこれはこれで使いますが、通常は各テンプレートファイルの該当箇所を少し弄るだけで十分かと思います。
前へ、次へのポストメニュー カスタム
//前へ 次へ twentyfourteenからカスタム//*** カテゴリー内移動true付き
function twentyfourteen_post_nav() {
// Don't print empty markup if there's nowhere to navigate.
$previous = ( is_attachment() ) ? get_post( get_post()->post_parent ) : get_adjacent_post( false, '', true );
$next = get_adjacent_post( false, '', false );
if ( ! $next && ! $previous ) {
return;
}
?>
<nav class="navigation post-navigation" role="navigation">
<h2 class="screen-reader-text"><?php _e( 'Post navigation', 'twentyfourteen',true ); ?></h2>
<div class="nav-links">
<?php
if ( is_attachment() ) :
previous_post_link( '%link', __( '<span class="meta-nav" aria-hidden="true"><span class="genericon genericon-previous"></span>Published In</span><span class="post-title">%title', '' ),true );
else :
previous_post_link( '%link', __( '<span class="meta-nav" aria-hidden="true"><span class="genericon genericon-previous"></span>Previous Post</span><span class="post-title">%title', '' ),true );
next_post_link( '%link', __( '<span class="meta-nav">Next Post<span class="genericon genericon-next"></span></span>%title', 'twentyfourteen' ),true );
endif;
?>
</div><!-- .nav-links -->
</nav><!-- .navigation -->
<?php
}
ヘッダーイメージ画像のサイズを変更
カスタマイザーで選択するヘッダー画像はサイズが固定されていますよね。これを変えます。これは親テーマ /inc/customizer.phpで定義されています。
/**
* 親 inc/template-tag より 'custom-header' の幅と高さを変更.
*
* @since Twenty Sixteen 1.0
*
* @param array $args {
* An array of custom-header support arguments.
*
* @type string $default-text-color Default color of the header text.
* @type int $width Width in pixels of the custom header image. Default 1200.
* @type int $height Height in pixels of the custom header image. Default 280.
* @type bool $flex-height Whether to allow flexible-height header images. Default true.
* @type callable $wp-head-callback Callback function used to style the header image and text
* displayed on the blog.
* }
*/
add_theme_support( 'custom-header', apply_filters( 'twentysixteen_custom_header_args', array(
'default-text-color' => $default_text_color,
'width' => 1260,//←ここ変えた
'height' => 240,//←ここ変えた
'flex-height' => true,
'wp-head-callback' => 'twentysixteen_header_style',
) ) );
メニューの説明を表示する
ダッシュボードからメニューを選んでメニューを設定しますよね、そのときメニュー項目にはオマケ表示があって「属性」とか「自分との関係」とか「説明」などがあります。この中で「説明」を書いたのですがテンプレートで表示する方法が判りません。調べました。なんと、メニューの説明を表示するのはたいそう難しいことでした。コアファイルの中の某かを丸ごとコピーして一部改変するんです。チルドサイトに実例があります。
・・・これについて書こうと思いましたが長くなりそうな上にややこしくて自分もまだ理解しきっていないのでまた別の機会があればと。
と、他にもありますがこのようなテーマファイルが独自に定義した関数を変更する場合に「theme.php」を作ってそれを読み込んでいるという話でした。
他にも、重要度が少し下がるカスタム関数、サイトごと独自に必要な関数、そういった分類ごとにphpファイルを作って、モジュールを組み込むようにfunctions.phpに読み込むという、何とも効率良さげなfunctions.phpの管理方法のお話でした。
かなりの長丁場になっております。でもまだ「最小限の」シリーズでした。この先大丈夫か、わし。
次は最小限といいながら最小限とは言い難いカスタマイズです。検索ボタンです。
WordPressに用意されているウィジェットの検索を使う限り、カスタマイズは不要です。でもやりました。それを次のページで書きます。次ページ、検索ボタンについてです。
