snow_monkey_prepend_main

My Snow MonkeyからCSSファイルを追加してスタイリングする方法

  • ブックマーク
  • -
    コピー
snow_monkey_before_entry_content
snow_monkey_prepend_entry_content

Snow Monkeyのカスタマイズの基本は、CSSによるスタイリングではないでしょうか?

こちらでは、My Snow Monkeyに用意をしたstyle.cssをSnow Monkeyに反映させる方法をご紹介します。

ソースコード

とはいっても、このソースコードをMy Snow Monkey内のmy-snow-monkey.phpに追加するだけです。

<?php
/**
 * import CSS file
 */
add_action(
	'wp_enqueue_scripts',
	function() {
		wp_enqueue_style(
		 'my-snow-monkey',
		 MY_SNOW_MONKEY_URL . '/style.css',
		 [ Framework\Helper::get_main_style_handle() ],
		 filemtime( MY_SNOW_MONKEY_PATH . '/style.css' )
		);
	}
);

ソースコード内のhsm-stylesという部分ですが、これはハンドルネームになるので、お好きな名前に変更してもらう方が良いでしょう。(hsm = happy snow monkey です)

これでstyle.cssが反映されていると思いますので、

body {
  background-color: red;
}

こんな感じの見た目でわかりやすいコードを書いてみて、実際に読み込まれているか、反映されているか試してみると良いでしょう。

Snow Monkeyで困ったら…?

こんな時にご活用ください。
  • Snow Monkeyの使い方をレクチャーしてほしい
  • Snow Monkeyのカスタマイズの基本をレクチャーしてほしい
  • Snow Monkeyを採用した案件で行き詰まったので解決してほしい
  • Snow Monkeyを採用した制作案件を依頼したい

運営へのご連絡はこちらから

HAPPY SNOW MONKEY を
さまざまな形でサポート頂けます。

snow_monkey_append_entry_content
snow_monkey_after_entry_content

HAPPY SNOW MONKEYの管理人情報

久野 晃司

Web制作系フリーランス。WordPressに関するお仕事や活動が多いです。

WordPressコア貢献者/テーマ開発者/プラグイン開発者/Meetupオーガナイザー/翻訳貢献者

snow_monkey_append_main