「任意のタクソノミー」選択時のエラー及び、記事編集画面の表示崩れについて

♥ 0

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

このトピックには5件の返信、2人の参加者があり、最後にキタジマタカシにより2年、 7ヶ月前に更新されました。

6件の投稿を表示中 - 1 - 6件目 (全6件中)

投稿者

投稿
2022年3月30日 11:18 PM #102070
hoshiimo.run
参加者

♥ 3
【お使いの Snow Monkey のバージョン】 WordPress 5.9.2
【お使いの Snow Monkey Blocks のバージョン】バージョン 15.0.1
【お使いの Snow Monkey Editor のバージョン】バージョン 7.0.1
【お使いのブラウザ】 crome
【当該サイトのURL】

TEST SITE

akashi.slim-officeworker.com

### 発生している問題

Snow Monkeyを使い始めてまだ1週間足らずで、行き詰ってしまいましたので、質問させて頂きます。
現在、my snow monkeyを使ってカスタマイズしながらサイトを作成しています。
まずは、個別ページ（トップページ）の作成を始めましたが、早速、以下の２つの問題が発生しています。

確認されている問題点①

ブロックエディターの「任意のタクソノミー」を使うと、以下の画像のように、ずっとローディングしています。

この状態で保存して、プレビューすると

Warning: Undefined array key “taxonomy” in C:\Users…wp-content\plugins\snow-monkey-blocks\block\taxonomy-posts\view.php on line 27

と表示され、エラーとなってしまいます。

my-snow-monkey.phpの記述に問題があると思い、一度すべて削除してみましたが、状況は変わりませんでした。

確認されている問題点②

エディターに実際のページのスタイルを反映させたいと思い、以下の記事を参考にmy-snow-monkey.phpを作成しました。

Snow Monkey のカスタマイズは子テーマよりプラグインがオススメ！プラグインの雛形をダウンロードできるようにしました

子テーマの問題点一般的に、テーマの設定では対応できないカスタマイズについては、子テーマを用意し、コードを書い…

snow-monkey.2inc.org

実際のコード
```
<?php
/**
 * Plugin name: My Snow Monkey
 * Description: このプラグインに、あなたの Snow Monkey 用カスタマイズコードを書いてください。
 * Version: 0.2.1
 *
 * @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__)));

/**
 * 外部JS・CSSの読み込み
 */
add_action('wp_enqueue_scripts', 'msm_enqueue_style_script');
function msm_enqueue_style_script()
	{

	/* css読み込み */
	wp_enqueue_style(
		'msm_style',
		MY_SNOW_MONKEY_URL . '/dist/css/style.css',
		[ Framework\Helper::get_main_style_handle() ],
		filemtime(MY_SNOW_MONKEY_PATH . '/dist/css/style.css')
	);

	/* js読み込み */
	wp_enqueue_script(
		'msm_scripts',
		MY_SNOW_MONKEY_URL . '/dist/js/main.js',
		['jquery'],
		filemtime(MY_SNOW_MONKEY_PATH . '/dist/js/main.js'),
		true
	);

	wp_enqueue_script(
		'fontawesome',
		'https://kit.fontawesome.com/12e7f54fbf.js',
		[],
		'',
		true
	);
}

// エディター用の CSS 読み込み
// クラシックエディターとブロックエディターの両方に CSS が読み込まれます。
// ブロックエディターの場合は自動的に .editor-styles-wrapper でラップされます。
// 依存関係は指定できません。
add_action(
	'after_setup_theme',
	function () {
		add_theme_support('editor-styles');
		add_editor_style('/../../plugins/my-snow-monkey/dist/css/style.css');
	}
);

// ブロックエディター用の CSS 読み込み
// add_editor_style() とは違い、.editor-styles-wrapper ではラップされませんが、依存関係は指定できます。
add_action(
	'enqueue_block_editor_assets',
	function () {
		wp_enqueue_style(
			'my-snow-monkey',
			MY_SNOW_MONKEY_URL . '/block-editor.css',
			[ Framework\Helper::get_main_style_handle() ],
			filemtime(MY_SNOW_MONKEY_PATH . '/block-editor.css')
		);
	}
);

// クラシックエディター用の CSS 読み込み
add_filter(
	'tiny_mce_before_init',
	function ($mce_init) {
		if (! isset($mce_init['content_style'])) {
			$mce_init['content_style'] = '';
		}

		$response = file_get_contents(MY_SNOW_MONKEY_PATH . '/classic-editor.css');
		if ($response) {
			$response = str_replace([ "\n", "\r" ], '', $response);
			$response = str_replace('"', '\\"', $response);

			$mce_init['content_style'] .= $response;
		}

		return $mce_init;
	}
);

/**
 * FontAwesome ショートコード
 */
function hsm_add_fontawesome_icon($atts)
{
	extract(shortcode_atts(array(
		'icon' => 'fab fa-wordpress',
	), $atts));
	$output = '<i class="' . $icon . '"></i>';
	return $output;
}
add_shortcode('hsm-fa', 'hsm_add_fontawesome_icon');
```
上記のコードを設置したところ、固定記事編集ページを開くと以下のエラーが出現するようになりました。ただし、数秒すると以下のエラーは消え、通常の編集画面が表示されます。
```
Warning: file_get_contents(/home/c1169778/public_html/akashi.slim-officeworker.com/wp-content/plugins/my-snow-monkey/classic-editor.css): failed to open stream: No such file or directory in /home/c1169778/public_html/akashi.slim-officeworker.com/wp-content/plugins/my-snow-monkey/my-snow-monkey.php on line 103
```
```
Warning: filemtime(): stat failed for /home/c1169778/public_html/akashi.slim-officeworker.com/wp-content/plugins/my-snow-monkey/block-editor.css in /home/c1169778/public_html/akashi.slim-officeworker.com/wp-content/plugins/my-snow-monkey/my-snow-monkey.php on line 90
```
また、右側の固定ページとブロックの編集画面の表示が崩れていまうようになりました。

