web-dev-qa-db-fra.com

Priorité de chargement du fichier css dans le thème enfant

J'essaie d'ajouter un autre fichier CSS à un thème enfant. J'ai un fichier style.css dans le thème enfant, mais il est chargé par défaut et je n'ai donc pas dû l'ajouter en tête. Maintenant, je veux ajouter un autre fichier CSS pour une conception sensible, mais je ne peux pas définir la priorité. Ils sont chargés en premier dans la tête, ils sont donc écrasés par d’autres fichiers. Voici le code que j'ai ajouté dans function.php, pour charger le fichier media-1100.css en tête:

wp_enqueue_style( 'media-1100', get_stylesheet_directory_uri() . '/css/media-1100.css');

Je veux donc que le fichier media-1100.css soit chargé en dernier. J'ai lu que je devais utiliser add_action dans function.php pour donner la priorité, mais ça ne marche pas, mon code est faux. Pouvez-vous m'aider? Merci

1
maria russo

Je suppose que cela doit être chargé en dernier car cela dépend des fichiers d’autres feuilles de style. Dans ce cas, la méthode recommandée dans Wordpress consiste à utiliser le paramètre "dépendances" dans wp_enqueue_style.

Configure les dépendances

wp_enqueue_style accepte un tableau des handles} pour les feuilles de style dont dépend votre feuille de style, par exemple.

$dependencies = array('child-style', 'another-style');
wp_enqueue_style( 'media-1100', get_stylesheet_directory_uri() . '/css/media-1100.css', $dependencies);

Recherche des poignées

Le descripteur est le premier paramètre passé dans wp_enqueue_style-. Par exemple, dans votre question, le descripteur est media-1100.

Si vous ne les avez pas configurées vous-même, vous pouvez toujours trouver les descripteurs de toutes les feuilles de style si vous affichez le code source de la page. Le descripteur correspond à la feuille de style id mais avec le -css supprimé. Par exemple, dans ce qui suit, l'id est "vingt-quinze-style-css", donc le descripteur est twentyfifteen-style:

<link rel='stylesheet' id='twentyfifteen-style-css'  href='http://www.example.com/assets/themes/twentyfifteen/style.css' type='text/css' media='all' />

Pour plus de détails, voir Ressources pour les développeurs Wordpress

3
FluffyKitten