Thèmes enfants Problèmes de priorité CSS sans utiliser! Important

J'ai changé mon site WordPress pour utiliser des thèmes enfants, mais le style de thème parent a priorité sur toute modification que je fais sur le CSS du thème enfant. Je peux le contourner en utilisant !important, cependant c'est une solution inégale et les thèmes enfants devraient fonctionner comme première ressource du site.

Par exemple, dans mon site , la bordure qui comprend .wp-captionest de la même couleur que l'arrière-plan à l'aide de la !importantbalise, mais ne fonctionnera pas sans elle.

Est-ce que cela a à voir avec le fichier functions.php?

Voici le contenu de mon fichier PHP:

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}

Essayez de mettre en file d'attente le CSS de votre thème enfant comme ceci:

// Queue parent style followed by child/customized style
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', PHP_INT_MAX);

function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/styles/child-style.css', array( 'parent-style' ) );
}

Notez quelques choses:

1) PHP_INT_MAX en priorité pour que cela s'exécute en dernier

2) get_stylesheet_directory_uri () vs get_template_directory_uri () qui pointera vers le dossier de modèle du thème enfant au lieu des parents.

J'y ai également ajouté un sous-dossier, /styles/car je conserve normalement mon CSS dans un sous-dossier de mon thème.

3) suivi array( 'parent-style' )de faire en sorte que le CSS enfant ait le CSS parent comme dépendance, ce qui a pour effet de placer le thème parent en premier dans la tête et le CSS du thème enfant qui le suit. Pour cette raison, tout ce qui apparaît également dans le thème enfant qui se trouve déjà dans le thème parent remplacera la version du thème parent.

Réponse TLDR: le premier paramètre de chacun wp_enqueue_style()ne doit pas être laissé comme «style parent» et «style enfant». Ils doivent être renommés pour correspondre au nom du thème parent et de son enfant.

Problème

Si vous ne renommez pas les paramètres, vous obtiendrez le thème enfant mis en file d'attente une deuxième fois peut entraîner des règles apparaissant deux fois dans Firebug et changer les valeurs dans la mauvaise sans aucun effet apparent, ce qui peut vous inciter à penser que vos règles enfant ne sont pas '' t remplacer le parent.

L'attente

La page Codex sur les thèmes enfants dit correctement que si vous ne faites rien, le CSS enfant est automatiquement lié. C'est le cas, mais seulement cela. Le flux de travail CSS est un peu différent: vous voulez remplacer, pas remplacer. C'est logique (cela fonctionne comme les autres fichiers de thème) mais ils auraient pu avoir une note.

Solution

Renommez les paramètres. Je le fais comme ci-dessous pour obtenir (un peu) plus de contrôle, notez que vous devez remplacer twentysixteen et twentysixteen-child par les noms de votre thème et de votre thème enfant:

function theme_enqueue_scripts() {
    //FIRST
    wp_enqueue_style( 'twentysixteen-style', get_template_directory_uri() . '/style.css' );

    //...custom queueing of .js and .css for Javascript plugins and such here

    //LAST
    wp_enqueue_style( 'twentysixteen-child-style', get_stylesheet_directory_uri() . '/style.css', array( 'twentysixteen-style' ) );
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_scripts' );

(Notez également que vous ne contrôlez pas l'ordre des liens de certains (tous?) Plugins WP dans cette action. Ils sont liés après.)

Bonne chasse au sélecteur;)

Vous pouvez utiliser un sélecteur plus spécifique dans le CSS de votre thème enfant pour qu'il prenne le pas.

Donc au lieu de:

.wp-caption {
     fond: # 2d2d2d! important;
}

Utilisation:

.entry .wp-caption {
     fond: # 2d2d2d;
}

Vous devrez également vous assurer de mettre en file d'attente votre feuille de style de thème enfant dans votre fichier functions.php si vous ne l'êtes pas déjà.

http://codex.wordpress.org/Function_Reference/wp_enqueue_style