heyday/silverstripe-slices

为DataObject子类提供带自定义模板的Slice扩展

安装次数: 3,271

依赖项: 0

建议者: 0

安全性: 0

星标: 7

关注者: 25

分支: 3

类型:silverstripe-module

2.0.1-alpha 2020-02-25 02:55 UTC

README

在“切片”中进行内容管理;将内容组件分开,每个组件都有自己的模板、字段和视觉设置,用户可以在CMS中创建和排列。

  • CMS中的切片预览
  • 通过YAML配置Slice CMS

用法

最好在基础切片类上使用许多通用字段与silverstripe-slices一起使用,因为这允许模板共享字段并在YAML中配置,而无需为每个切片创建一个类。silverstripe-adaptivecontent对此处理得很好(并且曾经与该模块集成)。

# Use the generic fields in silverstripe-adaptivecontent
Slice:
  extensions:
    - 'AdaptiveContent'
    - "AdaptiveContentRelated('Page')"

模板

每个切片类型/模板都有自己的模板文件,文件名为[BaseSliceClass]_[TemplateName]。这些可以放在themes/[theme]/templates/Slices中,以将它们与网站中的其他模板分开。

将切片添加到页面

本模块附带一个扩展,可轻松设置页面上的切片

Page:
  extensions:
    - PageSlicesExtension

在模板中,可以使用以下方法渲染所有切片

<% if $Slices %>
    <% loop $Slices %>
        $forTemplate
    <% end_loop %>
<% end_if %>

子类化切片

子类化Slice是正常的使用案例,但是请注意,在子类化时,您需要在您的“基本”切片子类(在Page的has_many中指向的那个)中重写getBaseSliceClass方法,以便切片可以正确保存

class ContentSlice extends Slice
{
    protected function getBaseSliceClass()
    {
        return __CLASS__;
    }
}

class VideoSlice extends ContentSlice
{
    // Subclasses of your 'base' subclass don't need anything special
}

这是由于模块需要在模板配置中没有设置className键时回退到一个“默认”类。

自定义CMS字段

YourBaseSlice::getCMSFields中添加和修改字段是一个预期的使用案例。请注意,如果在切片YAML配置中配置了某些内容,则如果用自定义内容替换字段,则会被覆盖。在这种情况下,您可以在getCMSFields函数的末尾重新应用切片配置,如下所示

// Re-apply slices config
$config = $this->getCurrentTemplateConfig();
$this->configureFieldsFromConfig($fields, $config);

自定义CMS中的切片预览

Slice preview in CMS

切片预览在编辑和浏览时会在iframe中渲染CMS。默认情况下,预览在基本HTML页面包装器内渲染:silverstripe-slices/templates/SliceWrapper.ss。您可以在自己的主题中覆盖此包装器以自定义切片预览的交付方式。

示例配置

Slice:

  # Define stylesheets to be used when previewing slices in the CMS
  previewStylesheets:
    - /themes/base/css/styles.css

  # Automatically configure the upload folder for these file fields on Slice
  # Files and images will be uploaded to assets/Uploads/Slices/[TemplateName]
  uploadFolderFields:
    - LeadImage
    - SecondaryImage
    - LeadFile

  # The default slice template can be specified, or defaults to the first defined
  # This is just what is selected by default when a new slice is created
  defaultTemplate: TwoColumnImage

  templates:
    Quote:
      fields:
        Title: Quotee
        Content:
          # Set the CMS "title" of the field
          label: Quote

          # Change the form component used for this field
          fieldClass: TextareaField

          # Cast the field to something when rendering it in the template
          casting: Text

          # Value to use for the field's "right title"
          help: ~20 - 30 words

          # Value to use when previewing what the slice will look like
          exampleValue: Dolor exercitation sint ad minim et deserunt nisi aliquip cillum laboris ipsum esse nulla commodo cupidatat ipsum proident exercitation veniam

      # Options exposed in the CMS for configuring the slice template
      # The key is accessible in templates, and the value is used as the CMS title
      visualOptions:
        no-icon: No icon
        bold-quote: Bold quoted text


    TwoColumnImage:
      # Name to show for the template in the CMS
      name: Two column with image

      # Class to change to when using this template
      # This allows complex slices to have extra fields and code
      className: TwoColumnImageSlice

      # Fields that only need a label configured can be defined using a shortcut:
      # (The order fields are defined here also controls the order they show in the CMS)
      fields:
        Title: ~
        Content: Text column
        LeadImage:
          name: Image
          # Images can be specified as file names in example content
          exampleValue: themes/base/images/examples/random-guy.jpg

      visualOptions:
        image-right: Image in right column
        title-centered: Center title above columns

兼容性

此模块需要至少SilverStripe 3.1和PHP 5.3。