Cabloy-CMS provides a topic inheritance mechanism that makes it easy to modify individual files based on the original theme to quickly create a new theme.   cms-themeaws is a new theme created on the basis of cms-themeblog.

Steps

Inheriting theme generally takes only three steps

Declare inheritance relationship

cms-themeaws/package.json

{
  "name": "egg-born-module-cms-themeaws",
  "version": "1.0.0",
  "title": "cms:theme:aws",
  "eggBornModule": {
    "cms": {
      "name": "aws",
      "theme": true,
      "extend": "cms-themeblog"
    },
    "dependencies": {
      "a-instance": "1.0.0"
    }
  },
  ...
  "dependencies": {
    ...
    "egg-born-module-cms-themeblog": "^1.1.3"
  }
}
  • extend: cms-themeblog: Declare to inherite from theme cms-themeblog
  • egg-born-module-cms-themeblog: ^1.1.3: Declare module dependencies to automatically install the original theme

Overwrite parameters

cms-themeaws/backend/src/config/config.js

// theme
config.theme = {
  _theme: {
    name: 'cms-themeaws',
    url: 'https://github.com/zhennann/egg-born-module-cms-themeaws',
  },
};
  • _theme: The parameters provided by the theme cms-themeblog, overwite here

Overwrite source code and resources

Overwrite the source code and resources of the original theme as needed, here we just overwrite one CSS style file.

cms-themeaws/backend/cms/theme/assets/css/site.css.ejs

body {
  font-size:14px;
  color:#666;
  background: #FAFAFA;
}

...

a {
  color: #007eb9;
}
a:visited{
  color:#005b86;
}
a:hover,a:focus{
  color:#e47911;
}