• 赤色のリンクは、まだ日本語Codexに存在しないページ・画像です。英語版と併せてご覧ください。(詳細

このWikiはいつでも誰でも編集できます

関数リファレンス/wp register style

提供: WordPress Codex 日本語版
移動先: 案内検索

このページ「関数リファレンス/wp register style」は一部未翻訳です。和訳や日本語情報を加筆してくださる協力者を求めています

説明

WordPress の生成するページへ CSS スタイルを安全に追加もしくはキューに加えます。wp_register_style() で先に登録されていればこのハンドルで追加できます。

使い方

wp_enqueue_style( $handle, $src, $deps, $ver, $media );

パラメータ

$handle
文字列) (必須) スタイルシートのハンドルとして使用される名前。 As a special case, if the string contains a '?' character, the preceding part of the string refers to the registered handle, and the succeeding part is appended to the URL as a query string.
初期値: なし
$src
文字列|真偽型) (オプション) スタイルシートのURL。 例: 'http://example.com/css/mystyle.css'. This parameter is only required when WordPress does not already know about this style. You should never hardcode URLs to local styles, use plugins_url (for Plugins) and get_template_directory_uri (for Themes) to get a proper URL. Remote assets can be specified with a protocol-agnostic URL, i.e. '//otherdomain.com/css/theirstyle.css'.
初期値: false
$deps
array) (オプション) このスタイルシートが依存するスタイルシートのハンドルの配列。; このスタイルシートの前にロードされる必要があるスタイルシート。依存関係が存在しない場合はfalse。
初期値: array()
$ver
文字列|真偽型) (オプション) 付いている場合、スタイルシートのバージョン番号を指定する文字列。 This parameter is used to ensure that the correct version is sent to the client regardless of caching, and so should be included if a version number is available and makes sense for the stylesheet.
初期値: false
$media
文字列|真偽型) (オプション) このスタイルシートが定義されているメディアを指定する文字列。 例: 'all', 'screen', 'handheld', 'print'。

参照:list for the full range of valid CSS-media-types.

初期値: 'all'

戻り値

(void) 
この関数は値を返しません。

用例

フックの使用

<?php
    /**
     * Register with hook 'wp_enqueue_scripts', which can be used for front end CSS and JavaScript
     */
    add_action( 'wp_enqueue_scripts', 'prefix_add_my_stylesheet' );

    /**
     * Enqueue plugin style-file
     */
    function prefix_add_my_stylesheet() {
        // Respects SSL, Style.css is relative to the current file
        wp_register_style( 'prefix-style', plugins_url('style.css', __FILE__) );
        wp_enqueue_style( 'prefix-style' );
    }
?>

プラグインのオプションページでのみCSSを読み込む

   /*
    * This example will work at least on WordPress 2.6.3, 
    * but maybe on older versions too.
    */
   add_action( 'admin_init', 'my_plugin_admin_init' );
   add_action( 'admin_menu', 'my_plugin_admin_menu' );
   
   function my_plugin_admin_init() {
       /* Register our stylesheet. */
       wp_register_style( 'myPluginStylesheet', plugins_url('stylesheet.css', __FILE__) );
   }
   
   function my_plugin_admin_menu() {
       /* Register our plugin page */
       $page = add_submenu_page( 'edit.php', 
                                 __( 'My Plugin', 'myPlugin' ), 
                                 __( 'My Plugin', 'myPlugin' ),
                                 'administrator',
                                 __FILE__, 
                                 'my_plugin_manage_menu' );
  
       /* Using registered $page handle to hook stylesheet loading */
       add_action( 'admin_print_styles-' . $page, 'my_plugin_admin_styles' );
   }
   
   function my_plugin_admin_styles() {
       /*
        * It will be called only on your plugin admin page, enqueue our stylesheet here
        */
       wp_enqueue_style( 'myPluginStylesheet' );
   }
   
   function my_plugin_manage_menu() {
       /* Output our admin page */
   }

WordPress テーマでCSSを読み込む

function theme_styles()  
{ 
  // Register the style like this for a theme:  
  // (First the unique name for the style (custom-style) then the src, 
  // then dependencies and ver no. and media type)
  wp_register_style( 'custom-style', 
    get_template_directory_uri() . '/css/custom-style.css', 
    array(), 
    '20120208', 
    'all' );

  // enqueing:
  wp_enqueue_style( 'custom-style' );
}
add_action('wp_enqueue_scripts', 'theme_styles');

  • Uses global: (WP_Styles) $wp_styles - See WP_Styles::add(), WP_Styles::enqueue().
  • Tip: print_r( $wp_styles );
  • If you are going to use some jQuery UI features 独自のCSSファイルを提供する必要がある場合があります: WordPressのコアが完全なjQueryUIのテーマを持っていません!


更新履歴

  • 2.1:新規導入 (BackPress バージョン: r79)
  • 3.3: wp_enqueue_style() は(HTMLのbodyの内側にある)mid-pageを呼び出すことができます。これはフッターのスタイルをロードします。


ソースファイル

wp_enqueue_style()wp-includes/functions.wp-styles.phpにあります。

外部リソース

関連




関数リファレンステンプレートタグ目次もご覧ください。


最新英語版: WordPress Codex » Function Reference/wp_enqueue_style最新版との差分