將 Javascript 文件與 wordpress 插件鏈接

Question

我正在努力完成我創建的基本插件。

我有一個具有以下結構的插件文件夾：

Folder_name: Booking
booking.php
js - script.js
css - style.css
js and css are sub folders in the Booking folder. 

我在booking.php文件中有以下功能：

function sc_booking_process() {
    return 'html content which uses divs which connect to js and css files';
}
 add_shortcode('cinema-booking', 'sc_booking_process');
?>

booking.php 需要鏈接到 javascript 和 css 文件才能正常工作，但無論我做什么方法都行不通。

我曾嘗試將以下內容放在上述功能之前，但它們仍然沒有鏈接到它：

function my_scripts_and_css() {
    wp_enqueue_style( 'my-plugin-css', 'css/style.css'  );
    wp_enqueue_script( 'my-plugin-js', 'js/script.js', array('jquery'), '20200110' );       
}
add_action( 'wp_enqueue_scripts', 'my_scripts_and_css' );

任何建議將不勝感激。

Answer 1

function my_scripts_and_css() {

  wp_enqueue_style( 'my-plugin-css', plugin_dir_url( __FILE__ ).'/css/style.css' );
  wp_enqueue_script( 'my-plugin-js', plugin_dir_url( __FILE__ ).'/js/script.js', array('jquery'), '20200110' );       

}

add_action( 'wp_enqueue_scripts', 'my_scripts_and_css' );

你為css和js調用了錯誤的目錄，請試試這個！ 希望它對你有用

Answer 2

function my_scripts_and_css() {

  wp_enqueue_style( 'my-plugin-css', plugins_url( '/css/style.css', __FILE__ ) );
  wp_enqueue_script( 'my-plugin-js', plugins_url( '/js/script.js',__FILE__ ), array('jquery'), '20200110' );       

}
add_action( 'wp_enqueue_scripts', 'my_scripts_and_css' );

它現在應該可以工作了！ 請試試這個