本文へ移動
Webstudio YAS
  • About
  • Price
  • Work
  • Blog
  • Contact
  • About
  • Price
  • Work
  • Blog
  • Contact
  1. ホーム
  2. Blog
  3. WordPress内で自作のプログラム(PHPやJavaScript)をincludeして動かす方法

公開日: 2019.05.08

WordPress内で自作のプログラム(PHPやJavaScript)をincludeして動かす方法

WordPress内で自作のプログラム(PHPやJavaScript)をincludeして動かす方法

目次

  • プログラムファイルのアップロード
  • プログラムファイルの読み込み
  • functions.phpへの記述
  • 小テーマを使用している場合の注意点

WordPressの記事内に直接プログラムを書き込んでも動いてくれません。プログラムファイルをある場所へアップロードして記事内から読み込む形で実現します。

プログラムファイルのアップロード

PHPやJavaScriptで書いた自作のプログラムファイルを下記のディレクトリにアップロードします。

ルートディレクトリ>wp-content>themes>利用中のテーマ>任意のディレクトリ>ここ!

利用中のテーマディレクトリの下に好きな名前のディレクトリを作成し、その中に自作プログラムファイルをアップロードします。

プログラムファイルの読み込み

記事内からショートコードを使ってアップロードしたファイルを読み込みます。
読み込みたい場所に下記のショートコードを書き込みます。

[[myInclude file='ディレクトリ名/ファイル名']]

ディレクトリ名には先程作成した任意のディレクトリ名を、
ファイル名には先程アップロードした自作プログラムのファイル名を入れます。

functions.phpへの記述

ファイルをアップロードして、それを読み込む。それだけで動くかと思いきや、もうひと手間必要です。
functions.phpファイルへ下記のコードを書き込まなければ動きません。
とは言っても、下記のコードを全てコピーしてfunctions.phpファイル内に貼り付けるだけ!

functions.php
function Include_php($params = array()) {
	extract(shortcode_atts(array(
		'file' => 'default'
	), $params));
	ob_start();
	include(get_theme_root() . '/' . get_template() . "/$file");
	return ob_get_clean();
}
add_shortcode('myInclude', 'Include_php');

functions.phpファイルの場所は?
ルートディレクトリ>wp-content>themes>利用中のテーマ>ここ!

以上で自作したプログラムが記事内で可動するはずです。
動かない場合は↓もご覧ください。

小テーマを使用している場合の注意点

小テーマを使用している場合は、親テーマではなく小テーマのfunctions.phpファイルへコードを書き込みます。
その場合は、上記のコードではなく下記のコードを書き込んでください。

get_template()の部分がget_stylesheet()に変わっただけなんですけどね。

functions.php
function Include_php($params = array()) {
	extract(shortcode_atts(array(
		'file' => 'default'
	), $params));
	ob_start();
	include(get_theme_root() . '/' . get_stylesheet() . "/$file");
	return ob_get_clean();
}
add_shortcode('myInclude', 'Include_php');

これで、小テーマを使用している場合でも、自作プログラムを記事内で動かすことができると思います。

タグ

  • include
  • WordPress
  • 自作

関連記事

2020.08.10

WordPressでページ毎に別のJavaScriptを読み込む方法

WordPressでページ毎に別のJavaScriptを読み込む方法

2019.08.29

【WordPress】LION BLOGのカラム幅の割合を変更する方法

【WordPress】LION BLOGのカラム幅の割合を変更する方法

2022.11.11

WPプラグインの日本語翻訳がおかしい時の修正方法(更新時上書き防止)

WPプラグインの日本語翻訳がおかしい時の修正方法(更新時上書き防止)
Webstudio YAS
  • About
  • Price
  • Work
  • Blog
  • Contact
YAS プロフィール画像

長野県長野市在住
WEBエンジニア YAS

LINKS

  • X
  • Instagram
  • GitHub
Design
  • スタンダード
  • 和モダン
  • エンジニア
  • 信州ナチュラル
プライバシーポリシー

@ Webstudio YAS