如何在Squarespace开发者模式下插入表单块

How to insert form block in developer mode in Squarespace

我正在开发人员模式下的 Squarespace 网站上工作,我可以在其中使用代码创建网站。

在文件 site.region 中,我注意到我可以使用以下代码插入页脚块:

<squarespace:block-field id="footerBlocksMiddle" class="Footer-blocks Footer-blocks--middle sqs-alternate-block-style-container" columns="12" label="{localizedStrings.footerMiddleBlocks}" />

但是,我一直无法弄清楚如何更好地插入表单块,以便将其设置为电子邮件存储。

我尝试了 <squarespace:block-form 但那不起作用。

squarespace 配置页面上的错误如下所示:

&quot;Something went wrong.&quot;

如何写出这段代码?

您提到的页脚代码中实际发生的事情是插入 block field。在该块字段中,您可以按照您喜欢的任何排列添加任何块。

因此,为了实现您的目标,您将插入一个块字段,然后仅向其中添加一个表单块。然后,在您希望该表单块出现的其他地方,将块字段(包含表单块)添加到代码中。

只要您使用相同的id,相同的块字段将被重复使用,允许您在任何区域编辑表单,并且更改将影响放置块字段的所有其他地方。

<squarespace:block-field id="myFormOnlyBlockField" columns="1"/>

将其放置在您希望表单块出现的位置。当然,最初,您必须向其中添加表单块并进行配置。从那时起,在整个站点模板中添加上面的代码将显示表单,并且更改块的任何实例将影响所有实例。

请注意,我已在上面的示例中将 'columns' 设置为“1”,假设您只是添加一个块,因此不需要更多列。你可以将它设置为其他东西,它也能正常工作。另请注意,您添加块字段的区域周围可能有太多 spacing/padding/margin,因此您可能需要 CSS 进行调整。

或者,可以在代码块中执行 JavaScript 以向页面上包含表单块的页面发出 AJAX/Fetch 请求,并让该表单块替换其中的代码块其中 JavaScript 被执行。即使没有开发者模式,这种方法也能奏效。