Register all css file in child theme subfolder
-
Hello,
I use this code snippet to register new custom css file in child theme subfolder:
add_action( ‘wp_enqueue_scripts’, function() {
wp_enqueue_style( ‘generatepress-global-custom-css’, get_stylesheet_directory_uri() . “/custom-css/style.css”, array(), filemtime( get_stylesheet_directory() . “/custom-css/style.css” ) );
} );Now I want to register all css file in this subfolder, something like this: /custom-css/*.css
How can I achieve this, i tried to use *.css but it didnt work. Thanks
-
Hi @dutuka,
I’m not familiar with *.css. Do you have a document regarding this form of folder content CSS enqueueing? We’ll try to see how it goes.
Alternatively, a code that could work is something like this:
function enqueue_styles_from_folder() { $folder_path = get_template_directory() . '/css/'; // Replace 'css/' with your folder path if ($handle = opendir($folder_path)) { while (false !== ($file = readdir($handle))) { if ('.' !== $file && '..' !== $file && '.css' === substr($file, -4)) { $file_uri = get_template_directory_uri() . '/css/' . $file; // Replace 'css/' with your folder path wp_enqueue_style('style-' . $file, $file_uri); } } closedir($handle); } } add_action('wp_enqueue_scripts', 'enqueue_styles_from_folder');It’s a loop that checks for .css files in a specific directory, and enqueues it.
This is more of a general WordPress concern though as opposed to being theme-related. It would be good to ask in the WP forums as well: https://ww.wp.xz.cn/support/forum/wp-advanced/
Hi ernandoazarcon2,
thank you for your help, I just tested the code, replace my custom folder path, unfortunately the code does not work.
I use this snippet to include all .php files in custom folder:
$filepath = dirname(FILE).'/custom-php/'; $files = scandir($filepath); foreach ($files as $file) { // match the file extension to .php if (substr($file,-4,4) == '.php') {include($filepath.$file);} }May be you can combine this to enqueue all .css files in custom folder.
Best thanks in advanced.
Can you share the entire code?
It is the entire code snippet, i put it in the functions.php file, all the .php files in /custom-php/ folder in the child theme will be included.
$filepath = dirname(FILE).'/custom-php/'; $files = scandir($filepath); foreach ($files as $file) { // match the file extension to .php if (substr($file,-4,4) == '.php') {include($filepath.$file);} }Now i want to achieve the same for all .css files in the /custom-css/ folder in the child theme.
-
This reply was modified 2 years, 11 months ago by
dutuka.
There should be something like this code for that code to work:
add_action('wp_enqueue_scripts', 'enqueue_styles_from_folder');Can you check?
Im trying to test around but still not work.
Is there any enqueue code in your functions.php?
This isn’t GP related as well as mentioned. It would be best to ask here instead: https://ww.wp.xz.cn/support/forum/wp-advanced/
Thanks for the link, there is no other enqueue code in my functions.php, but i consider to use only one css file, its better for performance but not so comfort to maintain.
Hi there,
are you wanting to combine several child theme stylesheets into one file on the fly – and then only enqueue the combined file ?
If so, you would need custom development,
And I am not sure if doing this would improve performance.
As it would create a much larger file, that the browser may have to make many round trips to load, which could take longer for the browser to parse which would effect render blocking.
If you’re server is running HTTP2 then multiple small files can loaded concurrently – which can be faster then one large file.Thank you for your infos. My server uses HTTP/2, I want to maintain custom css in a subfolder separated in several css files. I need a code snippet, which automatically include every css file i create in that subfolder.
I found this code snippet from stackexchange, which works for that user, but does not work on my site:
foreach( glob( get_template_directory(). '/css/*.css' ) as $file ) { $file = str_replace(get_template_directory(), '', $file); echo ( get_template_directory_uri() . $file); // $file contains the name and extension of the file wp_enqueue_style( $file.'style', get_template_directory_uri() . $file); }At the moment only this code snippet works for me, but I will have to register every css file i create in the subfolder:
add_action( 'wp_enqueue_scripts', function() { wp_enqueue_style( 'generatepress-custom', get_stylesheet_directory_uri() . "/custom-css/custom.css", array(), filemtime( get_stylesheet_directory() . "/custom-css/custom.css" ) ); wp_enqueue_style( 'generatepress-custom1', get_stylesheet_directory_uri() . "/custom-css/custom1.css", array(), filemtime( get_stylesheet_directory() . "/custom-css/custom1.css" ) ); } );-
This reply was modified 2 years, 11 months ago by
dutuka.
Try this:
function enqueue_css_files_from_folder() { $css_folder = gget_stylesheet_directory_uri() . '/YOUR-FOLDER-NAME/'; // Get all CSS files from the folder $css_files = glob( get_stylesheet_directory_uri()) . '/YOUR-FOLDER-NAME/*.css' ); // Enqueue each CSS file foreach ( $css_files as $css_file ) { $css_filename = basename( $css_file ); wp_enqueue_style( $css_filename, $css_folder . $css_filename ); } } add_action( 'wp_enqueue_scripts', 'enqueue_css_files_from_folder' );Replace YOUR-FOLDER-NAME in the code.
Thank you, I tested the code and got: [HTTP/2 500 Internal Server Error]
There’s an error in this line:
$css_folder = gget_stylesheet_directory_uri() . '/YOUR-FOLDER-NAME/';it should be:
$css_folder = get_stylesheet_directory_uri() . '/YOUR-FOLDER-NAME/'; -
This reply was modified 2 years, 11 months ago by
The topic ‘Register all css file in child theme subfolder’ is closed to new replies.
