やっぱり忘れたWordPressのカスタムフィールドの使い方

#はじめに

少し離れると忘れてしまうWordPressの使い方。自分だけかなぁ。

特に忘れやすいのがカスタムフィールドを使ったページ遷移のあるページ作り。
何とか忘れないようにと書いていきます。

#プラグインの準備

以下のプログインをインストールして有効化します。

* Advanced Custom Fields: 言わずと知れたカスタムフィールド本体です。
* Custom Post Type UI: カスタムフィールドの内容を設定するパネルです。
* WP-PageNavi: ページナビゲーション

#Custom Post Type UIの設定

1. サイドメニュー[CPT UI] > [新規追加]　を選択します
2. 投稿タイプを設定します　※　ここでは、「profile」とします
3. Advanced Optionsリンクを選択して、 Has Archive? を true　に変更します
4. サポートのチェックボックスを必要に応じてチェックします
5. create Custom Post Typeボタンをクリックします

![wordpress01.jpg](https://qiita-image-store.s3.amazonaws.com/0/57930/9fe04db2-bd25-8800-40f5-f78525ed10b4.jpeg)

![wordpress02.jpg](https://qiita-image-store.s3.amazonaws.com/0/57930/4c75ff35-2c66-e387-2b55-f2d521da1e69.jpeg)


#Advanced Custom Fieldsの設定

1. サイドメニュー[カスタムフィールド]を選択します
1. 新規追加ボタンをクリックします
1. タイトルを設定します
1. 必要に応じてフィールドを追加します。
  ※　ここでは、「プロフィール」というカスタムフィールドを作成しています。
1. 右サイドの更新ボタンをクリックします
1. ルール欄を「投稿タイプ」「等しい」「Custom Post Type UIの投稿タイプ名」にします


![wordpress03.jpg](https://qiita-image-store.s3.amazonaws.com/0/57930/b3f5a156-27e7-d68c-f06d-e06f2cd6c3a3.jpeg)
 
![wordpress04.jpg](https://qiita-image-store.s3.amazonaws.com/0/57930/de8a1c0d-cf9d-7ffb-64b0-076f3c66979f.jpeg)

![wordpress07.jpg](https://qiita-image-store.s3.amazonaws.com/0/57930/214c1c9c-9bf1-bdf6-0900-d6342c497c16.jpeg)


#表示設定の変更

1. サイドメニュー[設定] > [表示設定]を選択します
2. 「1ページに表示する最大投稿数」を「１」に変更します。

※　ページング設定する際、この値がいろいろと影響を与えるので、最小値にしておきます。

![wordpress05.jpg](https://qiita-image-store.s3.amazonaws.com/0/57930/368bf2aa-5474-69f4-6a9b-5827269ba3d5.jpeg)

#カスタムフィールドの値を設定

1. Custom Post Type UIの投稿タイプ名のサイドバーメニューを選択します
2. 値を追加します

![wordpress06.jpg](https://qiita-image-store.s3.amazonaws.com/0/57930/30ad0948-ab4e-2805-ac31-84e37628d2d0.jpeg)


#archive-xxxx.phpファイルの作成

1. デフォルトでは、テーマが「twentyfourteen」になっていますので、そこのフォルダーのarchive.phpをコピーして、archive-[Custom Post Type UIの投稿タイプ名].phpを作成します
   ※ ここでは、profileにしているので「archive-profile.php」となります。
   ※ [WordPressダウンロード先]\wordpress\wp-content\themes\twentyfourteenフォルダーになります
2. archive-xxxx.phpファイルを変更します

```lang:archive-profile.php
<?php
/**
 * The template for displaying Archive pages
 *
 * Used to display archive-type pages if nothing more specific matches a query.
 * For example, puts together date-based pages if no date.php file exists.
 *
 * If you'd like to further customize these archive views, you may create a
 * new template file for each specific one. For example, Twenty Fourteen
 * already has tag.php for Tag archives, category.php for Category archives,
 * and author.php for Author archives.
 *
 * @link http://codex.wordpress.org/Template_Hierarchy
 *
 * @package WordPress
 * @subpackage Twenty_Fourteen
 * @since Twenty Fourteen 1.0
 */

get_header(); ?>

	<section id="primary" class="content-area">
		<div id="content" class="site-content" role="main">



<!-- 変更した場所　開始 -->
    <?php
        global $query_string;                 // query_postsで使用する変数
        parse_str( $query_string, $args );    // query_postsに連想配列を使用できるように設定
        $args[post_type] = array('profile');  // post_typeを設定
        $args[orderby] = 'title';             // ソート設定
        $args[order] = 'ASC';                 // 昇順でソート,DESCが降順
                                              // 現在のページ番号取得
        $args[paged] = get_query_var( 'paged' ) ? get_query_var( 'paged' ) : 1;
        $args[posts_per_page] = 2;            // 1ページに表示する数
    ?>

    <?php if ( have_posts() ) : query_posts($args); ?>
        <table>
            <?php while ( have_posts() ) : the_post(); ?>
                <tr>
                    <td>
                        <?php echo post_custom('name'); /* カスタムフィールドで設定したフィールド値を取得 */?>
                    </td>
                    <td>
                        <?php echo post_custom('sex'); /* カスタムフィールドで設定したフィールド値を取得 */?>
                    </td>
                </tr>
            <?php endwhile; ?>
        </table>
        <?php wp_pagenavi(); ?>
    <?php endif; ?>

    <?php wp_reset_query(); /* query_postsリセット */ ?>

<!-- 変更した場所　終了 -->



		</div><!-- #content -->
	</section><!-- #primary -->

<?php
get_sidebar( 'content' );
get_sidebar();
get_footer();
```

以下は、お決まりのパターンです。

```lang:パターン
    <?php if ( have_posts() ) : query_posts($args); ?>
            <?php while ( have_posts() ) : the_post(); ?>
                   :
                   :
            <?php endwhile; ?>
        <?php wp_pagenavi(); ?>
    <?php endif; ?>

    <?php wp_reset_query(); /* query_postsリセット */ ?>
```

3. サーバーにアップロードします


#おわりに

Advanced Custom Fieldsの設定のルールの設定をよく忘れてしました。
あと、表示設定の変更の「1ページに表示する最大投稿数」がはまりやすい罠です。

扱いやすく便利なWordPressをもっと身近にするために、このあたりをきっちり覚えておきたいです。
でも、忘れんだよなぁ。。。