カスタムフィールドで、同じフォーマットで記事を作る方法【Custom Field Template×Really Simple CSV Importerを使います】

地域サイトを作る際に、例えば店舗の営業時間～電話はじめ同じフォーマットで大量の記事を作りたいみたいな時があると思います。

僕の場合も、まさに同じフォーマットで記事を作りたかったんですよね。

そんな時に便利なのがカスタムフィールドでして、そのために必要なワードプレスのプラグインがCustom Field TemplateとReally Simple CSV Importerです。

ちなみに、カスタムフィールドですが、フィールド(場所)をカスタムすることに由来しています。

こういった感じで、フィールド(場所)もといワードプレスの投稿画面をカスタムして、同じフォーマットで大量の記事を作れるようにしよう！ということなんですね。

そしてそのために必要なのが、先程のCustom Field TemplateとReally Simple CSV Importerという２つのプラグインだったわけです。

まずは、大まかな流れを俯瞰しよう

Custom Field TemplateとReally Simple CSV Importerの使い方に入る前に、まずは大まかな流れを俯瞰したいと思います。

僕含め、初めての方にとっては流れがややこしいからです。

　ステップ１：Custom Field Templateで型を作る

まずは、上記の画像のように、Custom Field Templateで型を作ります。

今回は、横軸にナルトというアニメ名縦軸に項目を設定しましたが、設定したいように設定すればOKです。

で、genre、nannwaとローマ字になっているのが気になると思いますが、プログラミングで言う変数のことでして分かる方は分かるかも。

例えば、エクセルのgenreの部分にバトルと入れると(画像の)genreの部分がバトルになるし(ステップ２で触れます)、エクセルのnannwaの部分に７２０話と入れると(画像の)nannwaの部分が７２０話になる感じですね。

　ステップ２：型に流し込む文章を、エクセルに入力する

次に、上の画像の赤枠青枠のように、ステップ１で指定したローマ字を入力し、オレンジ枠のように型に流し込む文章をエクセルに入力します。

　ステップ３：Really Simple CSV Importerでエクセル(CSV形式)を取り込んで、型に文章を流し込む

ステップ１とステップ２が終了したら、Really Simple CSV Importerでエクセル(CSV形式)を取り込むと、型に文章が流されます。

ステップ２では、genreにバトルnannwaに７２０話と入れていたわけですが、しっかり反映されていますよね。

そんなわけですが、以上が大まかな流れです。

次は、詳細を見て行きましょう。

ステップ０：Custom Field TemplateとReally Simple CSV Importerをインストールする

Custom Field TemplateとReally Simple CSV Importerをインストールしてください。

ステップ１：Custom Field Templateで型を作る

まずは、Custom Field Templateで型を作りたいので、ワードプレスの「設定」→「カスタムフィールドテンプレート」に行ってください。

すると、このような画面になりますので、上の赤枠の[cft] and [cftsearch] Shortcode Formatをクリックしてください。

すると、このような画面になるのですが、上の赤枠の部分に型(表)を作るためのコードを入力します。

ーーーーーここからは、表を作るためのコードについての解説ーーーーー

型(表)を作るためのコード基礎編

ステップ１：trで横一列を作る

<tr>
</tr>

ステップ２：td(見出し(太字)にしたい場合はth)で縦３列を作る

<tr>

<td></td>
<td></td>
<td></td>

</tr>

もし、横２列作りたい場合は以下のような感じ。

ステップ１：trで横二列を作る

<tr>
</tr>

<tr>
</tr>

ステップ２：td(見出し(太字)にしたい場合はth)で縦３列を作る

<tr>
<td></td>
<td></td>
<td></td>
</tr>

<tr>
<td></td>
<td></td>
<td></td>
</tr>

型(表)を作るためのコード実践編

例えば、以下のような型(表)を作りたい場合は以下のような感じ

<table class="cft">　←開始タグ(表を準備するためのコードで、必須です)
<tbody>　　　　　　　　 ←開始タグ(表を準備するためのコードで、必須です)

<tr>
<th></th> 　　　　　   ←１に相当します(空白なので、何も入力していません)
<th>ジャンル</th>　    ←２に相当します(見出しにしたいので、thにしています)
<th>全何話</th>　　    ←３に相当します(見出しにしたいので、thにしています)
</tr>

<tr>
<th>ナルト</th>　　    ←４に相当します(見出しにしたいので、thにしています)
<td>[genre]</td>     ←５に相当します(これから解説します)
<td>[nannwa]</td>    ←６に相当します(これから解説します)
</tr>

</tbody>　　　　　   　←終了タグ(表を準備するためのコードで、必須です)
</table>　　　　   　　←終了タグ(表を準備するためのコードで、必須です)

こういったコードになるのですが、[genre]と[nannwa]が先ほどの通り変数になります。

[]の中にローマ字を入れるのですが、エクセルのgenreの部分にバトルと入れると[genre]の部分がバトルになるし、エクセルのnannwaの部分に７２０話と入れると[nannwa]の部分が７２０話になる感じですね。

