[hampenoden]

【お使いの Snow Monkey のバージョン】25.1.0
【お使いの Snow Monkey Blocks のバージョン】20.1.3
【お使いの Snow Monkey Editor のバージョン】0.6.3
【お使いの PHP のバージョン】7.4.33
【お使いのブラウザ】Chrome
【当該サイトのURL】

### 発生している問題

my snow monkeyプラグインをインストール(Snow Monkeyマイアカウントでダウンロードしたzip形式のものをWord Pressのプラグイン→新規追加でインストールし有効化)、zipファイルを解凍し、VSCodeにてsass自動コンパイル化後、確認の為、body {background-color: yellow;}と入れてみましたが、反映されません。

Chromeを検証したところ、SourcesのPluginの中にmy-snow-monkeyは反映されていませんでした。これが原因かと考えています。

 

### 試したこと

・WordPress snow monkeyプラグインの再インストール

・https://snow-monkey.2inc.org/forums/topic/my-snow-monkey%E3%81%A7css%E3%81%8C%E8%AA%AD%E3%81%BF%E8%BE%BC%E3%82%81%E3%81%AA%E3%81%84/　の記載事項を全て試し、コンソールにCSSファイルの404が出ていないこと、WP_DEBUG を true にして確認しPHP的なエラーが出ていないことを確認

・チュートリアル制作者に確認し、CSSの記述が誤っていないことを確認

・キャッシュの削除

 

個人的に気がかりなこと

サーバードメインを取得するときに、xサーバーでsnow monkeyもまとめて契約。
私と同じ契約方法をとった方に話を聞いたところ、SCSSが反映されない同様の事象が発生している

 

他なす術がなく、問い合わせをいたしました。解決方法をご教授いただけると幸いです。よろしくお願いいたします。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

契約方法で変わることはないので、そこは心配しなくて大丈夫です！

おそらく記述しているコードに何か誤りがあるのではないかなと想像します。my-snow—monkey.php に記述しているコードを丸ごとここに貼り付けてもらうことはできますか？

♥ 0

いいねをした人: 居ません

[hampenoden]

ご回答ありがとうございます。

<?php
/**
 * Plugin name: My Snow Monkey
 * Description: このプラグインに、あなたの Snow Monkey 用カスタマイズコードを書いてください。
 * Version: 0.2.3
 *
 * @package my-snow-monkey
 * @author inc2734
 * @license GPL-2.0+
 */

// Snow Monkey 以外のテーマを利用している場合は有効化してもカスタマイズが反映されないようにする
$theme = wp_get_theme( get_template() );
if ( 'snow-monkey' !== $theme->template && 'snow-monkey/resources' !== $theme->template ) {
	return;
}

/**
 * Directory url of this plugin
 *
 * @var string
 */
define( 'MY_SNOW_MONKEY_URL', untrailingslashit( plugin_dir_url( FILE ) ) );

/**
 * Directory path of this plugin
 *
 * @var string
 */
define( 'MY_SNOW_MONKEY_PATH', untrailingslashit( plugin_dir_path( FILE ) ) );

//CSSの読み込み
add_action(
	'wp_enqueue_scripts',
	function() {
		wp_enqueue_style(
			'my-sm-style',
			MY_SNOW_MONKEY_URL . '/css/style.css',
			[ Framework\Helper::get_main_style_handle() ],
			filemtime( plugin_dir_path( FILE ) )
		);
	}
);

//編集中もCSSを反映させる
add_action(
	'after_setup_theme',
	function(){
		add_editor_style(MY_SNOW_MONKEY_URL . '/css/style.css');
	}
);

です。よろしくお願いいたします。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

コードありがとうございます！ 途中のコメントアウト部分がうまくコメントアウトされずにエラーがでる状態になっていたので修正しました。

		wp_enqueue_style(
			'my-sm-style',
			MY_SNOW_MONKEY_URL . '/css/style.css',
			[ Framework\Helper::get_main_style_handle() ],
			filemtime( plugin_dir_path( FILE ) )
		);

の第4引数、filemtime( plugin_dir_path( FILE ) ) の部分は間違いではありませんが、filemtime( MY_SNOW_MONKEY_PATH . '/css/style.css' ) のほうがベターだと思います。前者だと My Snow Monkey ディレクトリが更新されないと CSS のキャッシュが残ったままになりますが、後者であれば CSS ファイルが更新されたら CSS キャッシュが消えるので。

コード的には特に読み込まれないような大きな間違いは無さそうに見えます。気になる点としては、

– My Snow Monkey プラグインが有効化されているか
– plugins/my-snow-monkey/css/style.css が実際に存在するか
– 適当なページを開いて「ページのソースを表示」したとき、HTML 中に plugins/my-snow-monkey/css/style.css を読み込んでいる <link href="..."> が存在するか

となります。以上の点どうでしょうか？

♥ 0

いいねをした人: 居ません

[hampenoden]

修正いただき、ありがとうございます。

– My Snow Monkey プラグインが有効化されているか→Word Pressのプラグインのページを確認したところ、有効化されていました

– plugins/my-snow-monkey/css/style.css が実際に存在するか→Cyber duckで確認したところ、ファイルが見当たりませんでした。（この確認方法でよろしいでしょうか）

– 適当なページを開いて「ページのソースを表示」したとき、HTML 中に plugins/my-snow-monkey/css/style.css を読み込んでいる <link href=”…”> が存在するか

→plugins/my-snow-monkey/css/style.cssが実際に存在しないため、<link href=”…”>も存在せず。

 

これを解決するために、plugins/my-snow-monkey/css/style.css　をCyber duckで新たにファイルとして作成すれば良いのでしょうか？

 

