WordPressのカスタムフィールドの値で、都道府県別一覧ページを作成する方法

2024/03/12　What's Up, サイト制作　投稿者：前原

WordPressのカスタム投稿に、住所のカスタムフィールドを追加して、都道府県別一覧を表示するソースを作成しましたので、ご紹介します。

ある程度WordPressをカスタマイズできる方向けの内容となっています。
今回使用する部分以外の説明やコードは省いていますので、参考にする際は適宜変更してください。
また、テーマの編集は自己責任でお願いいたします。

例として作成するのはショップの都道府県別一覧で、
環境はWordPressバージョン6.4.3です。

カスタム投稿「ショップ」の作成

functions.phpを編集

WordPressテーマのfunctions.phpを編集して、カスタム投稿「ショップ」を作成します。
※functions.phpの編集は、サイト自体が表示されなくなる可能性があるので慎重に行いましょう。

//カスタム投稿タイプ「ショップ」
function new_post_type() {
  register_post_type(
    'shop',//投稿タイプ名
    array(
      'label' => 'ショップ',
      'labels' => array(
      	'name' => 'ショップ',
        'add_new' => '新規ショップ追加',
        'add_new_item' => '新規ショップを追加',
        'edit_item' => 'ショップを編集',
        'view_item' => 'ショップを表示',
        'search_items' => 'ショップを検索',
      ),
      'public' => true,//管理画面とサイト上に表示する
      'hierarchical' => true,//階層構造にする
      'has_archive' => true,//アーカイブページ生成
      'menu_icon' => 'dashicons-store',//アイコンの変更
      'supports' => array(//記事編集画面に表示する項目指定
        'title',//タイトル
        'editor',//本文
        'page-attributes',//ページ属性・順序
        'thumbnail',//アイキャッチ画像
      ),
      'show_in_rest' => true,
      'menu_position' => 4 //「投稿」の下に追加
    )
  );
}
add_action('init', 'new_post_type');

//カスタム投稿タイプ「ショップ」

