ショートコード – ホームページ制作・ワードプレス・業務効率化ツール開発

基本のショートコード

function hoge_func() { return '
<div class="box">
    <p>hoge</p>
    <p>hoge</p>
    <p>hoge</p>
</div>
';} add_shortcode('hoge', 'hoge_func');

ショートコード呼び出し

// 本文中で呼び出し
[hoge]

// テンプレートファイルで呼び出し
<?php echo do_shortcode('[hoge]'); ?>

ショートコードの定義にテンプレートタグを使用する

function hoge_func() {
$html = '
<ul>
  <li><a href="' . home_url() . '/hoge/">hoge</a></li>
  <li><a href="' . home_url() . '/hoge/">hoge</a></li>
  <li><a href="' . home_url() . '/hoge/">hoge</a></li>
</ul>
';
return $html;
}
add_shortcode('hoge', 'hoge_func');

属性ありのショートコード（任意の値を渡すショートコード）

function my_tagfunc( $atts ){
  return '<p>' . $atts['name'] . 'は、' . $atts['price'] . '円です。</p>';
}
add_shortcode( 'my_tag', 'my_tagfunc' );

[my_tag name="食パン" price="100"]

カスタム投稿の内容をショートコードで呼び出し

function get_customPost_info($attr)
{
  $customPost = isset($attr['customPost_id']) ? get_post($attr['customPost_id']) : null;
  if($customPost && $customPost->post_type === 'customPost') {
    $thumbnail_id = get_post_thumbnail_id($customPost->ID);
    $thumbnail_src = wp_get_attachment_image_src($thumbnail_id, 'thumbnail');
    $html = '<div class="customPost-box"><h3>店舗情報</h3>';
    $html .= '<div class="customPost-wrap">';
    $html .= '<a href="' . get_permalink($customPost->ID) . '"><img src="' . $thumbnail_src[0] . '" alt=" ' . $customPost->post_title . ' ">';
    $html .= '<div class="customPost-right">';
    $html .= '<p class="customPost-name"><a href="' . get_permalink($customPost->ID) . '">' . $customPost->post_title . '</a></p>';
    $html .= '<table>';
    $html .= '<tr><th>電話</th><td>' . get_field('tel', $customPost->ID) . '</td></tr>';
    $html .= '<tr><th>住所</th><td>' . get_field('address', $customPost->ID) . '</td></tr>';
    $html .= '<tr><th>アクセス</th><td>' . get_field('access', $customPost->ID) . '</td></tr>';
    $html .= '</table>';
    $html .= '</div>';
    $html .= '</div>';
    $html .= '</div>';
    return $html;
  }
}
add_shortcode('customPost_info', 'get_customPost_info');

WordPressで投稿の本文中に別投稿タイプの記事の情報をショートコードで埋め込む | バシャログ。

ショートコード呼び出し

// customPost_id に投稿ID を指定
[customPost_info customPost_id="10"]

php テンプレートファイルをショートコードで呼び出し

// tmp/sample.php を読みこみ
function sample_php( $atts ){
  ob_start();
  get_template_part('tmp/sample');
  return ob_get_clean();
}
add_shortcode( 'sample', 'sample_php' );

ショートコード呼び出し

[sample]