wp_enqueue_style()を使用してスタイルをエンキューする方法


9

テーマを開発しています。以下にコードをに追加しましたheader.php。しかし、私はそれをWPテーマリポジトリに投稿し、現在レビュー中です。レビュー担当者は、スタイルをwp_enqueue_style()/でエンキューするように私に通知しましたwp_enqueue_script()。しかし、関数でそれを実装する方法を理解できません。wp_enqueue_style();Codexで指示されたのを見たことがありますが、コードの束全体をその条件と一緒に配置する方法を理解できません。

<style type="text/css">
<?php
// If the menu presents, then CSS loads

if ( has_nav_menu( 'secondary' ) ) {
?>
.sec-menu{
width: 100%;
background: #333;
height: 26px;
font-size:16px;
text-transform:uppercase;
}
<?php } ?>
<?php
if ( has_nav_menu( 'primary' ) ) {
?>
#access{
background-color: #333;
height: 26px;
}
<?php } ?>
<?php
if ( !has_nav_menu( 'primary' ) && !has_nav_menu( 'secondary' ) ) {
?>
.sec-menu,
#access{
border-bottom: 2px solid #333;
}
<?php } ?>
</style>
  • 方法?

回答:


16

これはあなたができることです:

1-CSSを別のファイルに入れて、テーマディレクトリに保存します。
2-次のコードをに追加しますfunctions php

function wpse_89494_enqueue_scripts() {
  if ( has_nav_menu( 'secondary' ) ) {
    wp_enqueue_style( 
      'wpse_89494_style_1', 
      get_template_directory_uri() . '/your-style_1.css' 
    );
  }
  if ( has_nav_menu( 'primary' ) ) {
    wp_enqueue_style( 
      'wpse_89494_style_2', 
      get_template_directory_uri() . '/your-style_2.css' 
    );
  }
  if ( ! has_nav_menu( 'primary' ) && ! has_nav_menu( 'secondary' ) ) {
    wp_enqueue_style( 
      'wpse_89494_style_3', 
      get_template_directory_uri() . '/your-style_3.css' 
    );
  }
}

add_action( 'wp_enqueue_scripts', 'wpse_89494_enqueue_scripts' );

1
条件wp_enqueue_scripts文をコールバックの中に入れてみませんか?文書の先頭に入れる必要はありません。
チップベネット

1
私はそのことを考えていませんでした、編集が進行中です
マイクマダーン

+1。編集してに置き換えget_bloginfo( 'stylesheet_directory' )ましたget_template_directory_uri()スタイルシートディレクトリへの参照は、子テーマ用に予約する必要があります。
チップベネット

いいね。ここで私を解決しました。マイクありがとう。このスレッドをCodexに追加します。ありがとう。
Mayeenul Islam 2013

1

style.cssカテゴリページのアーカイブ用に2番目のファイルを追加します。

add_action( 'wp_enqueue_scripts', 'wpsites_second_style_sheet' );
function wpsites_second_style_sheet() {
    if ( is_category() ) {
       wp_register_style( 'second-style', get_template_directory_uri() .'css/second-style.css', array(), '20130608');
       wp_enqueue_style( 'second-style' );    
    }    
}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.