WordPressカスタム投稿の具体的な使い方【Web初学者必見】

add_action(‘init’, ‘create_post_type’);
function create_post_type()
{
register_post_type(‘work’, [ // 投稿タイプ名の定義
‘labels’ => [
‘name’ => ‘業務内容’, // 管理画面上で表示する投稿タイプ名
‘singular_name’ => ‘work’, // カスタム投稿の識別名
],
‘public’ => true, // 投稿タイプをpublicにするか
‘has_archive’ => true, // アーカイブ機能ON/OFF
‘menu_position’ => 5, // 管理画面上での配置場所(投稿の下に配置)
‘show_in_rest’ => true, // wordpress5.x系から出てきた新エディタ「Gutenberg」を有効にする
‘supports’ => array(‘title’, ‘editor’, ‘thumbnail’), // カスタム投稿で使用する項目を設定（タイトル、エディター、アイキャッチ）
]);
}

add_action(‘init’, ‘create_post_type’);
function create_post_type()
{
register_post_type(‘work’, [ // 投稿タイプ名の定義
‘labels’ => [
‘name’ => ‘業務内容’, // 管理画面上で表示する投稿タイプ名
‘singular_name’ => ‘work’, // カスタム投稿の識別名
],
‘public’ => true, // 投稿タイプをpublicにするか
‘has_archive’ => true, // アーカイブ機能ON/OFF
‘menu_position’ => 5, // 管理画面上での配置場所(投稿の下に配置)
‘show_in_rest’ => true, // wordpress5.x系から出てきた新エディタ「Gutenberg」を有効にする
‘supports’ => array(‘title’, ‘editor’, ‘thumbnail’), // カスタム投稿で使用する項目を設定（タイトル、エディター、アイキャッチ）
]);
/* タクソノミー(カテゴリー分け)の定義 */
register_taxonomy(
‘work-category’, /* タクソノミーの名前 */
‘work’, /* 使用するカスタム投稿タイプ名 */
array(
‘hierarchical’ => true, /* trueだと親子関係が使用可能。falseで使用不可 */
‘update_count_callback’ => ‘_update_post_term_count’,
‘label’ => ‘業務内容カテゴリー’,
‘singular_label’ => ‘業務内容カテゴリー’,
‘public’ => true,
‘show_ui’ => true,// 管理画面表示ON/OFF
)
);
}

<?php
$args = array(
‘post_type’ => ‘work’,//設定したカスタム投稿名※ここではwork
‘posts_per_page’ => ‘3’//表示させたい件数を指定
);
?>
<?php $my_query = new WP_Query($args); ?>
//ループ処理開始
<?php while ($my_query->have_posts()) : $my_query->the_post(); ?>
//表示する中身（ここから）
　<div class="work-box">
<?php echo get_the_date("Y.m.d"); ?>//公開日を出力
<?php the_title(); ?>//記事タイトルを出力
</div>
//表示する中身（ここまで）
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
//ループ処理終了

<?php
$args = array(
‘post_type’ => ‘work’,//設定したカスタム投稿名※ここではwork
‘posts_per_page’ => ‘3’//表示させたい件数を指定
‘tax_query’ => array(
‘relation’ => ‘OR’,
array(
‘taxonomy’ => ‘work-category’,// タクソノミー名の指定
‘field’ => ‘slug’,// タームの指定方法を設定（ここではスラッグ）
‘terms’ => ‘work-term01’,// タームのスラッグを指定
),
),
);
?>
<?php $my_query = new WP_Query($args); ?>
//ループ処理開始
<?php while ($my_query->have_posts()) : $my_query->the_post(); ?>
//表示する中身（ここから）
<div class=”work-box”>
<?php echo get_the_date(“Y.m.d”); ?>//公開日を出力
<?php the_title(); ?>//記事タイトルを出力
</div>
//表示する中身（ここまで）
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
//ループ処理終了

//投稿のページネーション設定
function custom_pre_get_posts($query)
{
if (is_admin())
return;
// 1ページの表示件数を設定（デフォルトの投稿）
if ($query->is_post_type_archive(‘post’) && $query->is_main_query()) {
$query->set(‘posts_per_page’, 5);
$query->set('post_status', 'publish');
return;
}
// 1ページの表示件数を設定（カスタム投稿[work]）
if ($query->is_post_type_archive(‘work’) && $query->is_main_query()) {
$query->set(‘posts_per_page’, 3);
$query->set('post_status', 'publish');
return;
}
}
add_action(‘pre_get_posts’, ‘custom_pre_get_posts’);

//アップロードした際にサムネイル画像のサイズを指定
//add_image_size(任意のサイズ名,横サイズ,縦サイズ,画像を切り抜くかどうか)
add_image_size('work-img', 200, 200, true);

//画像出力関数
function get_thumb_img($size = 'work-img')//上記のサイズ名を指定
{
$thumb_id = get_post_thumbnail_id(); // アイキャッチ画像のIDを取得
$thumb_img = wp_get_attachment_image_src($thumb_id, $size); // $sizeサイズの画像内容を取得
$thumb_src = $thumb_img[0]; // 画像のurlだけ取得
$thumb_alt = get_the_title(); //alt属性に入れるもの（記事のタイトルにしています）
return '<img src="' . $thumb_src . '" alt="' . $thumb_alt . '">';
}

<?php if (has_post_thumbnail()) {
/* サムネイル（アイキャッチ画像）がある時 */
echo get_thumb_img(‘work-img’);//サイズ指定したwork-imgを出力
} else {
/* 設定されていない時に出力する画像を記載 */
echo “<img src=\”/image/sample.png\” alt=\”No Image\” />”;
} ?>