John Davidson

Message:

I have a home page which have actually one section with something similar to "carousel". In this section I dynamically load post from custom post type using ajax. Problem is that a post is created with Elementor and file with post CSS doesn't load in "head" tag.

Does anyone know is there a possibility to load CSS file manually based on post ID? Or another way to trigger generating CSS file and include to the head?

---

My Answer:
One possible solution is to enqueue the CSS file manually in your theme's functions.php file based on the post ID. You can use the wp_enqueue_style function to do this.

Here's an example of how you can enqueue the CSS file based on the post ID:

php
add_action('wp_enqueue_scripts', 'enqueue_post_css');

function enqueue_post_css() {
global $post;

// Check if we are on the home page and if the post ID is set
if (is_home() && isset($post->ID)) {
// Enqueue the CSS file based on the post ID
wp_enqueue_style('post-css-' . $post->ID, get_stylesheet_directory_uri() . '/path/to/post-css-file.css');
}
}


Replace 'path/to/post-css-file.css' with the actual path to the CSS file for the post. This code will enqueue the CSS file on the home page based on the post ID.

Alternatively, you can also try triggering the generation of the CSS file and including it in the head using Elementor's hooks or filters. You may need to refer to Elementor's documentation or reach out to their support for more specific guidance on this approach.