old emulsion 2.1.3

full site editor theme

間違ったCSSクラスを防ぐために修正されました

CSSクラスのemulsion-has-sidebar、emulsion-header-has-titleをbody要素から削除します

Fixed to prevent the Theme wrong CSS class

remove CSS class emulsion-has-sidebar, emulsion-header-has-title from body element

FSE Transitional Theme

Fixed duplicate of the main element using filter

With this change, I changed to stop the gutenberg skip link script. The skip link used is that of the theme.

Cannot edit blocks

body:not(.block-editor-page){nightmare:true }

  • panel block
  • dropdown hover block
  • dropdown click block

I noticed that the edit screen of the block editor is hidden

When I looked it up, an inline style of 16000line, which seems to have replaced the style of the theme, was added block editor screen.

Rule set described in the theme stylesheet

body:not(.block-editor-page) .wp-block-group.modal {
    position: absolute;
    padding: 0;
    overflow: hidden;
    color: var(--thm_general_text_color);
    visibility: hidden;
    background: var(--thm_background_color);
}

Rule set added in the editor

.editor-styles-wrapper:not(.block-editor-page) .wp-block-group.modal {
    position: absolute;
    padding: 0;
    overflow: hidden;
    color: var(--thm_general_text_color);
    visibility: hidden;
    background: var(--thm_background_color);
}

These looked like the plugin simply replaced the body element with editor-styles-wrapper.

In order to escape from this forced replacement and regain its original functionality, I decided to change the body element to the .emulsion class.

.emulsion:not(.block-editor-page) .wp-block-group.modal {
    position: absolute;
    padding: 0;
    overflow: hidden;
    color: var(--thm_general_text_color);
    visibility: hidden;
    background: var(--thm_background_color);
}

wp-block-embed

表示不良を修正

Fixed Due to the style of the theme, it could not be displayed on the front end

Gutenberg upload allowed file type

gutenberg には、本来許可されているはずのファイルがアップロードできないバグがあるようです。https://github.com/WordPress/gutenberg/issues/23510

windows 環境で長期的に発生している模様なので、暫定的にフィルターで、zipファイルと、htmlファイルのアップロードを許可しました。

There seems to be a bug in gutenberg where you can’t upload files that should have been allowed.https://github.com/WordPress/gutenberg/issues/23510

Since it seems to have occurred in the windows environment for a long time, I temporarily allowed uploading of zip files and html files with a filter.

Modified CSS block navigation

OUTPUT HTML CHANGES

from

	<a class="wp-block-navigation-item__content" href="" title="">
		<span class="wp-block-navigation-item__label">Blog</span>
		<span class="wp-block-navigation__submenu-icon" tabindex="0">
			<svg xmlns="" width="12" height="12" viewBox="0 0 12 12" fill="none" role="img" aria-hidden="true" focusable="false">
				<path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path>
			</svg>
		</span>
	</a>

to ( gutenberg 12.0.1 )

	<a class="wp-block-navigation-item__content has-text" href="" data-no-instant="data-no-instant">gutenberg block file file type</a>
	<button class="wp-block-navigation__submenu-icon wp-block-navigation-submenu__toggle" aria-expanded="false" tabindex="0"><svg xmlns="" width="12" height="12" viewBox="0 0 12 12" fill="none" role="img" aria-hidden="true" focusable="false">
		<path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path>
	</svg>
	</button>

Remove filter

add_filter( 'theme_templates', 'emulsion_load_block_page_templates_exclude', 21 );
add_filter( 'block_editor_settings_all', function ( $settings ) {

	$settings['defaultBlockTemplate'] = file_get_contents( get_theme_file_path( 'block-templates/default.html' ) );

	return $settings;
} );

removed template block-templates/default.html

		// check
		//$result	 .= remove_filter( 'block_editor_settings', 'gutenberg_experiments_editor_settings' ) ? '' : ' gutenberg_experiments_editor_settings';
		//todo
		//$result	 .= remove_filter( 'block_editor_settings_all', 'gutenberg_experiments_editor_settings' ) ? '' : ' gutenberg_experiments_editor_settings';

known issues

If Classic Theme is selected

(Customizer/ Theme Operation Mode Setting / Classic Theme)

