WordPress
カスタマイズ事例

WORDPRESS CUSTOMIZATION

共通部分のコードをテンプレートとしていろんなページのいろんな場所で呼び出して使う

たとえば、サイトの全ページの任意の場所に問い合わせエリアを設けたいという場合、問い合わせエリアを共通部分としてテンプレート化して、いろんなページやいろんな場所で呼び出して使うのが普通ですよね。
今回はその方法を2つご紹介したいと思います。

共通部分のコードを

<div><a href="/contact/">お問い合わせはこちら</a></div>

だとします。

  1. ショートコードに共通部分をそのまま記述する方法
    これが、もっともオーソドックスなやり方です。

    テーマの functions.php に次の記述を追加

    if (!function_exists('display_otoiawase_area')) {
      function display_otoiawase_area()
      {
        $html = '<div><a href="/contact/">お問い合わせはこちら</a></div>';
        return $html;
      }
      add_shortcode('display_otoiawase_area', 'display_otoiawase_area');
    }
    

    WordPress管理画面のエディターでは、出力したい場所にこのショートコードを貼り付けるだけ

    [display_otoiawase_area]
    

    呼び出し側のPHPファイルでの記述

    <?php echo do_shortcode('[display_contact_area]'); ?>
    

     

  2. 共通部分は別のファイルに記述しておいて、そのファイルをショートコードで呼び出して出力する方法
    共通部分がやたら長いコードになる場合なんかは、functions.php が長くなりすぎて可読性が落ちるのを避けるために、そこだけ別ファイルに切り出して持っておくなんてことはあり得ると思います。

    テーマのディレクトリに次のように記述した contact_area.php を新規で用意

    <div><a href="/contact/">お問い合わせはこちら</a></div>
    

    テーマの functions.php に次の記述を追加

    if (!function_exists('display_otoiawase_area')) {
      function display_otoiawase_area()
      {
        $filename = locate_template('contact_area.php');
        if (is_file($filename)) {
          ob_start();
          include $filename;
          return ob_get_clean();
        }
        return false;
      }
      add_shortcode('display_otoiawase_area', 'display_otoiawase_area');
    }
    

    WordPress管理画面のエディターでは、出力したい場所にこのショートコードを貼り付けるだけ(これは1項と同じ)

    [display_otoiawase_area]
    

    呼び出し側のPHPファイルでの記述

    <?php get_template_part('contact_area'); ?>
    

    共通部の実装は開発速度に影響するので、極力効率的におこないましょう。

【100ウェブ新着情報メルマガ】

WordPressカスタマイズ事例やウェブ制作ノウハウの新着情報、お役立ち情報を
リアルタイムにメルマガ配信!