TKLOG

Tag: 環境構築

  • functions.phpからCSSやJavaScriptを読み込む

    functions.phpからCSSやJavaScriptを読み込む

    —

    by

    TK39
    in

    functions.phpとは ワードプレスのワードプレスの機能を管理するファイル。 ここにCSSやjavaScriptを読み込むための関数を記述していく。 wp_enqueue_style() wp_head()で読み込むCSSを追加するための関数。 wp_enqueue_style( string $handle, string $src = ”, string[] $deps = array(), string|bool|null $ver = false, string $media = ‘all’ ) wp_enqueue_script() wp_footer()で読み込むJavaScriptを追加するための関数。 wp_enqueue_script( string $handle, string $src = ”, string[] $deps = array(), string|bool|null $ver = false, array|bool $args = array() ) 依存関係に関しては、$deps = array()でjQueryを読み込む。 WordPressではjQueryを標準で読み込んでいるので依存関係の部分に記述すれば良い。 add_action() WordPressの「特定のタイミング」で「自分の関数（処理）」を実行させるための関数。 よく使うアクションフックの例 フック名 タイミング 使い道の例 init WordPressの初期化時 カスタム投稿タイプの登録など wp_enqueue_scripts CSSやJSの読み込み処理 wp_enqueue_style() など wp_head <head>タグの中に挿入 metaタグやCSS wp_footer </body> の前に挿入 JavaScriptやトラッキングコード add-actionは基本的に、add_action( “実行するタイミング” , “実行したい関数名” )で指定します。 優先順位と引数の数も指定できる ※優先順位の数字が小さいほど先に実行されます。省略すると「10」になります。 この実行するタイミングは、WordPressによってあらかじめ用意されておりフック（hook）と呼ばれる。 まとめ 項目 内容 関数名 add_action() 役割 WordPressの処理の途中に、独自の関数を割り込ませる よく使うフック init, wp_head, wp_footer, wp_enqueue_scriptsなど 便利な場面 CSS/JSの読み込み、処理のフック、データ保存など wp_head() WordPressがHTMLの<head>タグ内に必要なコードを自動で出力してくれる関数。…