ibexa Exp教程2 是2阶课程。在1阶内已经完成了基本的安装,模板显示等初级教学。在本阶内主要学习以下内容:
- 理解页面工作原理和架构
- 能够自行创建页面和布局
- 能够定制页面块
- 能够创建自定义块
- 理解表单构造和配置自定义表单
- 理解样式化自定的模块
简介
按照在1阶学到的知识,首先是创建2个新的content type:
- 狗品种页面
- 建议贴士页面
任务1 创建入口页(Landing page)
后台Content sturcture里可以啊看到一个content tree. 这里用来组织你的内容结构。其中根内容就是站点的入口 Landing Page。 你可以创建子目录,在子目录内创建子内容。这会影响以后你页面上主菜单的显示(需要代码支持)。
任务2 使用后台site预览首页
后台site 站点是一个可视化的内容编辑器。它会根据你设定的页面布局定义(Layout)来显示初步的页面框架。
页面布局定义的key位于ezplatform_page_fieldtype.layouts
下。配置内容是在yaml里定义的。以下范例内容定义了一个名为sidebar的页面布局layout。
ezplatform_page_fieldtype:
layouts:
sidebar:
identifier: sidebar
name: Right sidebar
description: Main section with sidebar on the right
thumbnail: /assets/images/layouts/sidebar.png
template: layouts/sidebar.html.twig
zones:
first:
name: First zone
second:
name: Second zone
注意观察模板文件sidebar.html.twig, 会发现其中与配置项zones的对应关系。就是zones[n]。
这个layout模板是如何与站点的base模板绑定的呢?就是在site里,在编辑模式下,右上角的…按钮“switch layout“来定义的。
创建入口配置
起始页面定义的key:ezplatform.system.site.content_view 。原始配置如下
ezplatform:
system:
site:
content_view:
full:
welcome_page:
template: "@ezdesign/full/welcome_page.html.twig"
match:
Id\Location: 2
params:
project_dir: '%kernel.project_dir%'
这个配置不再需要,可以删除。
在新的配置里被放到了 config/packages/view.yaml 中, 注意这个yaml文件名不包含ezplattform字样,很容易被忽略。)
Layout的key: ezpublish.system.site.page_layout
然后在 ezpublish.system.site.content_view.full下添加一个key: ‘landingg_page’, 内容是
landing_page:
template: "full/landing_page.html.twig"
match:
identifier\ContentType: "landing_page"
和
ezpublish.system.site.user.layout
具体任务
1 创建一个内建的“列表内容块” (content list block)
任务: 在首页landing page显示一个狗的种类列表
2 创建一个内建的”计划内容块“ (content scheduler block)
任务: 创建功能文章
先在fieldtype里定义一个叫做“schedule” 的块,然后拥有一个名字为“featrued“的view.
3 创建一个自定义的随机内容块“ (custom block)
随机显示特定目录下的内容。完成这个任务需要:
- 创建配置 (以便在后台编辑面板中出现并使用配置)
- 创建模板
- 创建监听器 (需要代码)
- 注册监听器为服务
4 创建 Form Block
作为一个form,你需要在后台的form编辑器内定义好所需的字段,模板和样式表。然后在首页编辑器内,把form拖入多在的位置。
通过 form 发送经来的信息则会保存在后台 form 的 submissions 之内。
完成以上4个任务后,本教程告一段落。
模板之间的层级关系
pagelayout.html.twig | 顶级layout. 定义了header, footer,menu和content预留位 | 1 | |
– layouts/sidebar.html.twig | 定义了左右两栏式的页面布局。被放置到content预留位内。 | 2 | |
– full/landing_page_html.twig | 继承于pagelayout.html.twig, 填充了conent预留位 | 1.1 | views.yaml里ezpublish > system > site > content_view > full > landing_page 绑定 |
总结
本教程主要演示了如何创建布局,创建2种内建内容类型(列表内容和计划内容),创建自定义内容类型,创建用户表单。