初歩的な質問で申し訳ございません、ご回答いただけると幸いです。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

– plugins/my-snow-monkey/css/style.css が実際に存在するか→Cyber duckで確認したところ、ファイルが見当たりませんでした。（この確認方法でよろしいでしょうか）

環境はサーバー上でしょうか？ それともローカル環境でしょうか？ ローカル環境であれば Cyberduck を使わずにパソコン上の作業ディレクトリを開けば存在が確認できます。サーバー上であれば、Cyberduck 等のツールを使い、作業ディレクトリにある style.css をサーバー上にアップロードする必要があります。

– 適当なページを開いて「ページのソースを表示」したとき、HTML 中に plugins/my-snow-monkey/css/style.css を読み込んでいる が存在するか
→plugins/my-snow-monkey/css/style.cssが実際に存在しないため、も存在せず。

wp_enqueue_style() が CSS ファイルを読み込むための関数（具体的には <link href="..."> を出力する関数）になりますが、wp_enqueue_style()　はファイルの有無で挙動を変えないので、正しく My Snow Monkey が実行されていれば、style.css が存在しなくても <link href="..."> は出力されます。

ちょっとどのような環境でどのような作業＆確認をされたのかがわからないのですが、もしパソコン上でコードを書いて style.css を自動生成し、サーバー上にある WordPress 環境にそれを反映させたいのであれば style.css をアップロードしないといけないので、その辺をあらためて確認されるのが良いかも？です。

♥ 0

いいねをした人: 居ません

[hampenoden]

ご回答ありがとうございます。よく理解できました。

 

環境はサーバー上です。Cyber duckで確認したところ、plugins/my-snow-monkey/style.css　となっていたため、フォルダを追加し、plugins/my-snow-monkey/css/style.cssとなるようにしました。

VSCodeで書き換えた後はCyber duckにファイルをアップロードしているのですが、アップロードした瞬間Word Pressで有効化したはずのmy-snow-monkeyのプラグインが消えてしまいます。

これはどうすることでで解決ができるのでしょうか。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

VSCodeで書き換えた後はCyber duckにファイルをアップロードしているのですが、アップロードした瞬間Word Pressで有効化したはずのmy-snow-monkeyのプラグインが消えてしまいます。

これは具体的にどういうことでしょう？ 「My Snow Monkey プラグインが消える」というのは、サーバー上の WordPress のダッシュボード→プラグインにいったときに、My Snow Monkey が表示されていないということでしょうか？

♥ 0

いいねをした人: 居ません

[hampenoden]

はい、おっしゃる通りです。

Cyber duckにアップロードをすると、プラグインの一覧からmy snow monkeyの表示がなくなってしまいます。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

Cyber duckにアップロードをすると、プラグインの一覧からmy snow monkeyの表示がなくなってしまいます。

そのとき、Cyberduck でサーバー上のファイルを確認すると wp-content/plugins/my-snow-monkey/my-snow-monkey.php は存在しますか？

♥ 0

いいねをした人: 居ません

[hampenoden]

はい、存在します。

先ほど改めてアップロードしてみたところ、pluginsフォルダの中に

plugins/my-snow-monkey/css/style.css

plugins/my-snow-monkey/css/style.css.map

plugins/my-snow-monkey/my-snow-monkey.php

plugins/my-snow-monkey/README.md

ができましたが、この状態だと、Word Pressで「plugins/my-snow-monkey/my-snow-monkey.php on line 12　このサイトで重大なエラーが発生しました」　と出てきてしまいました。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

この状態だと、Word Pressで「plugins/my-snow-monkey/my-snow-monkey.php on line 12　このサイトで重大なエラーが発生しました」　と出てきてしまいました。

もしエラーメッセージがもっと表示されている場合はすべて教えてください。また、plugins/my-snow-monkey/my-snow-monkey.php の12行目には今どのようなコードが書かれていますか？

♥ 0

いいねをした人: 居ません

[hampenoden]

「Parse error: syntax error, unexpected ‘/’, expecting end of file in /home/xs715608/haseblo.com/public_html/wp-content/plugins/my-snow-monkey/my-snow-monkey.php on line 12
このサイトで重大なエラーが発生しました。対応手順については、サイト管理者のメール受信ボックスを確認してください。

WordPress のトラブルシューティングについてはこちらをご覧ください。」　です。

 

<?php
/**
* Plugin name: My Snow Monkey
* Description: このプラグインに、あなたの Snow Monkey 用カスタマイズコードを書いてください。
* Version: 0.2.3
*
* @package my-snow-monkey
* @author inc2734
* @license GPL-2.0+
*/

/　　←12行目のコードです。

Snow Monkey 以外のテーマを利用している場合は有効化してもカスタマイズが反映されないようにする*/
$theme = wp_get_theme( get_template() );
if ( ‘snow-monkey’ !== $theme->template && ‘snow-monkey/resources’ !== $theme->template ) {
return;
}

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

なるほどです。前に「途中のコメントアウト部分がうまくコメントアウトされずにエラーがでる状態になっていたので修正しました。」と書きましたよね。コードをここに書き込むときに自動整形か何かでコメントアウト部分が崩れてしまったのかな？と思っていたのですが、もともとのコードに間違いがある可能性があると思います。僕が修正したコードを参考に、コメントアウトを正しく入れ直してみてください。VSCode であればコメントアウト部分がグレーになると思うのでそれも参考になると思います。

♥ 1

いいねをした人:

[hampenoden]

コメントアウトを修正したら、全て解決いたしました。

ありがとうございました。

♥ 1

いいねをした人:

[投稿者]

投稿