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

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

「関数リファレンス/wp register style」の版間の差分

提供: WordPress Codex 日本語版
移動先: 案内検索
(外部リソース)
(一部訳)
1行目: 1行目:
{{NeedTrans}}
+
{{NeedTrans|一部}}
  
 
== 説明 ==
 
== 説明 ==
11行目: 11行目:
 
== パラメータ ==
 
== パラメータ ==
  
{{Parameter|$handle|string|Name used as a handle for the stylesheet. 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.}}
+
{{Parameter|$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.}}
  
{{Parameter|$src|string|boolean|URL to the stylesheet. Example: '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 [[Function Reference/plugins_url|plugins_url]] (for Plugins) and [[Function Reference/get_template_directory_uri|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'.|optional|false}}
+
{{Parameter|$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 [[Function Reference/plugins_url|plugins_url]] (for Plugins) and [[関数リファレンス/get_template_directory_uri|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}}
  
{{Parameter|$deps|array|Array of handles of any stylesheet that this stylesheet depends on; stylesheets that must be loaded before this stylesheet. false if there are no dependencies.|optional|array()}}
+
{{Parameter|$deps|array|Array of handles of any stylesheet that this stylesheet depends on; stylesheets that must be loaded before this stylesheet. false if there are no dependencies.|オプション|array()}}
  
{{Parameter|$ver|string|boolean|String specifying the stylesheet version number, if it has one. 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.|optional|false}}
+
{{Parameter|$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}}
  
{{Parameter|$media|string&#124;boolean|String specifying the media for which this stylesheet has been defined. Examples: '<tt>all</tt>', '<tt>screen</tt>', '<tt>handheld</tt>', '<tt>print</tt>'. See this [http://www.w3.org/TR/CSS2/media.html#media-types list] for the full range of valid CSS-media-types.|optional|'all'}}
+
{{Parameter|$media|文字列&#124;真偽型|String specifying the media for which this stylesheet has been defined. Examples: '<tt>all</tt>', '<tt>screen</tt>', '<tt>handheld</tt>', '<tt>print</tt>'. See this [http://www.w3.org/TR/CSS2/media.html#media-types list] for the full range of valid CSS-media-types.|オプション|'all'}}
  
 
== 戻り値 ==
 
== 戻り値 ==
106行目: 106行目:
  
 
== 注 ==
 
== 注 ==
 +
* Uses global: (<tt>[[Class_Reference/WP_Styles |WP_Styles]]</tt>) <tt>$wp_styles</tt> - See <tt>WP_Styles::add()</tt>, <tt>WP_Styles::enqueue()</tt>.
 +
* Tip: <tt>print_r( $wp_styles );</tt>
 +
* If you are going to use some [[関数リファレンス/wp_enqueue_script#Default_Scripts_Included_and_Registered_by_WordPress |jQuery UI features]] 独自のCSSファイルを提供する必要がある場合があります: WordPressのコアが完全なjQueryUIのテーマを持っていません!
  
* 合わせて読む:<tt>WP_Styles::add()</tt>, <tt>WP_Styles::enqueue()</tt>
 
* Uses global: (<tt>unknown type</tt>) <tt>$wp_styles</tt>
 
* Tip: print_r( $wp_styles );
 
* As of WordPress 3.3 <tt>wp_enqueue_style()</tt> can be called mid-page (in the HTML body). This will load styles in the footer.
 
  
 
== 更新履歴 ==
 
== 更新履歴 ==
  
* 導入: [[Version 2.1|2.1]] (BackPress version: r79)
+
* [[Version 2.1|2.1]]:新規導入 (BackPress バージョン: r79)
 +
* [[Version 3.3|3.3]]: <tt>wp_enqueue_style()</tt> は(HTMLのbodyの内側にある)mid-pageを呼び出すことができます。これはフッターのスタイルをロードします。
 +
 
  
 
== ソースファイル ==
 
== ソースファイル ==
  
<tt>wp_enqueue_style()</tt> is located in {{Trac|wp-includes/functions.wp-styles.php}}.
+
<tt>wp_enqueue_style()</tt> {{Trac|wp-includes/functions.wp-styles.php}}にあります。
  
 
== 外部リソース ==
 
== 外部リソース ==

2015年6月30日 (火) 14:40時点における版

このページ「関数リファレンス/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) (オプション) Array of handles of any stylesheet that this stylesheet depends on; stylesheets that must be loaded before this stylesheet. false if there are no dependencies.
初期値: 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
文字列|真偽型) (オプション) String specifying the media for which this stylesheet has been defined. Examples: 'all', 'screen', 'handheld', 'print'. See this 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最新版との差分