上海戴文 - Drupal开发专家

你在这里

创建Drupal 8子主题

原文:Creating a Drupal 8 sub-theme

子主题和其它主题是一样的,但有一点区别:它们继承父主题的资源。子主题链接到其父主题的能力是没有限制的。子主题可以是另一子主题之子。它可以分叉,任您组织。这就给子主题以巨大的潜能。要创建子主题,您先像其它主题一样定义您的主题,用"base theme"键声明基主题。请注意这个键没有下划线。

例子 my_theme.info.yml(Example my_theme.info.yml)

这是一个子主题的例子,它用Classy作为基主题

name: Fluffiness
type: theme
description: This is a fluffy sub theme of Classy
core: 8.x
# Defines the base theme
base theme: classy
# Defines libraries group in which we can add css/js.
libraries:
  - my_theme/global-styling
# Regions
regions:
  header: Header
  featured: Featured
  content: Content
  sidebar_first: First sidebar
  sidebar_second: Second sidebar
  footer: Footer

包含my_theme.libraries.yml文件以把css/js加入到`global-style`(定义在上面的`libraries:`键)中。

global-styling:
  css:
    theme:
      css/style.css: {}

添加Javascript:怎样添加JavaScript

与 Drupal 7 的区别(Differences with Drupal 7)

与 Drupal 7最明显的区别是 .info文件变成.info.yml文件,后者使用YAML语法。


以下是英文原文,可对照阅读

Sub-themes are just like any other theme, with one difference: they inherit the parent theme's resources. There are no limits on the chaining capabilities connecting sub-themes to their parents. A sub-theme can be a child of another sub-theme, and it can be branched and organized however you see fit. This is what gives sub-themes great potential. To create a sub-theme you define your theme like any other theme and declare the base theme using the "base theme" key. Note that the key has no underscore.

Example my_theme.info.yml

This is an example of a sub-theme that uses Classy as a base theme

name: Fluffiness
type: theme
description: This is a fluffy sub theme of Classy
core: 8.x
# Defines the base theme
base theme: classy
# Defines libraries group in which we can add css/js.
libraries:
  - my_theme/global-styling
# Regions
regions:
  header: Header
  featured: Featured
  content: Content
  sidebar_first: First sidebar
  sidebar_second: Second sidebar
  footer: Footer

Include my_theme.libraries.yml file to add css/js in `global-style` group (defined above in `libraries:` key).

global-styling:
  css:
    theme:
      css/style.css: {}

How to add JavaScript

Differences with Drupal 7

The most notable difference with Drupal 7 is that .info files have become .info.yml files that use the YAML syntax.