Bagaimana cara enqueue style menggunakan wp_enqueue_style ()

Saya sedang mengembangkan tema. Saya menambahkan kode (di bawah) ke dalam header.php. Tapi saya mempostingnya ke repositori tema WP, dan itu sedang ditinjau, dan pengulas memberitahu saya untuk enqueue style dengan wp_enqueue_style()/ wp_enqueue_script(). Tetapi tidak bisa mengerti bagaimana cara mengimplementasikannya dengan fungsinya. Saya telah melihat arahan wp_enqueue_style();dalam Codex, tetapi tidak dapat memahami bagaimana menempatkan sejumlah kode dengan kondisi mereka.

<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>

BAGAIMANA CARA?

wp-enqueue-style

— Mayeenul Islam
sumber

Jawaban:

Inilah yang dapat Anda lakukan:

1 - Masukkan CSS dalam file terpisah dan simpan di direktori tema Anda.
2 - Tambahkan kode berikut di 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' );

— Mike Madern
sumber

Mengapa tidak memasukkan persyaratan dalam wp_enqueue_scriptscallback? Tidak ada yang perlu masuk dalam kepala dokumen.

— Chip Bennett

Saya tidak memikirkan itu, suntingan sedang dalam perjalanan

— Mike Madern

+1. Saya mengedit untuk mengganti get_bloginfo( 'stylesheet_directory' )dengan get_template_directory_uri(). Referensi ke direktori stylesheet harus disediakan untuk Tema Anak.

— Chip Bennett

Bagus & Baik. Itu menyelesaikan saya di sini. Terima kasih Mike. Saya akan menambahkan utas ini ke Codex , insya Allah. Terima kasih.

— Mayeenul Islam

Menambahkan style.cssfile kedua untuk arsip halaman kategori.

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

— Brad Dalton
sumber