How enqueue CSS out of theme folder?

Question

How we can enqueue a stylesheet out of theme folder? Example: wp-content > cssfile.css

Answer 1

You can use content_url() to get a URL to the wp-content folder:

add_action( 'init', function() {
    wp_enqueue_style( 'my-tag', content_url( 'cssfile.css' ) );
});

See https://developer.wordpress.org/reference/functions/content_url/

Answer 2

To enqueue a stylesheet located outside of your theme folder, you can use the wp_enqueue_style() function in your theme's functions.php file or in a custom plugin. Here is an example of how you can enqueue a stylesheet located in the wp-content folder:

function enqueue_custom_stylesheet() {
  wp_enqueue_style( 'custom-styles', '/wp-content/cssfile.css' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_custom_stylesheet' );

This will add the cssfile.css stylesheet to your site's front-end. The wp_enqueue_style() function takes two arguments: a handle for the stylesheet and the URL of the stylesheet file. The handle is used to identify the stylesheet and should be unique. The URL should be the absolute path to the stylesheet file, starting from the root of your WordPress installation.

You can also use the wp_register_style() function to register the stylesheet before enqueuing it, as shown in the following example:

function register_custom_stylesheet() {
  wp_register_style( 'custom-styles', '/wp-content/cssfile.css' );
}
add_action( 'wp_enqueue_scripts', 'register_custom_stylesheet' );

function enqueue_custom_stylesheet() {
  wp_enqueue_style( 'custom-styles' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_custom_stylesheet' );

This can be useful if you specify additional arguments, such as the stylesheet's dependencies or version when registering the stylesheet.

I hope this helps!

Update

The wp-content folder in a WordPress installation can be located anywhere on the server, and its path can be defined using the WP_CONTENT_DIR constant in the wp-config.php file.

For example, if you want to move the wp-content folder to a different location, you can define the WP_CONTENT_DIR constant as follows:

define( 'WP_CONTENT_DIR', dirname( __FILE__ ) . '/new-content-folder' );

This will change the path of the wp-content folder to /new-content-folder.

It's important to note that when you change the location of the wp-content folder, you also need to update the WP_CONTENT_URL constant to reflect the new URL of the wp-content folder. This constant is used to define the URL of the wp-content folder, and is used in WordPress to reference assets such as stylesheets and JavaScript files.

For example, if you have moved the wp-content folder to /new-content-folder, you should update the WP_CONTENT_URL constant as follows:

define( 'WP_CONTENT_URL', get_site_url() . '/new-content-folder' );

This will update the URL of the wp-content folder to http://example.com/new-content-folder, where http://example.com is the URL of your WordPress site.