HOME → 3 WordPress → 03 カスタマイズ → 

投稿日順 記事一覧表示用 2種類の ショートコード

WordPress Twenty Seventeen
固定ページでの 記事一覧の作成
2種類の ショートコード
 
投稿記事が多くなってくると、記事の見直しやサイトの移行等に当たって、『いろんな角度』からの「記事一覧」が欲しくなってくる。
 
投稿日順 記事一覧サンプル
 
今回、投稿日順の記事一覧を作成したので、その記録とショートコードに関するおさらい。
 

 

スポンサー リンク

 

 
 
 
 
 
1. 2種類のショートコード
 

 ショートコードとは

functions.phpと呼ばれる場所の中に、プログラムコードを記述しておき、記事や固定ページに短いコードを記述することで、その動作を呼び出すしくみで、短いコード[xxxxxx]をショートコードという。

 
WordPressでショートコードを使う方法には、次の2種類がある。
それぞれ「子テーマ」で実装するのが良い。
 
方法1:functions.phpにコードを追記する。
functions.phpにコードを追記する方法
 
方法2:phpの外部ファイルを呼び出す。
phpの外部ファイルを呼び出す方法
 

この、【 phpの外部ファイルを呼び出す方法 】を使う場合には、functions.phpに次のコードを追記する必要がある。

/*-----------------------------------------------------------*/
/* 【子テーマ用】ショートコードを使ってphpファイルを呼び出す */
/*-----------------------------------------------------------*/
function my_php_Include($params = array()) {
	extract(shortcode_atts(array('file' => 'default'), $params));
	ob_start();
	include(STYLESHEETPATH . "/shortcode/$file.php");
	return ob_get_clean();
}
add_shortcode('shortcode', 'my_php_Include');
/*-----------------------------------------------------------*/
 
 
 
2. ショートコードのための関数について
 
functions.php への「ショートコード」追記要領。
functions.php への「ショートコード」追記要領
 
ショートコードタグを追加する関数
ショートコードタグを追加する関数
 
グローバル変数と、投稿記事の取得関数
グローバル変数と、投稿記事の取得関数
 
検索条件を指定する連想配列。
 
$args = array(
 'numberposts' => 5,        取得件数(posts_per_page)
 'offset' => 0,                     取得開始位置
 'category' => '',
 'category_name' => '',
 'orderby' => 'date',          ソート対象
 'order' => 'DESC',            ソート順 ASCかDESC
 'include' => '',
 'exclude' => '',
 'meta_key' => '',
 'meta_value' => '',
 'post_type' => 'post',
 'post_mime_type' => '',
 'post_parent' => '',
 'author' => '',
 'post_status' => 'publish',
 'suppress_filters' => true
);
$posts_array = get_posts( $args );
 
 
記事情報を取得する関数。
記事情報を取得する関数
記事情報を取得する関数
 
ショードコードで、【属性名を指定】して引数(パラメーター)を渡す関数。
「引数 = パラメーター = 属性 = Attribute:とも言う」。
ショードコードで、【属性名を指定】して引数(パラメーター)を渡す関数
 
【shortcode_atts】と【extract】のまとめ。
【shortcode_atts】と【extract】のまとめ
 
 
 
3. functions.phpにコードを追記する方法でのサンプル
 
ショートコード。
[[list num="50" odr="asc"]]
 
phpプログラムコード(functions.phpの中に追記)。
/*------------------------------------------------------------------*/
/*--- 投稿日、記事タイトル、パーマリンクを表示するショートコード ---*/
/*------------------------------------------------------------------*/
function print_post($atts){
	$retHTML='';
	
	// デフォルトの値を設定
	extract(shortcode_atts(array(
		"num" => '20',
		"odr" => 'ASC'
	), $atts));

	global $post;
	
	$myposts = get_posts('numberposts='.$num.'&order='.$odr);
	
	foreach($myposts as $post):
        setup_postdata($post);
	$retHTML.=get_the_date('Y年n月j日')." : ";
	$retHTML.="<a>".'
	';
	$retHTML.=''.the_title("","",false).'
	';
	$retHTML.="</a>";
	endforeach;
	wp_reset_postdata();
	return $retHTML;
}

add_shortcode('list','print_post');
/*------------------------------------------------------------------*/
 
投稿日順 記事一覧サンプル。
投稿日順 記事一覧サンプル
 
 
 
4. phpの外部ファイルを呼び出す方法でのサンプル
 
ショートコード。
[shortcode file='kijiitiran']
 
phpプログラムコード(kijiitiran.php)。
<?php
/* (ステップ1)データの取得 */
$query = new WP_Query(
    array(
        'posts_per_page' => 250,
        'post_type' => 'post',
    )
);
?>
<?php
/* (ステップ2)データの表示 */
if ( $query->have_posts() ) : ?>
    <ul>
        <?php while ( $query->have_posts() ) : $query->the_post();?>
        <li>-----------------------------------</li>
	<li><a href="<?php the_permalink(); ?>">
	<?php the_title(); ?></a></li>
	<li><?php the_permalink(); ?></li>
        <?php endwhile; ?>
    </ul>
<?php endif; wp_reset_postdata(); ?>
 
記事一覧サンプル。
記事一覧サンプル
 
 
以上。
(2020.07.25)
 

 

スポンサー リンク

 

             

 

 

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください