学习笔记 ibexa Exp 教程

Veröffentlicht am von

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.1views.yaml里ezpublish > system > site > content_view > full > landing_page 绑定

总结

本教程主要演示了如何创建布局，创建2种内建内容类型（列表内容和计划内容），创建自定义内容类型，创建用户表单。