AMORE(TCD028)のwp_enqueue一覧と子テーマ作成

子テーマを作る時、cssのwp_enqueue_style や javascriptのwp_enqueue_scriptを確認して作ります。そのため、grepで一覧を抽出しました。ご参考ください。

css wp_enque_style

./admin/theme-options.php:219:wp_enqueue_style('imgareaselect');
./functions.php:90:     wp_enqueue_style( '_tk-bootstrap-wp', get_template_directory_uri() . '/includes/css/bootstrap-wp.css' );
./functions.php:93:     wp_enqueue_style( '_tk-bootstrap', get_template_directory_uri() . '/includes/resources/bootstrap/css/bootstrap.min.css' );
./functions.php:96:     wp_enqueue_style( '_tk-font-awesome', get_template_directory_uri() . '/includes/css/font-awesome.min.css', false, '4.1.0' );
./functions.php:99:     wp_enqueue_style( '_tk-style', get_stylesheet_uri() );
./functions.php:306:        wp_enqueue_style('thickbox');
./functions.php:314:  wp_enqueue_style('thickbox');
./functions.php:332:  wp_enqueue_style('my_widget_css', get_template_directory_uri() . '/widget/css/style.css','','1.0');
./functions.php:333:  wp_enqueue_style('my_admin_css', get_template_directory_uri() .'/admin/my_admin.css','','1.0');

テーマディレクトリ直下のfunctions.phpの中でほぼすべてのcssを読み込み順序含めて制御している様ですね。 テーマディレクトリ /admin/theme-options.php にあるenqueueは、javascriptのwp_enqueue_scriptを含めて以下の様な感じです。ダッシュボード⇒外観⇒TCDテーマオプション で使われるものみたいなので、子テーマ実装無しでも問題なさそうです。

// カラーピッカーの準備 その他javascriptの読み込み
add_action('admin_print_scripts', 'my_admin_print_scripts');
function my_admin_print_scripts() {
  wp_enqueue_script('jscolor', get_template_directory_uri().'/admin/jscolor.js');
  wp_enqueue_script('jquery.cookieTab', get_template_directory_uri().'/admin/jquery.cookieTab.js');
}



// 画像アップロードの準備
function wp_gear_manager_admin_scripts() {
wp_enqueue_script('dp-image-manager', get_template_directory_uri().'/admin/image-manager.js', array('jquery', 'jquery-ui-draggable', 'imgareaselect'));
wp_enqueue_script('dp-image-manager2', get_template_directory_uri().'/admin/image-manager2.js', array('jquery', 'jquery-ui-draggable', 'imgareaselect'));
}
function wp_gear_manager_admin_styles() {
wp_enqueue_style('imgareaselect');
}
add_action('admin_print_scripts', 'wp_gear_manager_admin_scripts');
add_action('admin_print_styles', 'wp_gear_manager_admin_styles');

javascript wp_enqueue_script

