web-dev-qa-db-ja.com

@importを使用せずに子テーマを設定する方法

私は今、私が今は悪い習慣であると言われている私の子供のテーマでCSSのために@importを使いました。

今後子供のテーマを設定するための最良の方法は何ですか？ワードプレスコーデックスに関する最新の解決策は、本当に複雑で非常に混乱しやすいようですか？

私の子供のテーマのfunctions.phpで比較的単純なエンキューをする方法がなければなりませんか？

どんな助けでも素晴らしいでしょう。私はこれに関する簡潔な情報を見つけようとして完全に道に迷っているか無用であると感じます。

エミリー

child-themewp-enqueue-style
2
The Chewy

@importを使用する代わりに親テーマのスタイルをキューに入れるための codex にあるコードは、十分にコメントされていないため、さらにコメントを追加します。

<?php
function my_theme_enqueue_styles() {
    $parent_style = 'parent-style';
    wp_enqueue_style($parent_style, get_template_directory_uri() . '/style.css');
    wp_enqueue_style('child-style', 
            get_stylesheet_directory_uri() . '/style.css', 
            array($parent_style), 
            wp_get_theme()->get('Version')
            );
}
add_action('wp_enqueue_scripts', 'my_theme_enqueue_styles');
?>

1.-行：

$parent_style = 'parent-style';

これは文字通りテーマのスタイルシートに与える文字列名であり、キューイングしているスタイルシートの$handleになります。たとえば'divi-style'のようにHTMLで、このようにIDとして使用されます<link rel="stylesheet" id="divi-style" ...

2.-行：

wp_enqueue_style($parent_style, get_template_directory_uri() . '/style.css');

スタイルシートを登録してキューに登録し、登録するときに最初のパラメーターの名前を使用します。この場合は'parent-style'になり、get_template_directory_uri()を使用してparent themeスタイルシートへのパスを取得します。

3.-行：

wp_enqueue_style('child-style', 
            get_stylesheet_directory_uri() . '/style.css', 
            array($parent_style), 
            wp_get_theme()->get('Version')
            );

これは、子テーマスタイルシート（現在のテーマスタイルシート）を登録およびキューイングします。これはテーマの通常の手順です。各パラメーターは既に説明されています here 、例：

  • 'child-style'-これはこのスタイルシートの名前です$handle

  • get_stylesheet_directory_uri() . '/style.css'-これはスタイルシートファイルへのパスです。

  • array($parent_style)-これは、スタイルシートを実行する前に実行する必要があるスタイルシートの配列であり、実際のパスを入れることができないため、$handleで名前を付けます。この場合、最初に実行する親スタイルシートが必要です（依存）

  • wp_get_theme()->get('Version')-これはスタイルシートの最後にある番号バージョンですURLこの/style.css?ver=1.0のように、これはキャッシュの目的のためです。標準では、バージョンを更新して、キャッシュされたバージョンではなく最新のファイルをロードします、あなたがそれを正しく使用するすべてのファイルでその番号を変更したくないですか？ wp_get_theme()->get('Version')を使用すると、style.cssファイル（親ではない）にあるバージョンが取得されます。


したがって、再開バージョンが必要な場合は次のようになります。

<?php

function my_theme_enqueue_styles() {
    //load the parent stylesheet
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    //load the child stylesheet but after the parent stylesheet
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( 'parent-style' ));

}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>
1
David Lee

私はこれがあなたが探している特定のコードだと思います、これはWordPress Codexで見つけることができます どのように子テーマを作成する

<?php
function my_theme_enqueue_styles() {
  // This is the parent style handle name. Recommended to leave as it is.
  $parent_style = 'parent-style';

  wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
  wp_enqueue_style( 'child-style',
    get_stylesheet_directory_uri() . '/style.css',
    array( $parent_style ),
    wp_get_theme()->get('Version')
  );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>

クレジット はWordPressコーデックスに行きます。

3
Den Isahac