freks blog

about

WordPressでshort codeを自作する

created: 2025-01-11
おすすめ記事: 出会ってよかったプログラマー本

WordPress でショートコードを自作してみました
ドキュメントは Shortcode API « WordPress Codex にあります

今回はWordPressのカスタムフィールドの値があればリンクを表示するものを作ってみました

theme Twenty Twenty-Three の個テーマを用意してやりました

theme
└── twentytwentythree-child
    ├── functions.php
    └── templates
        └── single.html

single.htmlが1つの記事が表示されるテンプレートです

functions.php にショートコードを追加します

function get_custom_field($field_name) {
  return get_post_meta(get_the_ID(), $field_name, true);
}

function map_link_shortcode() {
  $map_link = get_custom_field('map');
  if ($map_link) {
    return '<a href="' . esc_url($map_link) . '" target="_blank">map</a>';
  }
  return '';
}
add_shortcode('map_link', 'map_link_shortcode');

map というカスタムフィールドに入力されていれば、リンクを表示します
ショートコードは map_link で用意しました

これを表示するのに single.html にショートコードを埋め込みます

/* 前後は省略 */
<div>
  [map_link]
</div>
/* 前後は省略 */

これで記事に map というカスタムフィールドが入力されていればリンクが表示されるようになりました

PR

1冊ですべて身につくWordPress入門講座

1冊ですべて身につくWordPress入門講座

このリンクは、アフィリエイトリンクです


Amazonのアソシエイトとして、blog.freks.jp は適格販売により収入を得ています。
This site is managed by freks