./includes/customizer.php:24:   wp_enqueue_script( '_tk_customizer', get_template_directory_uri() . '/includes/js/customizer.js', array( 'customize-preview' ), '20130508', true );
./admin/theme-options.php:207:  wp_enqueue_script('jscolor', get_template_directory_uri().'/admin/jscolor.js');
./admin/theme-options.php:208:  wp_enqueue_script('jquery.cookieTab', get_template_directory_uri().'/admin/jquery.cookieTab.js');
./admin/theme-options.php:215:wp_enqueue_script('dp-image-manager', get_template_directory_uri().'/admin/image-manager.js', array('jquery', 'jquery-ui-draggable', 'imgareaselect'));
./admin/theme-options.php:216:wp_enqueue_script('dp-image-manager2', get_template_directory_uri().'/admin/image-manager2.js', array('jquery', 'jquery-ui-draggable', 'imgareaselect'));
./header.php:30:    wp_enqueue_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js');
./header.php:42:  <?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>
./share_button.php:4:wp_enqueue_script(
./functions.php:102:    wp_enqueue_script('_tk-bootstrapjs', get_template_directory_uri().'/includes/resources/bootstrap/js/bootstrap.js', array('jquery') );
./functions.php:105:    wp_enqueue_script( '_tk-bootstrapwp', get_template_directory_uri() . '/includes/js/bootstrap-wp.js', array('jquery') );
./functions.php:107:    wp_enqueue_script( '_tk-skip-link-focus-fix', get_template_directory_uri() . '/includes/js/skip-link-focus-fix.js', array(), '20130115', true );
./functions.php:110:    //      wp_enqueue_script( 'comment-reply' );
./functions.php:114:            wp_enqueue_script( '_tk-keyboard-image-navigation', get_template_directory_uri() . '/includes/js/keyboard-image-navigation.js', array( 'jquery' ), '20120202' );
./functions.php:118:add_action( 'wp_enqueue_scripts', '_tk_scripts' );
./functions.php:297:        wp_enqueue_script('media-upload');
./functions.php:298:        wp_enqueue_script('thickbox');
./functions.php:300:        wp_enqueue_script('my-upload');
./functions.php:313:  wp_enqueue_script('thickbox');
./functions.php:315:  wp_enqueue_script('media-upload');
./functions.php:316:  wp_enqueue_script('ml-widget-js', get_template_directory_uri().'/widget/js/script.js', '', '1', true);
./functions.php:317:  wp_enqueue_script('my_script', get_template_directory_uri().'/admin/js/my_script.js');
./functions.php:318:  wp_enqueue_script('ml-fancybox-js', get_template_directory_uri().'/admin/js/fancybox/jquery.fancybox.pack.js', '', '1', true);
./functions.php:325:  //wp_enqueue_script('cf-media-field', get_template_directory_uri().'/admin/js/cf-media-field.js'); //画像アップロード用

TCD AMOREの子テーマを正しく有効化したい場合、子テーマでheader.phpを以下の様に追加してください。やっていることは、bloginfo(‘stylesheet_directory’); を  echo get_template_directory_uri(); に変えているだけです。

<?php
$options = get_desing_plus_option();

  // center the menu in the header
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<?php
     if($options['use_ogp']) {
?>
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#">
<?php } else { ?>
<head>
<?php }; ?>
  <meta charset="<?php bloginfo( 'charset' ); ?>">
  <meta name="viewport" content="width=device-width">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="format-detection" content="telephone=no">

  <title><?php wp_title('|', true, 'right'); ?></title>
  <meta name="description" content="<?php seo_description(); ?>">

  <?php if($options['use_ogp']) { ogp(); }; ?>

  <link rel="profile" href="http://gmpg.org/xfn/11">
  <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">

  <?php
    wp_deregister_script('jquery');
    wp_enqueue_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js');
  ?>
  <?php wp_head(); ?>
  <?php if(is_front_page()) : ?>
    <script src="https://maps.googleapis.com/maps/api/js<?php if($options['myapikey']){echo '?key='.$options['myapikey'];}; ?>"></script>
  <?php endif; ?>

  <link rel="stylesheet" media="screen and (max-width:771px)" href="<?php echo get_template_directory_uri(); ?>/footer-bar/footer-bar.css?ver=<?php echo version_num(); ?>">

  <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.elevatezoom.js"></script>
  <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/parallax.js"></script>
  <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jscript.js"></script>
  <?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?> 

  <script type="text/javascript">
    jQuery(function() {
      jQuery(".zoom").elevateZoom({
        zoomType : "inner",
        zoomWindowFadeIn: 500,
        zoomWindowFadeOut: 500,
        easing : true
      });
    });
  </script>

  <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/syncertel.js"></script>

  <link rel="stylesheet" media="screen and (max-width:991px)" href="<?php echo get_template_directory_uri(); ?>/responsive.css?ver=<?php echo version_num(); ?>">
  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/amore.css?ver=<?php echo version_num(); ?>" type="text/css" />
  <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/comment-style.css?ver=<?php echo version_num(); ?>" type="text/css" />
  <style type="text/css">
    <?php if($options['fix_header']): ?>
      .site-navigation{position:fixed;}
    <?php else: ?>
      .site-navigation{position:absolute;}
    <?php endif; ?>

  .fa, .wp-icon a:before {display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transform:translate(0, 0)}
  .fa-phone:before, .wp-icon.wp-fa-phone a:before {content:"\f095"; margin-right:5px;}

  body { font-size:<?php echo $options['content_font_size']; ?>px; }
  a {color: #<?php echo $options['pickedcolor1']; ?>;}
  a:hover, #bread_crumb li.home a:hover:before {color: #<?php echo $options['pickedcolor2']; ?>;}
  #global_menu ul ul li a{background:#<?php echo $options['pickedcolor1']; ?>;}
  #global_menu ul ul li a:hover{background:#<?php echo $options['pickedcolor2']; ?>;}
  #previous_next_post a:hover{
    background: #<?php echo $options['pickedcolor2']; ?>;
  }
  .social-icon:hover{
    background-color: #<?php echo $options['pickedcolor1']; ?> !important;
  }
  .up-arrow:hover{
    background-color: #<?php echo $options['pickedcolor1']; ?> !important;
  }

  .menu-item:hover *:not(.dropdown-menu *){
    color: #<?php echo $options['pickedcolor1']; ?> !important;
  }
  .menu-item a:hover {
    color: #<?php echo $options['pickedcolor1']; ?> !important;
  }
  .button a, .pager li > a, .pager li > span{
    background-color: #<?php echo $options['pickedcolor2']; ?>;
  }
  .dropdown-menu .menu-item > a:hover, .button a:hover, .pager li > a:hover{
    background-color: #<?php echo $options['pickedcolor1']; ?> !important;
  }
  .button-green a{
    background-color: #<?php echo $options['pickedcolor1']; ?>;
  }
  .button-green a:hover{
    background-color: #<?php echo $options['pickedcolor3']; ?>;
  }
  .timestamp{
    color: #<?php echo $options['pickedcolor1']; ?>;
  }
  .blog-list-timestamp{
    color: #<?php echo $options['pickedcolor1']; ?>;
  }
  .footer_main, .scrolltotop{
    background-color: #<?php echo $options['pickedcolor4']; ?>;
  }
  .scrolltotop_arrow a:hover{
    color: #<?php echo $options['pickedcolor1']; ?>;
  }

  .first-h1{
    color: #<?php echo $options['first_color']; ?>;
    text-shadow: <?php echo $options['first_dropshadow_h']; ?>px <?php echo $options['first_dropshadow_v']; ?>px <?php echo $options['first_dropshadow_b']; ?>px #<?php echo $options['first_dropshadow_c']; ?> !important;
  }
  .second-body, .second-body{
    color: #<?php echo $options['second_color']; ?>;
  }
  .top-headline.third_headline{
      color: #<?php echo $options['third_color']; ?>;
      text-shadow: <?php echo $options['third_dropshadow_h']; ?>px <?php echo $options['third_dropshadow_v']; ?>px <?php echo $options['third_dropshadow_b']; ?>px #<?php echo $options['third_dropshadow_c']; ?>;
  }
  .top-headline.fourth_headline{
      color: #<?php echo $options['fourth_color']; ?>;
      text-shadow: <?php echo $options['fourth_dropshadow_h']; ?>px <?php echo $options['fourth_dropshadow_v']; ?>px <?php echo $options['fourth_dropshadow_b']; ?>px #<?php echo $options['fourth_dropshadow_c']; ?>;
  }
  .top-headline.fifth_headline{
      color: #<?php echo $options['fifth_color']; ?>;
      text-shadow: <?php echo $options['fifth_dropshadow_h']; ?>px <?php echo $options['fifth_dropshadow_v']; ?>px <?php echo $options['fifth_dropshadow_b']; ?>px #<?php echo $options['fifth_dropshadow_c']; ?>;
  }

  .top-headline{
      color: #<?php echo $options['blog_color']; ?>;
      text-shadow: <?php echo $options['blog_dropshadow_h']; ?>px <?php echo $options['blog_dropshadow_v']; ?>px <?php echo $options['blog_dropshadow_b']; ?>px #<?php echo $options['blog_dropshadow_c']; ?>;
  }

  .thumb:hover:after{
      box-shadow: inset 0 0 0 7px #<?php echo $options['pickedcolor1']; ?>;
  }


  <?php if ($options['use_break_word']){ ?>
  p { word-wrap:break-word; }
  <?php }; ?>

  <?php echo $options['css_code']; ?>

  <?php if(get_post_meta($post->ID, "custom_css", true)){
    echo get_post_meta($post->ID, "custom_css", true);
  }; ?>

<?php if(is_mobile()):
  if($options['footer_bar_display'] == 'type1' || $options['footer_bar_display'] == 'type2'):
?>
.dp-footer-bar{
  background: <?php echo 'rgba('.implode(',', hex2rgb($options['footer_bar_bg'])).', '.esc_html($options['footer_bar_tp']).');'; ?>
  border-top: solid 1px #<?php echo esc_html($options['footer_bar_border']); ?>;
  color: #<?php echo esc_html($options['footer_bar_color']); ?>;
  display: flex;
  flex-wrap: wrap;
}
.dp-footer-bar a{
  color: #<?php echo esc_html($options['footer_bar_color']); ?>;
}
.dp-footer-bar-item + .dp-footer-bar-item{
  border-left: solid 1px #<?php echo esc_html($options['footer_bar_border']); ?>;
}

<?php endif; endif; ?>

</style>

</head>

<body <?php body_class(); ?>>
  <?php do_action( 'before' ); ?>

  <div id="verytop"></div>
  <nav id="header" class="site-navigation">
  <?php // substitute the class "container-fluid" below if you want a wider content area ?>
    <div class="container">
      <div class="row">
        <div class="site-navigation-inner col-xs-120 no-padding" style="padding:0px">
          <div class="navbar navbar-default">
            <div class="navbar-header">
              <div id="logo-area">
                <?php the_dp_logo(); ?>
                <?php if ($options['phonenumber'] && 2 == 3) : ?>
                  <a href="tel:<?php echo $options['phonenumber']; ?>">
                    <button id="telephone" type="button" class="navbar-toggle visible-xs text-left" style='padding-left:0; padding-right:0px; z-index:3000; color:white; position:absolute; top:0px; width:160px'>
                      <span><?php echo $options['phonenumber']; ?></span>
                    </button>
                  </a>
                <?php endif; ?>
              </div>

            </div>

            <!-- The WordPress Menu goes here -->
            <div class="pull-right right-menu">
              <?php //if(!wp_is_mobile()): ?>
                <?php if(!$options['tel_header']): ?>
                <?php wp_nav_menu(
                  array(
                    'theme_location'    => 'primary',
                    'depth'             => 2,
                    'container'         => 'div',
                    'container_class'   => 'collapse navbar-collapse',
                    'menu_class'        => 'nav navbar-nav',
                    'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                    'menu_id'           => 'main-menu',
                    'walker'            => new wp_bootstrap_navwalker()
                  )
                ); ?>
                <?php else: ?>
                <div id="header-phonenumber" class="hidden-sm hidden-xs"><?php echo $options['phonenumber']; ?></div>
                <?php endif; ?>
              <?php //else: ?>
                 <?php if (has_nav_menu('primary')) { ?>
                 <a href="#" class="menu_button"></a>
                 <div id="global_menu" class="clearfix">
                  <?php wp_nav_menu( array( 'sort_column' => 'menu_order', 'theme_location' => 'primary' , 'container' => '' ) ); ?>
                 </div>
                 <?php }; ?>
              <?php //endif; ?>
            </div>

          </div><!-- .navbar -->
        </div>
      </div>
    </div><!-- .container -->
  </nav><!-- .site-navigation -->

<div class="main-content">
<?php // substitute the class "container-fluid" below if you want a wider content area ?>
  <?php if(is_single()): ?>
  <div class="amore-divider romaji" data-parallax="scroll" data-image-src="<?php echo $options['bg_image6']; ?>">
    <div class="container">
      <div class="row">
        <div class="col-xs-120">
          <div class="top-headline" style="<?php if(!is_mobile()){ echo 'margin-top: 50px; margin-bottom: -20px;'; }else{ echo 'height:195px; line-height:195px;'; }; ?>"><?php echo $options['blog_headline']; ?></div>
        </div>
      </div>
    </div>
  </div>
  <?php endif; ?>

子テーマのfunctions.phpのまっさら状態は以下の通り

<?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') );
}

子テーマのstyle.css のまっさら状態は以下の通り。

/*
Theme Name:AMORE CHILD
Template:amore_tcd028
Version:1.0.0
*/

以上でAMOREの子テーマ作成完了です。

子テーマディレクトリでstyle.css と functions.php の作成だけではなく、header.phpも 非推奨パラメータを使っている bloginfo(‘stylesheet_directory’); を推奨に置き換えて作ることで完了します。

WordPress/kusanagi/Azure/AWS/kintoneの開発運用相談