WordPress : Funcion wp_enqueue_style()

Documentacion oficial : https://developer.wordpress.org/reference/functions/wp_enqueue_style/

wp_enqueue_style() es una función en WordPress que se utiliza para poner en cola una hoja de estilo CSS. Se usa comúnmente en temas y complementos de WordPress para cargar archivos CSS en temas o archivos de complementos de WordPress.

Como usar wp_enqueue_style para poner en cola hojas de estilo CSS en WordPress

Al crear temas o plugins de WordPress, es fundamental incluir las hojas de estilo en la cola para que se carguen correctamente.

Sintaxis wp_enqueue_style

wp_enqueue_style( 
string $handle, 
string $src = '',
array  $deps = array(), 
string|bool|null $ver = false, 
string $media = 'all' 
)

// $handle: nombre del estilo (requerido) (string)
// $src:    ruta del archivo a incluir (requerido) (string)
// $deps:   nombre del estilo dependiente, 
//se carga el dependiente previamente  (array)
// $ver:    versión del archivo que vamos a incluir (string|bool|null)
// $media:  media del estilo a incluir ('all', 'screen', 'print', 'handheld') (string)

wp_enqueue_style( $handle, $src, $deps, $ver, $media );

Referencia : https://gist.github.com/kodetop/177091ed0efa04d187ba9b052f58d388

• $handle (string): Un nombre único para la hoja de estilo. Se utiliza como referencia al encolar la hoja de estilo y también puede utilizarse para desencolarla.
• $src (string): La URL o ruta del archivo de la hoja de estilo. Si está vacío, asume que el identificador se refiere a una hoja de estilo registrada previamente con wp_register_style().
• $deps (array): Un array de identificadores de cualquier hoja de estilo de la que dependa esta hoja de estilo (es decir, cualquier hoja de estilo que deba cargarse antes que esta).
• $ver (string|bool|null): Número de versión de la hoja de estilo. Si se establece en true, WordPress agrega la versión de WordPress. Si se establece en false o se deja vacío, WordPress no agrega un número de versión. También se puede especificar un número de versión personalizado como una cadena.
• $media (string): El tipo de medio para el que se ha definido esta hoja de estilo. Por defecto es 'all', pero también puede ser 'screen', 'print', etc.

Uso de ejemplo:

wp_enqueue_style( 'custom-style', 
get_template_directory_uri() . '/css/custom-style.css', 
array(), '1.0', 'all' );

Esta línea encola una hoja de estilo con el identificador 'custom-style'. Supone que hay un archivo llamado 'custom-style.css' ubicado en la carpeta 'css' dentro del directorio del tema. No tiene dependencias, versión 1.0 y se aplica a todos los tipos de medios ('all').

parametro $media

wp_enqueue_style(), el cual nos permite especificar los medios para los que se aplican los estilos.

Por defecto, los estilos se aplican a todas las pantallas (media=’all’),

'screen' para pantallas de ordenador.

'print' para la versión de impresión de la página.

'handheld' para dispositivos móviles.

Ejemplo :

add_action('wp_enqueue_scripts', 'agregar_estilo_personalizado');
function agregar_estilo_personalizado() {
   wp_enqueue_style('nombre-estilo', 
    get_template_directory_uri() . '/css/mi-estilo.css', array(), '1.0', 'screen');
}

En este caso, el quinto parámetro es ‘screen’, lo que significa que los estilos CSS solo se aplicaran a pantallas de ordenador.

Ejemplo de uso en el archivo function.php

// ------------ INICIO  Cargar estilos al footer
function load_mis_styles_footer() {
    wp_enqueue_style( 'mis-styles', get_stylesheet_uri() , false, '3.0' , 'all' );


    wp_enqueue_style( 'google-fonts-Raleway', 'https://fonts.googleapis.com/css?family=Raleway:900,400,500|Roboto:400&display=swap' );

       wp_enqueue_style( 'css_animate_v4_1_1',  get_template_directory_uri() . '/css/animate.min.css');
	
};

add_action( 'get_footer', 'load_mis_styles_footer' );

// ------------ FIN Cargar estilos al footer

Cómo poner en cola la hoja de estilo style.css del tema principal.

Para poner en cola la hoja de estilos style.css del tema principal, utiliza la función wp_enqueue_style() en el archivo functions.php de tu tema.

Referencia

https://guias.donweb.com/como-usar-wp-enqueue-style-en-tu-sitio-wordpress/