WordPressの子テーマを有効化すると、レイアウトが崩れてしまいます。

Question

WordPressでサイトを運営中です。
使用テーマはEnfold
レンタルサーバーはロリポップ
functions.phpをいじりたかったので、子テーマを作成しようと思っています。

子テーマの作成はで出来るのですが、子テーマを有効化すると、レイアウトが崩れてしまします。
崩れてしまうというか、Enfoldテーマを初めてインストールして有効化した後のレイアウトになります。

子テーマには、
・functions.php
・screenshot.png
・style.php
が入っています。

子テーマを有効化した後、ページのソースを確認してみると、
以下のように親、子の順でstyle.cssが読み込まれているのですが、子テーマを有効化させてしまうと、親テーマ有効化時のようなレイアウトにはなりません。あくまで、現状のサイトレイアウトを維持して、それに対して子テーマを使用して追加を行いたいです。

<link rel='stylesheet' id='parent-style-css' href='http://abc.com/wp-content/**themes/enfold/style.css**?ver=5.4.1' type='text/css' media='all' /> <link rel='stylesheet' id='child-style-css' href='http://abc.com/wp-content/**themes/enfold-child/style.css**?ver=5.4.1' type='text/css' media='all' />

親テーマ内にある追加CSS情報も子テーマへ反映されていますよね？

ネット上で、「子テーマ　作成」などのワードで出てくるサイトは全て読んだのですが解決しませんでした。

詳しい方、いらっしゃいましたらご回答よろしくお願いします。

以下の作成した子テーマのコードを記載させていただきます。

<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
  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')
  );
}
?>

/*
Theme Name:enfold-child
Template:enfold
Version:4.6
*/

Comments

[Lhankor_Mhy]

結果（実際に起きたこと）を書きましょう
https://teratail.com/help/question-tips#questionTips3-4-1

期待した処理結果を書きましょう
https://teratail.com/help/question-tips#questionTips3-4-3