web-dev-qa-db-ja.com

特定のページで子テーマのCSSを無効にする

私は子テーマを有効にしたので、親テーマのCSSだけを残して、特定のページで子テーマのCSSを完全に無効にする必要があります。

どうすればこれができますか？

csschild-themewp-enqueue-style
1
user1049961

あなたがする必要があるものを達成するための2つの方法があります。

方法1

最初の方法は、子供のメインのstyle.cssから別のスタイルシートを作成してから、すべてのCSSをそのスタイルシートに移動することです。この例では、このスタイルシートをcustom-style.cssと呼びます。

前述のように、特定のページだけに固有のCSSをすべてこの新しいスタイルシートにコピーします。

wp_enqueue_style() を条件付き is_page() 条件付きタグを使用して、必要なページにのみ使用できるようになりました。それで、あなたの子functions.phpを開いて、そこに以下を追加してください

function enqueue_my_style() {
  if( is_page( SEE CODEX FOR EXAMPLES)) {
    wp_enqueue_style( 'my-style', get_stylesheet_directory_uri().'/custom-style.css' );
  }
 }
 add_action( 'wp_enqueue_scripts', 'enqueue_my_style' );

方法2

デフォルトbody_class()は、cssを使用して特定のページをターゲットにするためにいくつかのcssセレクタをデフォルトで使用可能にします。ここにこれらのセレクターがあります

  • .rtl {}
  • .home {}
  • .blog {}
  • 。アーカイブ {}
  • .date {}
  • .search {}
  • .paged {}
  • .attachment {}
  • 。エラー404 {}
  • .single postid-（id）{}
  • .attachmentid-（id）{}
  • .attachment-（mime-type）{}
  • .author {}
  • .author-（user_nicename）{}
  • 。カテゴリー {}
  • .category-（slug）{}
  • .tag {}
  • .tag-（スラッグ）{}
  • .page-parent {}
  • .page-child parent-pageid-（id）{}
  • .page-template page-template-（テンプレートファイル名）{}
  • 。の検索結果 {}
  • .search-no-results {}
  • .logged-in {}
  • .paged-（ページ番号）{}
  • .single-paged-（ページ番号）{}
  • .page-paged-（ページ番号）{}
  • .category-paged-（ページ番号）{}
  • .tag-paged-（ページ番号）{}
  • .date-paged-（ページ番号）{}
  • .author-paged-（ページ番号）{}
  • .search-paged-（ページ番号）{}

特定の要素にスタイルを適用する場合、これらのセレクタを使用して特定のページの特定の要素のみをターゲットにすることができます。

.home H1 {}

ホームページのH1要素のみをターゲットにします

2
Pieter Goosen