I’ve created a simple custom wordpress theme to be integrated with woocommerce and i have trouble importing woocommerce internal css to my theme over functions.php. My intention was to edit the product archive page template so it contains a sidebar by importing woocommerce archive-product.php and content-product.php to my theme themes/my-theme/woocommerce and modifying their content.
I successfully added those templates to my theme using add_theme_support(‘woocommerce’); but the only problem is that they render in raw html and now i don’t now how to access woocommerce default css properties. This is my current functions.php, help me modify it so that my customized templates have access to woocommerce.css and woocommerce-layout.css:
<?php
function klima_uredaji_hrvatska_files() {
// Enqueue the main stylesheet (style.css)
wp_enqueue_style('klima_uredaji_hrvatska_main_style', get_stylesheet_uri());
// Enqueue the compiled Tailwind CSS stylesheet
wp_enqueue_style('tailwindcss', get_template_directory_uri() . '/src/output.css', array(), '1.0', 'all');
}
add_action('wp_enqueue_scripts', 'klima_uredaji_hrvatska_files');
function add_woocommerce_stylesheet() {
if ( class_exists( 'WooCommerce' ) ) {
echo '<link rel="stylesheet" href="' . esc_url( plugins_url( 'woocommerce/assets/css/woocommerce-layout.css' ) ) . '" type="text/css" media="all" />';
}
if ( class_exists( 'WooCommerce' ) ) {
echo '<link rel="stylesheet" href="' . esc_url( plugins_url( 'woocommerce/assets/css/woocommerce.css' ) ) . '" type="text/css" media="all" />';
}
}
add_action('wp_head', 'add_woocommerce_stylesheet');
// WooCommerce Support
add_theme_support('woocommerce');