plugin_dir_url( string $file ): string

User Contributed Notes

1. Skip to note 4 content

   10Horizons Plugins 6 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 17You must log in to vote on the helpfulness of this note

   Let’s say current URL is: http://example.com/wp-content/plugins/my-plugin/includes/

   echo plugin_dir_url( __FILE__ ).'images/placeholder.png';

   will output: http://example.com/wp-content/plugins/my-plugin/includes/images/placeholder.png

   echo plugin_dir_url( __DIR__ ).'images/placeholder.png';

   will output: http://example.com/wp-content/plugins/my-plugin/images/placeholder.png

   • Let’s say current URL is: http://example.com/wp-content/plugins/my-plugin/includes/pages/ echo plugin_dir_url( __FILE__ ).'images/placeholder.png'; will output http://example.com/wp-content/plugins/my-plugin/includes/pages/images/placeholder.png echo plugin_dir_url( __DIR__ ).'images/placeholder.png'; will output http://example.com/wp-content/plugins/my-plugin/includes/images/placeholder.png Which is still not the plugin directory, but only one directory above. I’m still searching for a logical function that returns the root of our plugins.

     Gardian 2 years ago
2. Skip to note 5 content

   Codex 9 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 3You must log in to vote on the helpfulness of this note

   Basic Example

   /**
    * Include CSS file for MyPlugin.
    */
   function myplugin_scripts() {
       wp_register_style( 'foo-styles',  plugin_dir_url( __FILE__ ) . 'assets/foo-styles.css' );
       wp_enqueue_style( 'foo-styles' );
   }
   add_action( 'wp_enqueue_scripts', 'myplugin_scripts' );

   Would echo:

   http://example.com/wp-content/plugins/my-plugin/assets/foo-styles.css
3. Skip to note 6 content

   Trooinbound Pvt Ltd. 6 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 2You must log in to vote on the helpfulness of this note

   plugin_dir_url( __FILE__ ) == http://your-url.com/wp-content/plugins/your-plugin/
   

   function enqueue_scripts() {
   	wp_enqueue_script( 'custom-js', plugin_dir_url( __FILE__ ) . 'js/custom.js', array( 'jquery' ), '', true );
   	wp_enqueue_style( 'style-css', plugin_dir_url( __FILE__ ) . 'css/style.css' );
   }
   add_action( 'wp_enqueue_scripts', 'enqueue_scripts');
   
   function admin_enqueue_scripts() {
   	wp_enqueue_script( 'custom-js', plugin_dir_url( __FILE__ ) . 'js/custom.js', array( 'jquery' ), '', true );
   	wp_enqueue_style( 'style-css', plugin_dir_url( __FILE__ ) . 'css/style.css' );
   }
   add_action( 'admin_enqueue_scripts', 'admin_enqueue_scripts');

   • plugin_dir_url vs plugin_dir_path difference

     plugin_dir_url( string $file )

     Use it to include your assets (images, css, js etc).

     plugin_dir_path( string $file )

     Use it to include php files.

     Mehbub Rashid 5 years ago