WordPressではショートコードを活用することで、投稿や固定ページ内で簡単にPHPファイルを読み込むことができます。
本記事では、ショートコードの基本から実装方法、エラー対策、SEO対策まで詳しく解説します。
WordPressでショートコードを使うメリットとは?
WordPressでは、PHPコードを直接記事に書くことはできません。
しかし、ショートコードを利用すれば、PHPファイルの内容を簡単に読み込むことができます。
- 投稿や固定ページ内でPHPファイルを実行できる
- テンプレートを編集せずに機能を追加できる
- 再利用が簡単で、メンテナンスがしやすい
- カスタムコンテンツを動的に表示できる
- 最新の投稿やカスタム投稿タイプの記事の読込
- 特定の権限を持つユーザーのみアクセスできるコンテンツを制御
- サイトで繰り返し挿入するコンテンツの読込
- 外部APIのデータを取得して表示
これらのメリットを活かしながら、PHPファイルをショートコードで読み込む方法を詳しく解説していきます。
WordPressのショートコードとは?基本の仕組みを解説
ショートコードとは?
ショートコードとは、[ショートコード名]
という短いコードを記述するだけで、特定の機能を呼び出せるWordPressの便利な仕組みです。
例えば、以下のようなショートコードを作成すると、記事の中に動的なコンテンツを埋め込むことができます。
function my_custom_shortcode() {
return "さて、皆さん!";
}
add_shortcode('greeting', 'my_custom_shortcode');
固定ページや投稿の本文に [greeting]
を記述すると、「さて、皆さん!」と表示されます。
ショートコードを使ってPHPファイルを読み込む方法
functions.phpにショートコードを追加する
まずは functions.php
にショートコードを登録し、phpファイルを読み込む仕組みを作ります。
以下のコードを functions.php
に追加してください。
function short_php($params = array()) {
extract(shortcode_atts(array(
'file' => 'default',
), $params));
ob_start();
include(get_theme_root() . '/' . get_template() . "/$file.php");
return ob_get_clean();
}
add_shortcode('load_sc', 'short_php');
ショートコードの使い方
記事や固定ページに以下のように記述すると、テーマディレクトリ内のcustom.php
というファイルの内容が表示されます。
[load_sc file='custom']
この方法を使えば、特定のページ内にカスタムのPHPコードを埋め込むことが可能になります。
ショートコードを活用して複数のPHPファイルを切り替える
上記のコードにより、[load_sc file="ファイル名"]
のように記述することで、異なるPHPファイルを読み込むことができます。
例えば、
[load_sc file="blog-list"]
とすれば、ブログの記事一覧を特定のページに表示することが可能です。
blog-list.phpの例
<ul class="blogList">
<?php $args = Array(
'post_type' => 'post',
'posts_per_page' => 5,
);
$wp_query = new WP_Query( $args );?>
<?php if ( $wp_query->have_posts() ) { ?>
<?php while ( $wp_query->have_posts() ) { $wp_query->the_post(); ?>
<li><a href="<?php the_permalink(); ?>"><span class="date"><?php the_time('Y.m.d'); ?></span><span class="txt"><?php the_title(); ?></span></a></li>
<?php } } wp_reset_postdata();?>
</ul>
投稿記事を5件リスト形式で表示します。
ショートコードに指定した引数をphpファイルで使用する
サービスページではブログの「サービス」カテゴリーの最新記事一覧。
事例ページではブログの「事例」カテゴリーの最新記事一覧など表示内容を出し分けたい時など引数を利用すれば、phpファイルを複数作成することなく実装出来ます。
まずは、先ほどのfunction.phpのコードに1行追加します。
function short_php($params = array()) {
extract(shortcode_atts(array(
'file' => 'default',
'cat' => '-1', //この行を追加
), $params));
ob_start();
include(get_theme_root() . '/' . get_template() . "/$file.php");
return ob_get_clean();
}
add_shortcode('myphp', 'short_php');
ショートコードの呼び出し箇所には以下のように記述して、スラッグやカテゴリーIDを渡します。
[load_sc file="blog-list" cat="service"]
blog-list.phpの例
<ul class="blogList">
<?php $args = Array(
'post_type' => 'post',
'posts_per_page' => 5,
'category_name' => $cat //渡した引数をセット
);
$wp_query = new WP_Query( $args );?>
<?php if ( $wp_query->have_posts() ) { ?>
<?php while ( $wp_query->have_posts() ) { $wp_query->the_post(); ?>
<li><a href="<?php the_permalink(); ?>"><span class="date"><?php the_time('Y.m.d'); ?></span><span class="txt"><?php the_title(); ?></span></a></li>
<?php } } wp_reset_postdata();?>
</ul>
これでブログの「サービス」カテゴリーの最新記事が5件表示されます。
ショートコードがそのまま表示される問題の対処方法
ショートコードが機能せず、そのまま表示される場合、以下の原因が考えられます。
ショートコードが正しく登録されていない
functions.php
ファイルにショートコードの登録がない場合、ショートコードは機能しません。
まずは、functions.php
ファイルにショートコードの登録が正しく行われているか確認しましょう。
ショートコードの名称が重複している
既存のショートコードと名称が重複していると、意図した動作をしない可能性があります。
ショートコードの名称が他と重複していないか確認し、必要に応じて名称を変更しましょう。
テーマやプラグインが影響している
テーマ変更やプラグインの競合により、ショートコードが機能しなくなることがあります。
テーマを一時的にデフォルトのテーマにしたり、プラグインを一時的に無効化し、ショートコードが機能するか確認しましょう。
キャッシュによる影響を考慮する
キャッシュが原因で、最新のPHPコードが反映されない場合があります。
特に、サーバー側のキャッシュやブラウザのキャッシュが影響することがあります。
キャッシュプラグインを使用している場合は、一時的に無効化するか、キャッシュをクリアする。
ブラウザのキャッシュをクリアし、最新の状態を確認する。
ショートコードを使ったPHPファイル読み込みのSEO対策
ショートコードを利用してPHPファイルを読み込む際のSEO対策は、検索エンジン最適化とユーザーエクスペリエンスの向上に直結します。
以下に、具体的な対策を詳しく解説します。
動的コンテンツとSEOの関係
ショートコードを用いてPHPファイルを読み込むと、動的にコンテンツを生成できます。
しかし、検索エンジンがこれらのコンテンツを適切にクロールし、インデックスするためには、以下の点に注意が必要です。
クロールの可視性
検索エンジンのクローラーが動的コンテンツを認識できるよう、サーバーサイドでレンダリングされたHTMLとして出力することが重要です。
URLの一意性
同じコンテンツが複数のURLで表示されると、重複コンテンツとして評価される可能性があります。
適切なURL設計を行い、重複を避けましょう。
適切なHTML構造を維持する
SEOにおいて、HTMLの構造は検索エンジンがコンテンツを理解する上で重要な役割を果たします。
ショートコード内でPHPファイルを読み込む際も、以下の点に留意してHTML構造を整えることが必要です。
見出しタグの適切な使用
<h1>
から<h6>
までの見出しタグを適切に使用し、コンテンツの階層構造を明確に示すことで、検索エンジンがページ内容を理解しやすくなります。
セマンティックなマークアップ
<article>
や<section>
などのセマンティック要素を使用し、コンテンツの意味や役割を明確に伝えることで、SEO効果を高めます。
メタデータの設定
<title>
タグや<meta description>
タグを適切に設定し、ページの内容を簡潔に伝えることで、検索結果でのクリック率向上が期待できます。
ページ表示速度の最適化
ページの読み込み速度は、ユーザーエクスペリエンスとSEOの双方に影響を与えます。
ショートコードを使用してPHPファイルを読み込む際には、以下の点に注意してパフォーマンスを最適化しましょう。
キャッシュの活用
動的に生成されるコンテンツでも、キャッシュ機能を利用してサーバー負荷を軽減し、表示速度を向上させることが可能です。
コードの最適化
不要なコードや冗長な処理を排除し、スクリプトの実行効率を高めることで、ページ全体のパフォーマンスを向上させます。
外部リソースの最適化
画像やスクリプト、スタイルシートなどの外部リソースを最適化し、読み込み時間を短縮することで、ユーザーエクスペリエンスとSEOの向上に寄与します。
これらの対策で、ショートコードを活用したPHPファイルの読み込みによる動的コンテンツでも、SEO効果を最大限に引き出すことが可能となります。
まとめ:ショートコードを活用して柔軟なページ作成をしましょう!
WordPressのショートコードを使うことで、簡単にPHPファイルを呼び出すことができます。
add_shortcode()
を使えば、投稿や固定ページにPHPファイルを組み込める- 引数を活用することで、柔軟なファイル管理が可能
- SEOやセキュリティを考慮しつつ、安全に実装することが重要
この記事を参考に、あなたのWordPressサイトでショートコードが活用できればうれしいです!
コメント