子テーマを作成する
事前準備として、子テーマを作成します。
以下の記事を参考に作成してください。
ショートコードを追加する
指定したカテゴリーに属する記事一覧を表示するショートコードを追加していきます。
手順
- 作成した子テーマの
functions.php
をエディタで開 - 一番下に以下のコードを記述する
/*
* 指定カテゴリーの投稿一覧を取得
*/
function getWorkList($atts) {
extract(shortcode_atts([
'orderby' => "date", // 並び順の基準
'order' => "ASC", // 並び順 ASC(昇順) or DESC(降順)
'category_slug' => "", // カテゴリーのslug
'count' => -1, // 表示する投稿数 -1 ならすべて表示
'list_type' => "ul", // ul(リスト) or ol(番号リスト)
'class' => "", // リストに設定したいクラス
'view_title' => 1, // タイトルを表示するか 1(表示する) or 0(表示しない)
'title' => "", // タイトル(なければカテゴリー名から取得)
'title_obj' => "h2" // タイトルのHTML要素
], $atts));
$args = [
'numberposts' => $count,
'orderby' => $orderby,
'order' => $order,
'post_type' => "post",
'post_status' => 'publish',
'suppress_filters' => true
];
if (!empty($category_slug)) $args['category_name'] = $category_slug;
$posts = get_posts($args);
$html = "";
// タイトルを表示するか
if ($view_title) {
if (empty($title)) $title = get_category_by_slug($category_slug)->cat_name;
$html .= '<'. $title_obj. '>'. $title. '</'. $title_obj. '>';
}
// リストの用意
if (empty($class)) {
$html .= '<'. $list_type. '>';
} else {
$html .= '<'. $list_type. ' class="'. $class. '">';
}
// 記事一覧出力
foreach($posts as $post) {
// パスワードがあるか
if (post_password_required( $post->ID )) {
$html .= '<li class="on-password">';
} else {
$html .= '<li>';
}
$html .= '<a href="'. get_permalink($post->ID).'">'. $post->post_title. '</a></li>';
}
$html .= '</ul>';
return $html;
}
add_shortcode('work_list', 'getWorkList');
- 作成した子テーマのstyle.cssをエディタで開く
- 一番下に以下のコードを記述する
.on-password::after {
content: "(pass)";
margin-left: 5px;
font-size: small;
}
ショートコードを使用する
固定ページを作成し、ページの中にショートコードを記述すると使用できます。
基本のショートコード
[work_list category_slug="カテゴリーのスラッグ"]
以下のパラメーターを半角スペース区切りで設定していくと、その他の設定が可能です。
パラメーター一覧
*は必須
category_slug * | 表示したいカテゴリーのスラッグを指定 |
---|---|
orderby | 並び順の基準
|
order | 並び順
|
count | 記事の表示数-1 を設定するとすべて表示する(初期値 -1) |
list_type | リストの種類
|
class | リストに設定するclass |
view_title | リストの前にタイトルを表示するか
|
title | リストの前に表示するタイトル なければカテゴリー名を取得する |
title_obj | タイトルを囲むhtmlの設定(初期値 h2 ) |
カテゴリースラッグの確認方法
使用例
ショートコードを使用して、短編集と長編の目次を出力してみます。
今回は、以下の内容で表示しました。
- 固定ページ…novels
- 表示するカテゴリー
- 短編… スラッグ→novel_short
- 吾輩は猫である…スラッグ→novel_long
[work_list category_slug="novel_short" title="短編集"]
[work_list category_slug="novel_long"]
設定したショートコードを使用して、短編集と長編の目次を出力してみます。

パスワード付の作品にはマークがつきます。
マークはCSSで設定していますので、アイコンなどに変更してご使用ください。