worldPress初心者向けのfunctions.phpのカスタマイズ、忘備録でもあります。ほとんどコピペですが、参考サイトの紹介とミニ解説付きです。
functions.phpに追加したもの
- 管理画面にパーマリンクを追加（投稿画面のみ）
- 固定ページをphpからhtmlに変更（投稿ページはCustom Permalinksプラグインを使用）
- headerロゴ下にウイジェットエリア追加
- 管理画面にタイトル数の表示
- ショートコードのカテゴリーラベルの表示
- ついでに表示を子カテゴリーに統一
子テーマのfunctions.phpに追記しているのは実用的に利便性が優れたものがほとんどです。
管理画面にパーマリンクの表示と固定ページをhtmlに変更
管理画面にパーマリンクの表示をした理由は記事を書くときに便利なので、それとページ数の確認にもなります。
固定ページをhtmlに変更したのは、静的サイトからWordPressへ移転してアドレスを変えることができないので今まで通りhtmlにしました。移転する際にまず最初にやったコードの追加です。
まずは管理画面の投稿一覧にパーマリンクを追加のコードです
functions.phpに追加していきます
コードを変更するときは必ずバックアップを取る習慣を付けよう！
//WordPress 管理画面の投稿一覧にパーマリンクを追加//
function add_custom_column( $defaults ) {
$defaults['permalink'] = 'パーマリンク';
return $defaults;
}
add_filter('manage_posts_columns', 'add_custom_column');
function add_custom_column_id($column_name, $id) {
if($column_name == 'permalink'){
echo get_permalink();
}
}
add_action('manage_posts_custom_column', 'add_custom_column_id', 10, 2);固定ページをhtmlに変更するコード
参考にしたサイト
//固定ページのURLに.html//
add_action( 'init', 'mytheme_init' );
if ( ! function_exists( 'mytheme_init' ) ) {
function mytheme_init() {
global $wp_rewrite;
$wp_rewrite->use_trailing_slashes = false;
$wp_rewrite->page_structure = $wp_rewrite->root . '%pagename%.html';
// flush_rewrite_rules( false );
}
}投稿ページは Custom Permalinksプラグイン
プラグインをインストールし記事を書く際に好きなパーマリンクを書きます、htmlに変更すのはWordPressのパーマリンク設定でカスタム構造に選択したらhtmlになるように書き込みす。
参考サイト
headerロゴ下にウイジェットエリア追加
ウイジェットエリアに追加した理由はヘッダーに検索窓を設置したい！というのが大きな理由です。ですが好きな場所にウイジェットエリアが追加できるなんでさすがWordPressだな～と感じました。詳しくは別ページに設置の仕方を載せています。
Ｃocoonカスタマイズ・ヘッダーに検索窓を表示する方法
ソースコードはこちら。
// ヘッダーロゴの下に出力をする//
add_filter('wp_header_logo_after_open', 'add_header_contents');
function add_header_contents() {
dynamic_sidebar('add-header-contents');
}
// アナウンス枠エリアウィジェット//
if (function_exists('register_sidebar')) {
register_sidebar(array(
'name' => 'ヘッダー領域追加コンテンツ',
'id' => 'add-header-contents',
'description' => 'ヘッダー領域に追加コンテンツを表示するウィジェットです。',
'before_widget' => '<div class="add-header-contents">',
'after_widget' => '</div>',
));
}管理画面にタイトル数の表示をする
使っているCocoonのテーマには投稿記事を書く画面にはSEOタイトル文字数が表示がありますが、どうしても一覧表示画面に表示したいので追加しました。
本文の文字数も一緒にみれるし、伝わる文字数もおおよそ考えれるので便利です！
参考にしたサイトはCocoonの開発者のわいひらさんです。
ソースコードはこちら。
//管理画面一覧タイトル文字数カウンター//
function count_title_characters() {?>
<script type="text/javascript">
jQuery(document).ready(function($){
function count_zen_han_characters(str) {
len = 0;
str = escape(str);
for (i=0;i<str.length;i++,len++) {
if (str.charAt(i) == "%") {
if (str.charAt(++i) == "u") {
i += 3;
len++;
}
i++;
}
}
return len / 2;
}
function count_characters(in_sel, out_sel) {
$(out_sel).html( count_zen_han_characters($(in_sel).val()) );
}
?$('#titlewrap').after('<div style="position:absolute;top:-24px;right:0;color:#666;background-color:#f7f7f7;padding:1px 5px;border-radius:2px;border:1px solid #ccc;">文字数 :<span class="wp-title-count" style="margin-left:5px;">0</span></div>');
count_characters('#title', '.wp-title-count');
$('#title').bind("keydown keyup keypress change",function(){
count_characters('#title', '.wp-title-count');
});
});
</script><?php
}
add_action( 'admin_head-post-new.php', 'count_title_characters' );
add_action( 'admin_head-post.php', 'count_title_characters' );ショートコードのカテゴリーラベルの表示する方法
ショートコードの時はカテゴリー表示がないんですね、ほとんど自分が見たときのに忘備録なのですが（カテゴリーが多いので）。
見た目もわかりやすくて良いので追加しています。
//ショートコードのカテゴリーラベルの表示//
add_filter('is_widget_entry_card_category_label_visible', '__return_true');カテゴリラベル表示 を子カテゴリーに統一
当サイトの場合「QOOY’S NOTE」が親カテゴリーで子カテゴリーは表示されないと、わかりにくいんですよね。子カテゴリーが表示されることで読者の方にもわかりやすく役に立つのではないかと思いまして追加しました。
参考したサイト
//カテゴリラベル（アイキャッチのカテゴリ表示）を子カテゴリで統一する//
function get_the_nolink_category($id = null, $is_visible = true){
if ($id) {
$categoryArray = get_the_category($id);
} else {
$categoryArray = get_the_category();
}
$display_class = null;
if (!$is_visible) {
return;
}
if (isset($categoryArray[0])) {
$ret = $categoryArray[0];
foreach($categoryArray as $category)
{
if($category->category_parent != 0)
{
$ret = $category;
break;
}
}
return '<span class="cat-label cat-label-'.$ret->cat_ID.'">'.$ret->cat_name.'</span>';
}
}functions.phpカスタマイズについて
そもそもfunctions.phpってなに？て思ういますよね、functions.phpはWordPressの基幹を担っているファイルです。そう、とっても大事なファイル。
関数を定義しておいたり、ショートコードというコードを用意しておいたり、WordPressを使う上で必要なコードを記述しておくことができるのです。
なので、初心者がイジるのはかなり怖いので必ずバックアップを取ることで直しがききます。記述を失敗してWebサイトが真っ白になることもあるので（汗）気をつけてください。
本当はfunctions.phpのカスタマイズはなるべくしたくないのが本音ですが・・・
こうだったら便利だな～と思うことができるWordPressの関数を知ってしまうと・・・恐ろしい中毒を引き起こします。（カスタマイズ病）
最後に・・・
やっとWordPressの使い方がわかってきたこの頃。
カスタマイズも終盤？となってきたので次は内容の充実化を図っていきます。worldPress初心者でもコピペ（バックアップを取ることを忘れないで！）でとても便利使えるんですね！すごい、本当です、
追記
ページスピード改善で追加したコード
- jetpackのCSS非表示（ほとんど使わないの）
- レンダリングブロックしているJavascriptの読み込みを遅らせる
（wp_headで読む込みをwp_footerにする、これだけで随分改善） - レンダリングブロックしているGutenbergエディターとプラグインのCSSを読み込みを遅らせる
（Gutenbergエディターは使っているので削除はしませんでした）
