科学/IT

WordPressにBootstrapを導入方法の手順4〜functions.php編

投稿日:2017年7月8日 更新日:

この記事は、「WordPressにBootstrapを導入方法の手順について書いてみました3」の続きです。

 

みなさんこんにちは。今日は、WordPressの初期処理で使用するfunctions.phpファイルの説明を書いていきたいと思います。このファイルではPHP言語を使用します。なかなか難しいかと思いますが、最初は要所要所を抑えつつ、理解していくといいと思います。

頑張りましょうね。

 

Advertisements

スポンサードリンク.(Sponsored Link)

1. function.phpの説明

  • このファイルは、WordPressの初期化処理で、スタイルシートやjsファイルをプログラムで読み込むのに使用します。htmlファイルの中に<link>タグを使用してスタイルシートやjsファイルを読み込む処理を記述することも出来ますが、外部ファイルfunctions.phpでその処理をしたほうがメンテナンス性が良くなります。読み込むファイルが変更になったり、バージョンが変わったりした場合には、functions.phpの中の記述だけを修正すれば良く、html自体はそのままですみます。
  • 保存する場所は、〈wp-content/themes〉の下に作成したテーマ用サブフォルダです。
  • 〈wp-content/themes〉配下に作成したオリジナルテーマのフォルダの中にstyle.cssとindex.phpファイルを保存すると、WordPressが自動的にこのテーマをオリジナルテーマとして有効化にし、認識します。
  • function.phpは、保存されているフォルダのテーマにのみ機能し、他のテーマには影響を与えません。
  • functions.phpは、多くの違った処理を記載することが出来ます。

2. functions.phpを編集する

まずは、function.phpを作成して、
〈/(ブログのドメイン)/public_html/wp-content/themes/mynewtheme〉フォルダにアップします。

function.phpの中身は以下のような内容になります。

(1) mybootstrap_enqueue_styles関数の説明

 wp_register_style関数の使い方

WordPressのテーマにCSSスタイルファイルを読み込みます。

構文

wp_register_style( $handle, $src, $deps, $ver, $media );

 引数の説明

引数名 データタイプ 必須項目 説明 初期値値
$handle string  スタイルシートのハンドルネーム
$src string スタイルシートのURL  ”
$deps array  このスタイルシートが依存するスタイルシートのハンドルネーム配列  array()
$ver string|bool|null 記載すると、cssのURLの最後にバージョン番号が付きます。無しの場合、WordPressのバージョン番号が付きます。バージョン番号を付与しない場合は、NULLを書きます。  false
$media string  スタイルシートに適用するメディアを指定する  all
 handle  名前、あだ名、ニックネームなどの意味があります。
 $src  スタイルシートの完全なURL、または、WordPressのルートディレクトリーからのスタイルシートの相対パス。
 $deps  登録するスタイルシートの前にlinkタグで読み込まれなくてはいけないベースになるスタイルシートのニックネーム配列になります。依存先のスタイルシートが無い場合、値はfalseにします。
 $ver
 $meida  適用するメディアを指定します。
media属性は、リンク先の文書または読み込むリソースを、どのメディアに適用するのかを指定します。media属性の値は適切なメディアクエリでないといけません。省略時は、allが自動的にセットされます。特に指定する必要がない場合は、指定する必要はありません。

 

Sponsored Link

 

 get_template_directory_uri()

テンプレートのあるディレクトリ URIを取得します。

 wp_enqueue_style関数の使い方

WordPressに対してCSSを wp_register_style() で登録したあとに、CSSスタイルファイルをキューに追加するのに使用します。

 構 文

wp_enqueue_style( $handle, $src, $deps, $ver, $in_footer );

 引数の説明

引数名 データタイプ 必須項目 説明 初期値
$handle string  スタイルシートのハンドル
$src string スタイルシートのURL  ”
$deps array  このスタイルシートが依存するスタイルシートのハンドルの配列  array()
$ver string|bool|null 記載すると、cssのURLの最後にバージョン番号が付きます。無しの場合、WordPressのバージョン番号が付きます。バージョン番号を付与しない場合は、NULLを書きます。  false
$in_footer bool  true: スタイルが</body>の直前で読み込まれる。false: スタイルが</head>の直前で読み込まれる。  false

