WordPress テーマ Customizr でカスタムポストタイプの分類が一覧表示されるページをカスタマイズするまでにやったこと

Customizrでカスタムポストタイプの分類を一覧表示するためにやったこと

 

かなり混乱したので忘れないように

 

    1. Custom post type UI で「雀士」というカスタムポストタイプをつくる
      • ポストタイプ(post type)・・・雀士(player)
      • 分類(taxonomy)・・・・・・・タイプ(type)
      • ターム・・・・・・・・・・・・女流プロ雀士・男性プロ雀士・有名人・天鳳関係・キャラクター

*タームの作成画面はメニューから分類名(タイプ)を選択するとでてくる

    1. Custom post type を使いやすくするプラグイン Advanced custom field で「雀士」というフィールドグループを作成し、player_birth , player_blood_type , player_class , player_nickname , player_image , player_blog などのフィールドを作成

 

    1. フィールドをページに表示させるために、single.php などのファイルに Advanced custom field のコードを記載しなくてはいけないのだけど、使っているテーマ「Customizr」には single.php のファイルがなかったので index.php にコードを記入。*個別記事ページのテンプレート階層の優先順位は、① single-player.php ② single.php ③ index.php

 

  1. この時点で問題が2つ① テーマがアップデートされると、書いたコードがきえてしまう② index.php にコードを書いたらちゃんと表示はされたけれど、ラベルを表示したり、テーブルの中に表示したいけど、ラベルや空のテーブルは html で書くことになるので、当然ながら他のページにもそれらが表示されてしまう。 例えば、「血液型:O型」と表示させたくても 「血液型」の部分やテーブルは関係ないページにまで表示されてしまう

子テーマをつくったら問題が解決した

    1. まずは、以前の記事で書いたように、親テーマがアップデートされても子テーマは影響を受けないので ①番目の問題は解決。具体的なやり方もこちらに記載。子テーマをつくっておけば、親テーマがアップデートされても子テーマで編集した内容は影響を受けない
  1. ②番目の他の関係ないページまでにラベルやテーブルが表示されてしまうという問題を解決するために、子テーマに single-player.php をつくり、Customizrの親テーマの custom-page.php をコピーして、そこに Advanced custom field のコードを記載。コードはいろいろな書き方が紹介されていていろいろ試したけど上手く表示されたりされなかったりで、結局はリンクしてある本家のページで紹介されているコードを書いたらうまくいった。これでカスタムポストタイプ「雀士(player)」のページだけにhtmlで書いたラベルとテーブルが表示されて、フィールドの記入があればそのページのフィールドの内容も表示されるようになった!

カスタムフィールドの分類名の一覧が表示されるページにカスタムフィールドの内容が表示されない

    1. ところがここで③つめの問題。カスタムフィールドの分類名「(例)女流プロ雀士」の一覧が表示されるページにカスタムフィールドでつくった内容が表示されない。(個別のページには表示されてるのに)アーカイブのページには通常のエディタに書いた内容だけが表示されるような仕様になっているよう
    1. そこで、子テーマに taxonomy-type.php をつくって親テーマから archive.php をコピペしようとしたけど、「Customizr」には archive.php がない。ちょっと特殊なテーマみたい。テーマをかえようかと思ったけどデザインが気にいってしまったので意地でもこのテーマで頑張ろうと「Customizr」のファイルを読めないのに読みまくって class-content-post_list.php というファイルがどうも archive.php のようなものかと class-content-post_list.php をコピペして子テーマの taxonomy-type.php に貼付けてみたら・・・・・分類名「女流プロ雀士とか」のページが消えた!
  1. 「Customizr」には、taxonomy.php も single.php もないので「Customizr」の親テーマの custom-page.php を子テーマの toxonomy-type.phpにコピペ → 子テーマの taxonomy-type.php の中にカスタムフィールド「雀士(player)」のコードを記入して、分類が一覧表示されるページ「女流プロ雀士とか」をみてみると・・・・・ちゃんとフィールドの内容も一覧表示されてたー!!やったことを整理してみると、結局同じ内容で名前の違うファイルが2つあるということか。なんかちょっと変な気はするけど(混乱)

    Customizr 子テーマの中のファイル

     

    single-player.php・・・・・親テーマの custom-page.php をコピペしてカスタムフィールド「雀士(player)」のコードを記載

    taxonomy.php・・・・・・親テーマの custom-page.php をコピペしてカスタムフィールド「雀士(player)」のコードを記載

Advanced custom field のコード記入に参考になるページ


WordPressテーマのカスタマイズは子テーマでする

Advanced custom fieldでつくったフィールドを表示させようと悪戦苦闘してやっとできた時に「Customizr」のアップデートを要求された。「編集した内容はすべて消えてしまいます」みたいな警告があったので一応コードをメモしてアップデートを実行したら、やっぱり消えてしまう。

 

さて、アップデートされても編集した内容をキープするためにはどうすればいいのかいろいろ調べたら、子テーマを作成してそれをカスタマイズすれば、親テーマがアップデートされても子テーマで編集した内容は影響を受けないということがわかった。

 

「あーまた、大変な作業が待っている」と思ったら結構簡単にできた!忘れない様にメモ

 

 

子テーマをつくっておけば、親テーマがアップデートされても子テーマで編集した内容は影響を受けない

 

  1. 親テーマと同じディレクトリ(階層)に子テーマのフォルダをつくる(名前は自分でつけてOK)
  2. 子テーマのフォルダの中に、自分がカスタマイズしたいファイル(例:style.css など)をつくる
    *フォルダの中には style.cssを含んだファイルが2個以上ないとエラーになる模様 たぶん
  3. ファイルには下記のようにコードを記入

 

 

Theme Name: 子テーマの名前(自分で名前をつける)

Template: 親テーマのディレクトリ名(大文字・小文字区別)

*/

@import url (“../親テーマのディレクトリ名/親テーマの読み込みたいファリル名“);

 

記入例がこちら

 

/*
Theme Name: Customizr Child
Template: customizr
*/

@import url(“../customizr/custom-page.php“);

 

 

あとは編集したい内容をこの下に書いていけばOK

 

参考にしたページ
WordPressテンプレートのカスタマイズは子テーマで