原因について、思い当たるところがあれば教えて頂きたく、宜しくお願いします。

♥ 0

いいねをした人: 居ません
2022年3月31日 7:48 AM #102088

キタジマタカシ
参加者

♥ 2421

ブロックエディターの「任意のタクソノミー」を使うと、以下の画像のように、ずっとローディングしています。

任意のタクソノミーの投稿ブロックのインスペクター（設定パネル）で表示したいタームが未選択であれば選択してみてください！

上記のコードを設置したところ、固定記事編集ページを開くと以下のエラーが出現するようになりました。ただし、数秒すると以下のエラーは消え、通常の編集画面が表示されます。

No such file or directory はそのファイルが存在しないというエラーです。「そのファイル」というのは my-snow-monkey.php on line 103 に書かれています。今回の場合は classic-editor.css ですね。My Snow Monkey の中に classic-editor.css が無いのでエラーになっています。classic-editor.css が不要な場合は classic-editor.css を読み込むコード自体を消して大丈夫です。

また、右側の固定ページとブロックの編集画面の表示が崩れていまうようになりました。

Classic Editor プラグインを入れていますか？

♥ 0

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

2022年3月31日 9:45 AM #102096

hoshiimo.run
参加者

♥ 3

キタジマ様

ご返信有難うございます。

改めて確認した結果、任意のタクソノミーの投稿ブロックのインスペクター（設定パネル）で、タームを選択するフィールドが表示されませんでした。

2つ目の件については、こちらの確認不足で申し訳ありません。確かに、存在しないファイルのパスが指定されていました…。classic-editor.cssは存在しないため、削除するようにします。

（classic editorプラグインも使っていません）

同様にblock-editor.cssも使っていないため、削除します。

ちなみに、

＋エディター用の CSS 読み込み
＋ブロックエディター用の CSS 読み込み
＋クラシックエディター用の CSS 読み込み

の3つの読み込み方法を書いている理由について教えて頂けないでしょうか？

クラシックエディターは使用想定がないため、あまり気にしていませんが、ブロックエディター用のCSSはどんな場面で作成が必要になるかイメージが沸いていません…。

♥ 0

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

2022年3月31日 12:51 PM #102125

キタジマタカシ
参加者

♥ 2421

改めて確認した結果、任意のタクソノミーの投稿ブロックのインスペクター（設定パネル）で、タームを選択するフィールドが表示されませんでした。

上記のとき、デベロッパーツールに JavaScript のエラーがなにかでていませんか？

＋エディター用の CSS 読み込み
＋ブロックエディター用の CSS 読み込み
＋クラシックエディター用の CSS 読み込み

の3つの読み込み方法を書いている理由について教えて頂けないでしょうか？

両方で読み込ませたい用、ブロックエディターでだけ読み込ませたい用、クラシックエディターでだけ読み込ませたい用、ということです。add_editor_style() を使った1番目の方法はブロックエディターにもクラシックエディターにも CSS が読み込まれますが、ブロックエディターの場合、各セレクタが強制的に .editor-styles-wrapper で囲われてしまうため意図しない詳細度で CSS が適用され、表示が崩れてしまうことがあります。そのようなときは enqueue_block_editor_assets を使ってブロックエディター用の CSS を読み込ませれば、思った通りのセレクタで思った通りの依存関係で CSS を読み込ませることができます。

♥ 0

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

2022年3月31日 1:07 PM #102128
hoshiimo.run
参加者

♥ 3
キタジマ様

すみません、「任意のタクソノミーの投稿ブロックのインスペクター（設定パネル）で、タームを選択するフィールドが表示されない」の件、my snow monkey以外の使用しているプラグインを一度全て無効化し、再度有効化したら解決しました。

実は上記に加え、ウィジェットも表示されなくなっていましたが、こちらもプラグインの無効化⇒有効化により解決しました…。

全く理由は分かりませんが、インストールしているプラグインは以下の通りです。
- Advanced Custom Fields
- All-in-One WP Migration
- Copy & Delete Posts
- Custom Post Type UI
- My Snow Monkey
- Show Current Template
- Snow Monkey Blocks
- Snow Monkey Editor
- Snow Monkey Forms
- WP Multibyte Patch
♥ 1

いいねをした人:
2022年3月31日 1:30 PM #102132

キタジマタカシ
参加者

♥ 2421

いずれかのプラグインが裏側で PHP エラーを吐いていて、その影響で API が正しい返り値を返せず表示されていなかった、というのが可能性としては高そうですね。停止したプラグインを1つずつ有効していって、その都度表示がされるか確認、エラーが再現したらそのとき有効化したプラグインが原因だと思われます。

♥ 2

いいねをした人:
投稿者

投稿