タグ付けされた質問 「wp-enqueue-style」

ワードプレスで生成されたページにCSSスタイルファイルを追加/エンキューする安全な方法。最初にwp_register_style（）で登録されていた場合は、そのハンドルを使用して追加できます。

2
jquery-ui-datepickerの組み込みスタイル
WordPressに同梱されているデートピッカーをウェブサイトのフロントエンドで利用したい。キューに入れましたjquery-ui-datepickerが、日付ピッカーのスタイルが設定されていません（コンソールにjsエラーはありません）。それに対応するものはありwp_enqueue_styleますか？ 私はこのコードを使用しました functions.php function rr_scripts() { wp_enqueue_script( 'jquery' ); wp_enqueue_script( 'jquery-ui-datepicker', array( 'jquery' ) ); wp_register_style( 'bootstrap_css', get_template_directory_uri() . '/assets/css/bootstrap.min.css' ); wp_enqueue_style( 'bootstrap_css' ); # I'm using Twitter Bootstrap as CSS(if it matters) } add_action( 'wp_enqueue_scripts', 'rr_scripts' );
3
特定のページのみのスタイルシートを条件付きでエンキューするにはどうすればよいですか？
始める前に、ページ/投稿のコンテンツに基づいてスクリプトを条件付きでエンキューする方法を対象とする本当に良い記事があることを認めたいと思います。 WordPressプラグイン開発-投稿で必要な場合にのみ、条件付きでCSSとJavaScriptを含める方法 WordPressマスターのようにJavaScriptをロードする方法 これらは素晴らしいですが、私がやりたいことよりもはるかに進んでいます。 答えは組み込みis_page()関数（codex）を使用しているように感じますが、それを使用しようとすると、サイトが壊れるか、機能しません。 条件付きロジックを間違った場所で実行しているだけだと思います。 これが、functions.phpに追加しようとしたものです。 function wpse39130_register_more_stylesheets() { wp_register_style( 'stylesheet_name', get_stylesheet_directory_uri() . '/stylesheet.css' ); } add_action( 'init', 'wpse39130_register_more_stylesheets' ); function wpse39130_conditionally_enqueue_my_stylesheet() { // only enqueue on product-services page slug if ( is_page( 'products-services' ) ) { wp_enqueue_style( 'stylesheet_name' ); } } add_action( 'wp_enqueue_scripts', 'wpse39130_conditionally_enqueue_my_stylesheet' ); 条件付きの部分を削除すると、スタイルシートが正常にキューに登録されるので、それが機能することがわかります。
1
ログインページのスタイルシートをエンキューし、head要素に表示する
ログインページのスタイルをテーマに設定します。非常に簡単： add_action( 'login_enqueue_scripts', function() { wp_enqueue_style( 'TEST', get_template_directory_uri() . '/css/login.css' ); }); 残念ながら、期待どおりに動作しません。link要素がに表示されてbody非常に遅く、ログインページの。 レンダリングされた出力： <link rel='stylesheet' id='TEST-css' href='http://themes.wp/t5-theme-base/css/login.css?ver=3.9-alpha' type='text/css' media='all' /> <div class="clear"></div> </body> </html> これは間違っていheadます。リンク要素をどのように印刷できますか？
2
なぜstyle.cssがエンキューされないのですか？
かなり基本的なテーマを取得しましたが、style.cssファイルがに読み込まれていません<head>。私はすでに周りを検索しましたが、なぜそれが読み込まれないのかわかりません。 私はglobal $wp_stylesすでにオブジェクトを検査しましたが、何も見つかりませんでした： function style_test() { $wp_styles = new WP_Styles(); echo '<pre>'; // $wp_styles->enqueue == completely empty print_r( $wp_styles->registered ); echo '</pre>'; } add_action( 'wp_print_scripts', 'style_test', 0 ); オブジェクト内では、登録済み/エンキューされたスタイルシート（それらが読み込まれる）も見つけることができないので、これを検査する際に何か問題があると思います。何か案は？ 注： 手動でキューに入れると、style.cssファイルが読み込まれます。自動ロードだけでは機能しません。さらに私はget_theme_data( TEMPLATEPATH.'/style.css' );問題なくファイルにアクセスできます。
1
Codexメソッドの変更により、親と子のテーマスタイルシートのエンキューに関する問題
この投稿は、このスレッドとこのスレッドで持ち込まれたスタイルシートのエンキューメソッドに関する最近の変更に関して私が遭遇したいくつかの質問を持ち出します。 私が遭遇した問題は、WP 4.0のインストールで特に子テーマに対応している、広く使用され維持されている親テーマを使用して、一般的なユースケースシナリオで発生しました。私の子テーマのfunctions.phpには、Codexに詳述されている関数のみが含まれていwp_enqueue_styleます。 以下で参照するコードはこのテーマに固有のものですが、その多くは親テーマで使用されている現在のコーディング規則を使用しています。さらに、私の関心領域は、現在広く普及している多数の確立された親テーマで重複している可能性が高いです。また、これらの提起された質問は、どの親テーマが使用されているかに関係なく、普遍的なレベルで適用できます。 問題1：Twoqueueing 推奨セットアップ： 親テーマは、wp_enqueue_scriptsフックを使用してスタイルとスクリプトをキューに入れることです。関連する部分は次のとおりです。 add_action('wp_enqueue_scripts', 'parent_theme_function_name'); function parent_theme_function_name() { wp_register_style( 'avia-style' , $child_theme_url."/style.css", array(), '2', 'all' ); wp_enqueue_style( 'avia-base'); if($child_theme_url != $template_url) { wp_enqueue_style( 'avia-style'); } } 私の子テーマfunctions.phpは、最近のコーデックスの変更ごとにスタイルをエンキューします。 add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' ); function enqueue_parent_theme_style() { wp_enqueue_style( 'dm-parent-style', get_template_directory_uri().'/style.css' ); } 参照コードで使用されている次のIDに注意してください。 id='dm-parent-style-css' 子テーマ関数によってエンキューされた親テーマのスタイルシートです id='avia-style-css' 親テーマ関数によってエンキューされた、私の子テーマのスタイルシートです id='dm-child-style-css' 私の子テーマの関数によってエンキューされた、私の子テーマのスタイルシートです …
1
style.cssの前にスタイルをエンキューする方法
style.cssがロードされる前に.cssファイルをエンキューするにはどうすればよいですか？または、デフォルトのstyle.cssを別の.cssファイルに依存させますか？ 私は.cssリセットをロードしようとしています。これは、style.cssによって上書きされます。 ここに私が持っているものがあります： add_action('wp_enqueue_scripts', 'load_css_files'); function load_css_files() { wp_register_style( 'normalize', get_template_directory_uri() . '/css/normalize.css'); wp_enqueue_style( 'normalize' ); } ただし、これはstyle.cssの後にロードされます。
2
wp_enqueue_style（）を使用してスタイルをエンキューする方法
テーマを開発しています。以下にコードをに追加しました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 } …
4
URLの記号を変更せずにGoogle Webフォントをエンキュー
通常の方法でGoogle Web Fontsをエンキューする、つまり、次のwp_enqueue_styleような関数を使用する... function wpse_google_webfonts() { wp_enqueue_style( 'google-webfonts', 'http://fonts.googleapis.com/css?family=Ubuntu+Condensed|Open+Sans:400italic,700italic,400,700' ); } add_action( 'wp_enqueue_scripts', 'wpse_google_webfonts' ); ...次のlinkようにヘッダーに配置されたタグになります： <link rel='stylesheet' id='google-webfonts-css' href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed%7COpen+Sans%3A400italic%2C700italic%2C400%2C700&ver=3.5' type='text/css' media='all' /> ご覧のとおり、結果のURLはエンコードされています。 私はそれが問題を引き起こさないと確信していますが、物事を明確かつ明確に保つために、私は先に進んで質問したいと思いfunctions.phpます-URLが出力する方法で（プラグインではなく）Google Web Fontsをエンキューする方法はありますかエンコードされていませんか？ それはそうです： <link rel='stylesheet' id='google-webfonts-css' href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed|Open+Sans:400italic,700italic,400,700?ver=3.5' type='text/css' media='all' /> バウンティの理由 @webawareの答えはほぼ完璧です。これは、Twenty Twelveテーマの「Open Sans」Google Web Fontをエンキューするのに使用されている方法に似ているためです。 出力の唯一の問題は、次のようになることです。 <link rel='stylesheet' id='twentytwelve-fonts-css' href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed|Open+Sans:400italic,700italic,400,700&subset=latin,latin-ext' type='text/css' media='all' /> に注意して&ください？それ&以外の場合は、提供されるフォントファイルにはlatinグリフのみが含まれます（つまりsubset、URL …
3
ページ固有のスクリプト/スタイルをロードする方法
私はデフォルトのWordpressの起動プロセスに従って、最初functions.phpに呼び出され、その後すべてのテーマのものに行くことを知っています。しかし、私は現在、テーマを完全にリファクタリングして最適化しています。私のアイデアは、共通のプロパティ、正規化、色用の1つの基本cssファイルを用意することです。または、単一のCSSファイルを保持するために、この場合、functions.phpページを決定するためにスイッチケースをハードコーディングする必要があります。また、すべてのスタイルが定義された巨大なcssスタイルファイルをロードすることは意味がないため、各ページに固有の別のファイル。 だから私の質問は、特定のスクリプト/スタイルをロードするためにフックするのに最適な場所は何ですか？ それはheader-xxx.php別のファイルですか？多分このアイデアをよりスケーラブルでエレガントな方法で実装する方法はありますか？ どんな助けにも感謝します。
4
rel属性を変更するためのadd_filterを使用したLESS CSS enqueue_style
私がやろうとしていることは、WordPressで使用するcssを少なくすることです。 rel属性が 'stylesheet / less'に設定された.lessファイルにリンクすることになっています。しかし、enqueue_styleの出力を行うコードを変更する方法がわかりません。 フィルターを適用して出力に影響を与える方法はありますか？ 編集：私がこれをどのように機能させるかについて興味がある人は、ここにコードスニペットがあります： function enqueue_less_styles($tag, $handle) { global $wp_styles; $match_pattern = '/\.less$/U'; if ( preg_match( $match_pattern, $wp_styles->registered[$handle]->src ) ) { $handle = $wp_styles->registered[$handle]->handle; $media = $wp_styles->registered[$handle]->args; $href = $wp_styles->registered[$handle]->src . '?ver=' . $wp_styles->registered[$handle]->ver; $rel = isset($wp_styles->registered[$handle]->extra['alt']) && $wp_styles->registered[$handle]->extra['alt'] ? 'alternate stylesheet' : 'stylesheet'; $title = isset($wp_styles->registered[$handle]->extra['title']) …
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.