Webサイト制作者必見!WordPressでのショートコード活用 | 千葉で集客ホームページ制作はティーエスフォート
コラム

Webサイト制作者必見!WordPressでのショートコード活用

Webサイト制作者必見!WordPressでのショートコード活用

今回は、WordPressの便利な機能である、ショートコードについて、そしてその使用例をご紹介します。

ショートコードを使うと、一度使ったコードを、より短く簡潔なコードで置き換えることができ、便利です。

1.ショートコードとは何か

ショートコードとは、WordPress内で利用できる関数です。function.phpに書いた関数を、より短いコードで呼び出すことができます。

functions.phpは以下のディレクトリに保存されています。

・wp-content/themes/使用しているテーマ/functions.php

2.ショートコードの定義

ショートコードは関数ですので、使う前に定義する必要があります。

「add_shortcode(‘ショートコード名’, ‘使用する関数名’)」を使って、ショートコードを定義します。定義することで、WordPressのショートコードとして使えるようになります。

3.例① 投稿一覧を表示する方法

まずはショートコードタグ用のフックを追加します。最新の投稿を5件表示するショートコードは、次のコードを function.phpに追加します。

function shortcode_post_list() { 
global $post;
$args = array(
'posts_per_page' => 5, // 表示件数の指定
'post_type' => 'post',
'post_status' => 'publish'
);
$posts_array = get_posts($args);
$html = '<ul>';
foreach($posts_array as $post):
setup_postdata($post);
$html .= '<li>';
$html .= '<a href="'.get_permalink().'">'.get_the_title().'</a>';
$html .= '</li>';
endforeach;
$html.='</ul>';
wp_reset_postdata();
return $html;
}

//ショートコードの定義
add_shortcode('post_list', 'shortcode_post_list');

4.例② 会員限定コンテンツの提供方法

非会員には提供せず、会員登録した人にだけ限定でコンテンツを提供したいときも、簡単なショートコードで可能です。

functions.phpに下記コードを追加します。

<?php
add_shortcode("memberonly","limited_memberonly");
function limited_memberonly($x,$text=null){
if(!is_user_logged_in()){
return "非ログインユーザーに見せるテキスト";
}else{
return do_shortcode($text);
}
?>



以下のようにショートコードで挟み込む形をとることで会員限定コンテンツを作ることができます。

[memberonly]会員限定コンテンツをここに記述[/memberonly]

5.例③ テーマの画像フォルダまでのパスを得る

テーマのimagesフォルダまでのパスをショートコードで呼び出すことができます。

以下のコードをfunctions.phpに追加します。

//imageDirectoryPass
function shortcode_imgDir(){
return get_template_directory_uri(). '/images/';
}
add_shortcode('sc_imgDir','shortcode_imgDir');

6.例④ 記事のスラッグを取得

テーマの画像フォルダの中にすべての画像を入れていると、画像の数が増えれば増えるほど管理が大変になってしまいます。

記事別にフォルダ分けをする際に、フォルダ名を「記事のスラッグ」にすることで、記事と画像の対応関係がわかりやすく、簡単に目的の画像を探す事ができます。

こんな時も、記事のスラッグ名を自動で取得してショートコードで呼び出すと便利です。

以下のコードをfunctions.phpに追加します。

function shortcode_slug(){
return get_page_uri(get_the_ID());
}
add_shortcode('sc_slug','shortcode_slug');


これで[sc_slug]と記述すれば使えます。

まとめ

今回のコラムでは、WordPressショートコードとは何か、ショートコードの定義方法について説明した後、具体的なショートコードの例として、以下の4つをご紹介しました。

①投稿一覧を表示する方法
②会員限定コンテンツの提供方法
③テーマの画像フォルダまでのパスを得る
④記事のスラッグを取得

よく使うコードをショートコードとして関数化することによって、繰り返し使いまわすことができるのが便利ですね。
ページ先頭へ