ーーーーーここまでが、表を作るためのコードについての解説ーーーーー

さて、型(表)を作るためのコードが理解できたところで、先程のワードプレスの画面に戻りましょうか。

上の赤枠の部分に、あなたが作りたい型(表)のコードを入力してください(今回は、先程紹介したコードを入力します)。

すると、このような画面になりますので、上の赤枠の「オプションを更新する」をクリックしてください。

すると、このような画面になりますので(「カスタムフィールドテンプレートオプション」の部分です)、[genre]と[nannwa]がどんなタイプ(１行から成るテキストなのかチェックボックスなのかはたまた他の何かなのか)の変数なのかを指定します。

ーーーーーここからは、よく使う変数のタイプについての解説ーーーーー

１行から成るテキスト

type = text       ←１行から成るテキストの場合はtextにします
size = 35         ←３５文字にしたい場合は半角で35に、４０文字にしたい場合は半角で40にします
label = ジャンル名  ←どんな変数かが識別しやすいように名前を付けます

複数行から成るテキスト

type = textarea  ←複数行から成るテキストの場合はtextareaにします
rows = 4         ←縦４行にしたい場合は半角で4に、５行にしたい場合は半角で5にします
cols = 40        ←横４０文字にしたい場合は半角で40に、５０文字にしたい場合は50にします

チェックボックス

type = checkbox                 ←チェックボックスにしたい場合はcheckboxにします
value =  １ # ２ # ３ # ４ # ５ ←１～５を選びたい場合は、最初に１。その後は#を付け#2 #3。。と入力します
label = 評価　　　　　　　　　　　　  ←どんな変数かが識別しやすいように名前を付けます

＊その他、ラジオボタンなど調べたい場合は、Custom Field Templateのテンプレートを設定するを参考にしてみてくださいね。

ーーーーーここまでが、よく使う変数のタイプについての解説ーーーーー

さて、変数のタイプが理解できたところで、先程のワードプレスの画面に戻りましょうか。

１の赤枠の部分に(＊１)あなたが作った変数のタイプを入力し、２の赤枠の「オプションを更新する」をクリックしてください。

(＊１)今回は、以下のように入力します。


[genre]
type = text
size = 35
label = ジャンル名

[nannwa]
type = text
size = 35
label = 何話

ステップ２：型に流し込む文章を、エクセルに入力する

次に、型に流し込む文章をエクセルに入力したいので、エクセルorグーグルのスプレッドシートに行ってください(今回は、グーグルのスプレッドシートを使います)。

すると、このような画面になりますので、上の赤枠の部分に先程ステップ１で指定した変数を入力してください(今回は、genreとnannwaを入力します)。

すると、このような画面になるのですが、上の赤枠の部分にデータを入力してください(今回は、genreにバトルnannwaに７２０話を入力します)。

すると、このような画面になるのですが、ステップ３の準備として、あと一作業だけします。

まずは、上の赤枠の「A」をクリックして列を選択してください。

次に、１の赤枠のファイルをクリックし、２の赤枠の「１列を左に挿入」をクリックしてください。

すると、このような画面になりますので、あと５回同じ操作を繰り返してください。

すると、このような画面になりますので、上の赤枠の部分に左からpost_id、post_content、post_title、post_status、post_name、post_typeを入力してください。

すると、このような画面になるのですが、以下を参考にそれぞれ入力してください(今回は、post_idは空白に、post_contentは<!-- wp:paragraph --> <p> [cft format=1] </p> <!-- /wp:paragraph -->に(後程詳細を解説します)、post_statusはpublishに、post_nameはnarutoに、post_typeはpageにします)。

post_id
ワードプレスの記事に割り振られるidです。新しい記事を作成する時は空白でいいのですが、更新したい時に記事id(手動で調べたい場合はこちら、プラグインで調べたい場合はこちらを参照してください)を調べて入力します

post_content
記事の中身です

post_title
記事のタイトルです

post_status
記事の状態(公開(publish)、下書き(draft)、予約投稿(future)など)です

post_name
記事のURLです

post_type
記事の種類(投稿ページ(post)、固定ページ(page))です

＊その他、アイキャッチ画像はじめ調べたい場合は、Really Simple CSV Importer 日本語解説＆カスタマイズ例を参考にしてみてくださいね。

すると、このような画面になるのですが、<!-- wp:paragraph --> <p> [cft format=1] </p> <!-- /wp:paragraph -->の中の[cft format=1]について解説したいので、もう一度ワードプレスの「設定」→「カスタムフィールドテンプレート」に行ってください。

すると、このような画面になりますので、上の赤枠の[cft] and [cftsearch] Shortcode Formatをクリックしてください。

すると、このような画面になるのですが、FORMAT#1となっているのが分かると思うものの(FORMAT#0はデフォルトのサンプルです)、(＊３)だからこそ[cft format=1]と設定するわけですね。

もし、FORMAT#2なら、[cft format=2]と設定します。

＊３グーテンベルクに対応させる場合は、

<!-- wp:paragraph --> <p> [cft format=1] </p> <!-- /wp:paragraph -->

このように囲めばＯＫです。

さて、[cft format=1]が理解できたところで、先程のスプレッドシートの画面に戻りましょうか。

上の赤枠の「ファイル」をクリックしてください。

すると、このような画面になりますので、１の赤枠の「ダウンロード」をクリックし、２の赤枠の「カンマ区切りの値(.csv、現在のシート)」をクリックしてください。

すると、このような画面になりますので、ドラッグ＆ドロップでファイルをデスクトップに移動してください(本来、必ずしもデスクトップに移動する必要がないのですが、解説しやすいのでそうしています)。

すると、このような画面になりますので、上の赤枠の先程ドラッグ＆ドロップしたエクセルのファイルを右クリックしてください。

すると、このような画面になりますので、１の赤枠の「プログラムから開く(H)」をクリックし、(＊２)２の赤枠の「メモ帳」をクリックしてください。

(＊２)少し込み入った話になるのですが、いわゆる文字コードを「Shift-JIS」→「UTF-8」にします。
その際メモ帳が必要になるのですが、マックの場合はmiというテキストエディタなどでできるみたいです。
また、miでのやり方はこちらを参照してください。
今回は、windowsのメモ帳で解説します。

すると、このような画面になりますので、上の赤枠の「ファイル(F)」をクリックしてください。

すると、このような画面になりますので、上の赤枠の「名前を付けて保存(A)...」をクリックしてください。

すると、このような画面になりますので、上の青枠で文字コードが「UTF-8」になっていることを確認し、上の赤枠の「保存(S)」をクリックしてください。

すると、「ファイル名は既に存在します。上書きしますか？」という画面になりますので、上の赤枠の「はい(V)」をクリックしてください。

ステップ３：Really Simple CSV Importerでエクセル(CSV形式)を取り込んで、型に文章を流し込む

最後に、Really Simple CSV Importerでエクセル(CSV形式)を取り込んで、型に文章を流し込みたいので、ワードプレスの「ツール」→「インポート」に行ってください。

すると、このような画面になりますので、上の赤枠の「インポーターの実行」をクリックしてください。

すると、このような画面になりますので、上の赤枠の「ファイルを選択」をクリックしてください。

すると、このような画面になりますので、１の赤枠の「ステップ２で作成したエクセルのファイル」を選択し、２の赤枠の「開く(O)」をクリックしてください。

すると、このような画面になりますので、上の赤枠の「ファイルをアップロードしてインポート」をクリックしてください。

すると、このような画面になるのですが、スプレッドシートのpost_typeをpostにした場合は「投稿」、pageにした場合は「固定ページ」をクリックしてください(今回は、pageにしたので固定ページに行きます)。

すると、このような画面になりますので、該当の記事の「表示」をクリックしてください。

すると、このような画面になるのですが、記事が作成できているのが分かるかと思います。

あとは、引き続きエクセルにデータを入力するもよし、表を修正するもよしという感じですね。

以上です。

お疲れ様でした！

参照

　今回作った表のコード

<table class="cft">
<tbody>

<tr>
<th></th>
<th>ジャンル</th>
<th>全何話</th>
</tr>

<tr>
<th>ナルト</th>
<td>[genre]</td>
<td>[nannwa]</td>
</tr>

</tbody>   
</table>

　今回指定した変数のタイプ

[genre]
type = text
size = 35
label = ジャンル名

[nannwa]
type = text
size = 35
label = 何話

　今回作ったエクセルのサンプルファイル

カスタムフィールドテンプレートサンプル.csv

174 Bytes

ファイルダウンロードについて

ダウンロード

　その他エクセルのサンプルファイル

カスタムフィールドテンプレートサンプル１.csv

706 Bytes

ファイルダウンロードについて

ダウンロード

　Custom Field Templateで、text～checkbox以外(ラジオボタンやセレクトボックスなど)を指定したい場合

Custom Field Templateで簡単にカスタムフィールドをフル活用

　Custom Field Templateで作った不必要な変数を削除したい場合

【WordPress】で不要なカスタムフィールドをデータベース毎削除する方法

例えば今回で言えば、genreとnannwaという変数を作りましたが、それが不要になるということがあると思います。ジャンルについての項目が必要なくなったから変数のgenreが不要になったみたいな。そんな場合についての記事です。

　Really Simple CSV Importerで、post_id～post_type以外(アイキャッチ画像やカテゴリー・タグなど)を指定したい場合

Really Simple CSV Importer 日本語解説＆カスタマイズ例

Really Simple CSV Importerで複数のカテゴリー・タグを指定する場合

【WordPress】Really Simple CSV ImporterのCSVファイルインポートでうまくインポートできない場合に試したほうが良いこと【備忘録】