Drupal9自定义主题下在线留言表单的6大进阶配置

  有关drupal环境下webform表单的使用方法,白龙网之前曾经写过《Drupal8.7.6下如何定制在线留言表单?》《巧用drupal9别名把webform“在线留言”表单关联到“联系我们”栏目》两篇文章详细说明过,但是缺少系统性、全面性,导致开发过程中总是遇到意料之外的门槛。掌握表单复用、灵活使用模板、学会表单调用、调试表单样式、配置表单字段、修改表单按钮等技巧的熟悉应用,将有助于节约开发时间,提升开发效率。
 
  一、表单区块复用
 
  下载、安装和启用webform模块后,webform自带一个“contact”的表单,该表单以区块的形式存在。因此,可以在“管理->结构->布局”中把“contact”表单区块放置在任何自定义的区域。同时,可以在“管理->结构->webforms”中自定义其它个性表单,然后把该个性表单放置在目标区域。这就是webform同一个表单、不同表单在网站同一区域、不同区域的复用。即同一个表单可以在网站的某个区域出现,也可以在网站的多个地方出现。
 
  二、表单模板使用
 
  webform表单涉及的主要模板有两个,一是page--webform.html.twig模板,用来定义页面相关信息,通过{{page.content}}链接表单实体,也可以根据debug提示,使用唯一的模板名称识别表单。二是webform.html.twig模板,用来输出表单实体,并调试表单相关样式。webform的两个模板,有点类似于搜索功能的两个模板:一个页面模板,一个实体输出模块。具体使用过程中,可以根据静态html中的布局、样式,结合debug中提示的模板修改对应代码即可。
 
  三、表单变量调用
 
  自定义的webform表单要放在哪个区域,需要在*.info.yml配置文件中提前定义后,才能在“管理->结构->布局”出现已定义的区域,然后把webform中定义的表单区块放置到已定义的区域,重建缓存后,配置的表单功能才能生效。
 
  四、表单样式修改
 
  表单样式的修改方法很多,平时经常使用的,一般有两种,一是可以通过表单关联的模板覆写相应的表单样式,如果覆写的足够完美,是可以一步到位的解决样式问题的;二是可以通过webform模块的配置功能,添加相应的类,在CSS文件中控制表单的样式。
 
  五、表单详细配置
 
  webform表单要配置的信息很多,例如,字段长度、是否必填、约束条件、标题名称等等,具体情况,可以根据需求配置即可。
 
  六、表单按钮修改
 
  默认情况下,webform表单的提交按钮名称是“submit”。可以点开提交按钮的字段,把“submit”名称修改为“提交”,或者其它已定义的名称。