【WordPress】 如何加入自定義的CSS/JS檔案

有時候在開發WordPress網站的時候會需要寫入一些自定義的CSS/JS來客製化樣式跟一些動態互動效果，這時候就可以用寫入functions.php 的方式把你自定義的CSS/JS檔案載入進來，方便維護/修改及開發。

將代碼寫在主題下的functions.php裡面

add_action( 'wp_enqueue_scripts', 'custom_style_scripts' );

/**

* Enqueue scripts and styles.

*/

function custom_style_scripts() {

//目錄可自行在子主題下面建立路徑像是css都放到css資料夾中，js就放到js資料夾中
//載入CSS
wp_enqueue_style( 'main_css',get_stylesheet_directory_uri() . '/css/main.css',);
//載入JS
wp_enqueue_script('main_js', get_stylesheet_directory_uri() . '/js/main.js', array('jquery'), false, true);

}

此方式適合在本地開發的時候使用，可以搭配一些前端開發工具像是 gulp 編譯scss的方式來開發，在使用git更新程式碼到線上端更新。

相關資料：
https://developer.wordpress.org/reference/functions/wp_enqueue_script/
https://developer.wordpress.org/reference/functions/wp_enqueue_style/