(2) mybootstrap_enqueue_scripts関数の説明

mybootstrap_enqueue_scriptsの処理は、mybootstrap_enqueue_stylesよりも簡単です。

なぜなら、scriptsの方では、jQueryはWordPressでデフォルトでインストールされているので、ここでは、jQueryをregister(登録)する必要はありません。

そこで、直ぐに、ハンドル配列 $dependencies に array(‘jquery’) を配列の形でセットして、wp_enqueue_scriptでWordPressに対してオリジナルのテーマをキューに追加する処理を実行しています。

 wp_enqueue_script関数の使い方

WordPressに対してスクリプトをキューに追加します。

 構 文

wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );

 引数の説明

引数名 データタイプ 必須項目 説明 初期値
$handle string  スタイルシートのハンドル
$src string スタイルシートのURL  ”
$deps array  このスタイルシートが依存するスタイルシートのハンドルの配列  array()
$ver string|bool|null 記載すると、cssのURLの最後にバージョン番号が付きます。無しの場合、WordPressのバージョン番号が付きます。バージョン番号を付与しない場合は、NULLを書きます。  false
$in_footer bool  true: スタイルが</body>の直前で読み込まれる。false: スタイルが</head>の直前で読み込まれる。  false

(3) add_actionの説明

特定のアクションに関数をフックします。フックする関数の定義の後に、add_actionを記述します。

特定のアクションとは、WordPressには予め決まったアクションが有り、その複数のアクションの中で、自作した関数の実行を登録するアクションのことです。

言い換えれば、画面のプログラミングなどで、イベント・ドリブンのプログラミング開発をしますが、add_actionは、それと似たものです。actionドリブンのプログラミングと言えば良いでしょうか。

そのアクションの一覧は、こちらです。自分がしたい処理に適切なアクションを使います。今回のスタイルやJSのファイルの登録・キュー追加の処理は、’wp_enqueue_scripts’ というアクションを使用します。

 構 文

 引数の説明

 

引数名 データタイプ 必須項目 説明 初期値
$hook string オリジナル関数名がフックされるWordPressのデフォルトのアクション名
$function_to
_add
string (WordPressのデフォルトのアクションに)追加するオリジナルの関数名。
$priority integer アクションに追加している関数の実行順を整数で指定する。同じ数で指定した場合、アクションに追加された順に実行。  10
$accepted_args integer フックした関数がアクションから受け入れる引数の数 1
hook; 入力・出力などに伴うデータの流れを監視して、通常と違う独自処理を行うために予約する仕組み

 

★この記事を書くのに以下のサイトを参考にしました

スポンサード・リンク (Sponsored Link)....

-科学/IT

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

ペルセウス座流星群2018!方角や観測日時・ピークは?

皆さんこんにちは。 流れ星を夜空に見つけたら、三回願い事をすると叶うといわれています。 そう言われる理由は、流れ星を見つけるのは非常にレアーだからですね。 しかし、1年の間で、たくさんの流れ星を見れる …

ペルセウス座流星群2018!方角や日時や群馬県の穴場はどこ?

皆さんこんにちは。 夜空に軽やかに流れる流れ星を見かけた時は 三回願い事をするいいと聞いたことがありますか? でも、流れ星はすぐに消えてしまうので、 その短い時間の間に、3回願い事を唱えるのは難しいで …

Windows10 Creators Update後ネットワーク上のサーバーやPCが表示できない問題

皆さん、こんにちは。 私は、Windows10を使用していますが 数日前から、自分のPCを立ち上げて、ネットワークをみると、 ネットワーク上のサーバーのNASや、NASにアクセスしてる、 その他のPC …

人工知能(AI)の普及で10年後~20年後の社会はどう変わるか?

今、人工知能(Artificial Intelligence)が話題になっていますが、巷で、このせいで人間の単純労働などが人工知能とロボットの普及によりとってかわられ、人間の仕事が10年後には、40% …

Rails cが実行不可能、Permission denied @ rb_sysopen – /Users/…の対応策

  rails console実施で Could not find thor-0.19.4 in any of the sourcesというエラーが発生しました!   今日、会社に …

スポンサードリンク