function new_post_type() {

register_post_type(

'shop',//投稿タイプ名

array(

'label' => 'ショップ',

'labels' => array(

'name' => 'ショップ',

'add_new' => '新規ショップ追加',

'add_new_item' => '新規ショップを追加',

'edit_item' => 'ショップを編集',

'view_item' => 'ショップを表示',

'search_items' => 'ショップを検索',

'public' => true,//管理画面とサイト上に表示する

'hierarchical' => true,//階層構造にする

'has_archive' => true,//アーカイブページ生成

'menu_icon' => 'dashicons-store',//アイコンの変更

'supports' => array(//記事編集画面に表示する項目指定

'title',//タイトル

'editor',//本文

'page-attributes',//ページ属性・順序

'thumbnail',//アイキャッチ画像

'show_in_rest' => true,

'menu_position' => 4 //「投稿」の下に追加

)

);

}

add_action('init', 'new_post_type');

これで、管理画面のメニューに「ショップ」が作成できました。

カスタムフィールドの追加

続いて、「ショップ」の記事にカスタムフィールドを追加するために、
プラグイン「Advanced Custom Fields」（以下ACF）をインストール、有効化します。

※2024/03/12現在、最新バージョンが6.2.7ですが、フィールド名が変更できない不具合があったため、6.2.6.1にダウングレードしました。

ACFのメニューでフィールドグループを新規追加します。

フィールド「郵便番号」の追加

フィールドタイプをテキスト、
フィールドラベル・フィールド名を「郵便番号」にしたフィールドを追加します。
フィールド名はキーになりますので、あとから変更しないように決めましょう。

プレースホルダーには統一したい形式の見本を入れておきます。
「000-0000」としました。

必須項目にします。

フィールド「住所」の追加

フィールドタイプをテキストエリア、
フィールドラベル・フィールド名を「住所」にしたフィールドを追加します。

テキストエリアの行数は2行にしました。

プレースホルダーには、
「必ず都道府県名からご入力ください（市町村からだと一覧に表示されません）」
と注意書きを入れておきました。
このあと、一覧ページに表示するときに都道府県名で抽出するためです。

こちらも必須項目にします。

フィールドを表示する場所の設定

続いてページ下部にある「設定」で、投稿タイプ「ショップ」で表示するように設定します。
　

　
全て出来たらフィールドグループ名を「ショップ」にして、保存してください。
　

　
　
これでショップ編集画面に「郵便番号」と「住所」のカスタムフィールドが追加されました。

「ショップ」の各記事を表示するページの作成

続いて、ショップのシングルページの作成です。

single-default.phpの作成

もともとあったsingle.phpをコピーして、single-default.phpを作成します。
中のコードはそのままでOKです。

single.phpの編集

single.phpの中身を、以下のコードに変更します。

<?php
  $post = $wp_query->post;
  if (is_singular('shop')) {
	  include(TEMPLATEPATH.'/single-shop.php');
  } else {
	  include(TEMPLATEPATH.'/single-default.php');
  }
?>

<?php

$post = $wp_query->post;

if (is_singular('shop')) {

include(TEMPLATEPATH.'/single-shop.php');

} else {

include(TEMPLATEPATH.'/single-default.php');

}

ショップと通常の投稿の表示を条件分岐させるコードです。

single-shop.phpの作成

single-shop.phpを作成し、以下のコードを記入。

<?php get_header(); ?><!-- ヘッダーの読み込み -->
<div class="content">
	<div role="main">
		<article class="entry">
		<?php if (have_posts()) :
			while (have_posts()) : the_post(); ?>
			<h1 class="title"><?php the_title(); ?><!-- ページタイトル --></h1>
			<p><?php the_content(); ?><!-- 本文表示 --></p>
			<dl>
				<div>
					<dt>ショップ名</dt>
					<dd><?php the_title(); ?></dd>
				</div>
				<div>
					<dt>住所</dt>
					<dd>〒<?php the_field('郵便番号'); ?><br><?php echo nl2br(get_field('住所')); ?></dd>
				</div>
			</dl>
			<?php endwhile;
			else : ?>
			<p>お探しの記事は見つかりませんでした。</p>
		<?php endif; ?>
		</article>
	</div>
</div>
<?php get_footer(); ?><!-- フッターの読み込み -->

<?php get_header(); ?>

<?php if (have_posts()) :

while (have_posts()) : the_post(); ?>

<dl>

<div>

<dt>ショップ名</dt>

</div>

<div>

</div>

</dl>

<?php endwhile;

else : ?>

<p>お探しの記事は見つかりませんでした。</p>

<?php endif; ?>

</article>

</div>

<?php get_footer(); ?>

カスタムフィールドの値を出力するコードの、
the_field(‘フィールド名’);
echo nl2br(get_field(‘フィールド名’));
の2つの違いは、改行を出力するかどうかです。

「ショップ」の都道府県別一覧ページの作成

続いてショップの都道府県別の一覧ページを作成します。

archive-shop.phpの作成

archive-shop.phpを作成し、以下のコードを記入。

<?php get_header(); ?><!-- ヘッダーの読み込み -->
<div class="content">
	<div role="main">
		<section id="posts">
			<h1 class="title">ショップ一覧</h1>
			<div class="shop_wrap">
				<h2>北海道</h2>
				<?php $prefecture = '北海道';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>

				<h2>青森県</h2>
				<?php $prefecture = '青森県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>

				<h2>岩手県</h2>
				<?php $prefecture = '岩手県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>

				<h2>宮城県</h2>
				<?php $prefecture = '宮城県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>秋田県</h2>
				<?php $prefecture = '秋田県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>山形県</h2>
				<?php $prefecture = '山形県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>福島県</h2>
				<?php $prefecture = '福島県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>茨城県</h2>
				<?php $prefecture = '茨城県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>栃木県</h2>
				<?php $prefecture = '栃木県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>群馬県</h2>
				<?php $prefecture = '群馬県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>埼玉県</h2>
				<?php $prefecture = '埼玉県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>千葉県</h2>
				<?php $prefecture = '千葉県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>東京都</h2>
				<?php $prefecture = '東京都';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>神奈川県</h2>
				<?php $prefecture = '神奈川県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>新潟県</h2>
				<?php $prefecture = '新潟県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>富山県</h2>
				<?php $prefecture = '富山県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>石川県</h2>
				<?php $prefecture = '石川県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>福井県</h2>
				<?php $prefecture = '福井県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>山梨県</h2>
				<?php $prefecture = '山梨県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>長野県</h2>
				<?php $prefecture = '長野県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>岐阜県</h2>
				<?php $prefecture = '岐阜県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>静岡県</h2>
				<?php $prefecture = '静岡県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>愛知県</h2>
				<?php $prefecture = '愛知県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>三重県</h2>
				<?php $prefecture = '三重県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>滋賀県</h2>
				<?php $prefecture = '滋賀県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>京都府</h2>
				<?php $prefecture = '京都府';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>大阪府</h2>
				<?php $prefecture = '大阪府';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>兵庫県</h2>
				<?php $prefecture = '兵庫県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>奈良県</h2>
				<?php $prefecture = '奈良県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>和歌山県</h2>
				<?php $prefecture = '和歌山県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>鳥取県</h2>
				<?php $prefecture = '鳥取県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>島根県</h2>
				<?php $prefecture = '島根県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>岡山県</h2>
				<?php $prefecture = '岡山県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>広島県</h2>
				<?php $prefecture = '広島県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>山口県</h2>
				<?php $prefecture = '山口県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>徳島県</h2>
				<?php $prefecture = '徳島県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>香川県</h2>
				<?php $prefecture = '香川県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>愛媛県</h2>
				<?php $prefecture = '愛媛県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>高知県</h2>
				<?php $prefecture = '高知県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>福岡県</h2>
				<?php $prefecture = '福岡県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>佐賀県</h2>
				<?php $prefecture = '佐賀県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>長崎県</h2>
				<?php $prefecture = '長崎県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>熊本県</h2>
				<?php $prefecture = '熊本県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>大分県</h2>
				<?php $prefecture = '大分県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>宮崎県</h2>
				<?php $prefecture = '宮崎県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>鹿児島県</h2>
				<?php $prefecture = '鹿児島県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
					
				<h2>沖縄県</h2>
				<?php $prefecture = '沖縄県';
					include(TEMPLATEPATH.'/_inc_shoplist.php'); ?>
			</div>
		</section>
	</div>
</div>
<?php get_footer(); ?><!-- フッターの読み込み -->

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

<?php get_header(); ?>

<h1 class="title">ショップ一覧</h1>

<?php $prefecture = '北海道';