模式与块锁定

块锁定 API是一组功能强大的工具，可用于锁定块的行为以及用户与这些块交互的方式。你可以控制用户是否能够删除、移动块或自定义块，从而进一步优化主题的编辑体验。

本文将探讨如何在主题模板中运用该 API。如需更深入的了解，可参阅《块编辑器手册》中的 块锁定文档。

你不仅可以在模板中使用块锁定功能，还可以将本文介绍的方法应用到模板上。

模板锁定

模板锁定指的是锁定容器型块内的所有嵌套块。通过模板锁定，可以实现三种类型的锁定：

• all：结合之前介绍的块锁定功能，锁定容器内的所有块。
• insert：防止用户在容器内插入新块。
• contentOnly：锁定容器内的所有块设置，仅允许用户编辑内容（如文本和媒体文件）。

在核心功能中，只有部分容器型块支持模板锁定，具体包括：

• Group
• Cover
• Columns
• Column
• Navigation

锁定所有嵌套块

如果某个模板被包裹在支持的容器型块中，就可以通过内置的界面控件锁定该模板内的所有嵌套块。

这种锁定方式建立在本文早先介绍的块锁定功能之上。你可以为所有嵌套块选择禁用移动、禁止删除，或同时执行这两种操作。

在事件模板中点击对应的 Group 块并打开锁定模态框后，选中禁用移动和禁止删除选项。此外还会出现一个名为应用到所有块的选项，点击后可将这些规则应用到 Group 内的所有块上：

查看底层的块标记代码，会看到新增的templateLock属性，其值为all；同时lock属性的move和remove值也为true：

<!-- wp:group {"templateLock":"all","lock":{"move":true,"remove":true}} -->

与单个块锁定类似，你也可以灵活组合不同级别的锁定选项。

现在在主题中创建一个名为/patterns/event-lock-all.php的新文件，然后将以下代码粘贴进去：

<?php
/**
 * Title: Event (Lock All)
 * Slug: themeslug/event-lock-all
 * Categories: banner
 * Viewport Width: 1376
 */
?>
<!-- wp:group {"templateLock":"all","lock":{"move":true,"remove":true},"align":"wide","style":{"elements":{"link":{"color":{"text":"var:preset|color|base-2"}}},"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30","left":"var:preset|spacing|30","right":"var:preset|spacing|30"}}},"backgroundColor":"contrast","textColor":"base-2","layout":{"type":"default"}} -->
<div class="wp-block-group alignwide has-base-2-color has-contrast-background-color has-text-color has-background has-link-color" style="padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--30)">

	<!-- wp:image {"sizeSlug":"full","linkDestination":"none"} -->
	<figure class="wp-block-image size-full"><img src="https://s.w.org/patterns/files/2021/06/Group-17-scaled.jpg" alt="Image of a woman being carried through the air by swans."/></figure>
	<!-- /wp:image -->

	<!-- wp:columns {"verticalAlignment":"center"} -->
	<div class="wp-block-columns are-vertically-aligned-center">
		
		<!-- wp:column {"verticalAlignment":"center"} -->
		<div class="wp-block-column is-vertically-aligned-center">
			<!-- wp:paragraph -->
			<p><strong><?php esc_html_e( 'Location:', 'themeslug' ); ?></strong><br><?php esc_html_e( '82 Main St. Brooklyn, NY', 'themeslug' ); ?></p>
			<!-- /wp:paragraph -->
		</div>
		<!-- /wp:column -->

		<!-- wp:column {"verticalAlignment":"center"} -->
		<div class="wp-block-column is-vertically-aligned-center">
			<!-- wp:paragraph -->
			<p><strong><?php esc_html_e( 'Date:', 'themeslug' ); ?></strong><br><?php esc_html_e( 'October 24, 2021', 'themeslug' ); ?></p>
			<!-- /wp:paragraph -->
		</div>
		<!-- /wp:column -->

		<!-- wp:column {"verticalAlignment":"center"} -->
		<div class="wp-block-column is-vertically-aligned-center">
			<!-- wp:buttons -->
			<div class="wp-block-buttons">
				<!-- wp:button {"width":100,"className":"is-style-outline"} -->
				<div class="wp-block-button has-custom-width wp-block-button__width-100 is-style-outline"><a class="wp-block-button__link wp-element-button"><?php esc_html_e( 'Purchase Tickets' ); ?></a></div>
				<!-- /wp:button -->
			</div>
			<!-- /wp:buttons -->