web-dev-qa-db-fra.com

Comment fonctionne un thème enfant?

J'ai créé un thème enfant et je l'ai installé mais je ne sais pas exactement comment ça marche!

Par exemple, dans le thème parent, j'ai le code ci-dessous:

.header {
   margin-top: 10px;
   margin-bottom: 10px;
   width: 300px;
   height: 150px;
   background: white;
   border-width: 5px;
}

Et je veux pas inclure la largeur: 300px; , l’arrière-plan et la largeur de la bordure (parce que je ne veux pas d’arrière-plan et de la bordure) et modifie le "margin-top: 10px;" to "margin-top: 15px;" dans le thème de l'enfant.

Donc, normalement, dans le thème de l'enfant, j'aurais:

.header {
   margin-top: 15px;
   margin-bottom: 10px;
   height: 150px;
}

Le sujet est que si je le fais, WordPress vérifie automatiquement d’abord le style.css du thème enfant, puis le style.css du thème parent. Donc, il va exécuter le code manquant (width: 300px;, le fond et la largeur de la bordure).

Que devrais-je faire? Je suis un peu confus. Dois-je supprimer chaque ligne que je ne veux pas du thème parent? Mais si je le fais après une mise à jour, il l'ajoutera à nouveau.

1
Charitos

Vous avez raison, WordPress chargera d’abord le fichier style.css à partir de votre thème parent, puis le fichier style.css à partir de votre thème enfant. Cela signifie qu'en raison du fonctionnement de CSS lui-même, vous devez remplacer toute règle que vous souhaitez remplacer.

Cela signifie que vous devez modifier le code CSS dans le style.css de votre thème enfant pour qu'il soit:

.header {
   margin-top: 15px;
   margin-bottom: 10px;
   width: 100%;
   height: 150px;
   background: none;
   border-width: 0;
}
2
Rachel Baker

Vous souhaiterez peut-être copier le fichier header.php dans votre dossier de thème enfant et rechercher et supprimer toutes les importations de feuilles de style du thème parent. Si vous souhaitez inclure les feuilles de style, importez-le dans le style.css de votre thème enfant, comme suit:

/* Import from parent theme styles first */
@import url('/path-to-parent-theme/style.css');

Ensuite, vous pouvez ajouter tous vos CSS après. Vos règles remplaceront celles du parent.

Vous pouvez également consulter votre fichier functions.php pour toute importation de feuilles de style. Peut ressembler à ceci:

wp_register_style( 'style',get_stylesheet_directory_uri() . '/style.css', false );
wp_enqueue_style( 'style' );

Vous pouvez commenter ce dont vous avez besoin. Vous pouvez utiliser wp_deregister_style et wp_dequeue_style, mais je ne les ai jamais obtenus.

0
gorelog