all template parts, all templates link can not access template page

alert message ‘Sorry, you are not allowed to access this page.’

but You can edit the template of posts editor

//remove_action( 'admin_menu', 'gutenberg_site_editor_menu', 9 );

モーダルブロックパターン

投稿編集画面で、モーダルボックスのコンテンツ編集が非表示となったことに気付く

原因は、フロントエンドのスタイルが、エディタにも反映し、非表示となっていたことにある。

.editor-styles-wrapper:not(.block-editor-page) .wp-block-group.modal {
    position: absolute;
    padding: 0;
    overflow: hidden;
    color: var(--thm_general_text_color);
    visibility: hidden;
    background: var(--thm_background_color);
}
#wpbody-content .editor-styles-wrapper:not(.block-editor-page) .wp-block-group.modal {
    position: relative;
    padding: 0;
    overflow: hidden;
    visibility: visible;
}

editor-style を移譲の用に上書きした。しかし、なぜ?

原因を調べる

.editor-styles-wrapper:not(.block-editor-page) .wp-block-group.modal {
position: absolute;
padding: 0;
overflow: hidden;
color: var(--thm_general_text_color);
visibility: hidden;
background: var(--thm_background_color);
}

コアが、body要素を.editor-styles-wrapper上書きして、エディタ用スタイルを作成している模様

地雷が見つかりました。

body:not(.block-editor-page){
    ...
}

このようなスタイル指定は使用しないのが賢明

.some-class:not(.block-editor-page){
    ...
}

このような表現を行えば、editor styleに影響はなく、editor style側で上書きする必要はなさそうです。

gutenberg 12.0.1

<li class=" wp-block-navigation-item has-child open-on-hover-click wp-block-navigation-submenu">
	<a class="wp-block-navigation-item__content has-text" href="" data-no-instant="data-no-instant">gutenberg block file file type</a>
	<button class="wp-block-navigation__submenu-icon wp-block-navigation-submenu__toggle" aria-expanded="false" tabindex="0"><svg xmlns="" width="12" height="12" viewBox="0 0 12 12" fill="none" role="img" aria-hidden="true" focusable="false">
		<path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path>
	</svg>
	</button>
	<ul class="wp-block-navigation__submenu-container">
		<li class=" wp-block-navigation-item current-menu-item wp-block-navigation-link">
			<a class="wp-block-navigation-item__content" href="" aria-current="page" data-no-instant="data-no-instant">
			<span class="wp-block-navigation-item__label">test</span>
			</a>
		</li>
	</ul>
</li>
<li class=" wp-block-navigation-item has-child  menu-item menu-item-type-post_type menu-item-object-page wp-block-navigation-link">
	<a class="wp-block-navigation-item__content" href="" title="">
		<span class="wp-block-navigation-item__label">Blog</span>
		<span class="wp-block-navigation__submenu-icon" tabindex="0">
			<svg xmlns="" width="12" height="12" viewBox="0 0 12 12" fill="none" role="img" aria-hidden="true" focusable="false">
				<path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path>
			</svg>
		</span>
	</a>
	<ul class="wp-block-navigation__submenu-container">
		<li class=" wp-block-navigation-item has-child  menu-item menu-item-type-post_type menu-item-object-page wp-block-navigation-link">
			<a class="wp-block-navigation-item__content" href="" title="">
				<span class="wp-block-navigation-item__label">Front Page</span><span class="wp-block-navigation__submenu-icon" tabindex="0">
					<svg xmlns="" width="12" height="12" viewBox="0 0 12 12" fill="none" role="img" aria-hidden="true" focusable="false">
						<path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path>
					</svg>
				</span>
			</a>
			<ul class="wp-block-navigation__submenu-container">
				<li class=" wp-block-navigation-item  menu-item menu-item-type-post_type menu-item-object-page wp-block-navigation-link">
					<a class="wp-block-navigation-item__content" href="" title="">
						<span class="wp-block-navigation-item__label">full post</span>
					</a>
				</li>
			</ul>
		</li>
	</ul>
</li>

old

style 要素の 15000行目に、以下のスタイルが見つかった

個別投稿の、クエリーブロック、投稿画像ありの場合のレイアウトの調整

いってもしょうがない。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

[emulsion_relate_posts]