如何在撇号cms主题site.less中添加字体

时间:2018-10-27 10:07:32

标签: apostrophe apostrophe-cms

我在主题中添加了字体,但仍然得到404。

import "utils/reset.less";

@apos-ui-font-path: '/modules/theme/public/css/font-awesome/fonts/';
.apos-add-font('roboto', @apos-ui-font-path + 'roboto-regular-webfont');


    // Delete the boilerplate CSS below when you are ready to dive in and customize your sites        
body { background-color: @apos-white;
        }

.main-content {
  margin: 200px auto;
  padding: 20px;
  max-width: 500px;
  color: @apos-white;
  background-color: @apos-primary;
  .apos-drop-shadow;

  .login-link {
    float: right;
    color: @apos-white;
  }

  // Basic rich-text editor styles:
  h3 {
    font-size: 24px;
    margin-bottom: 12px;
  }

  h4 {
    font-size: 20px;
    margin-bottom: 10px;
  }

  strong { font-weight: bold; }
  em { font-style: italic; }
}

我还附上了我的index.js

module.exports = {
  construct: function(self, options) {
    // loads from public/js/site.js of this module
    self.pushAsset('script', 'popper');
    self.pushAsset('script', 'bootstrap.min');
    self.pushAsset('script', 'particles');
    self.pushAsset('script', 'custom');
    // loads from public/css/site.less of this module
    self.pushAsset('stylesheet', 'jquery-3.2.1.min');
    self.pushAsset('stylesheet', 'bootstrap.min');
    self.pushAsset('stylesheet', 'font-awesome/font-awesome.min');
    self.pushAsset('stylesheet', 'style');
    self.pushAsset('stylesheet', 'site');

  }
};

我是否错过了某些内容,因为我的字体无法与撇号cms一起使用?或路径不正确?如何提供字体主题中的相对路径

预先感谢

2 个答案:

答案 0 :(得分:0)

您是否尝试过将URL中的“ / public”删除为字体。有关示例,请参见tutorial page

答案 1 :(得分:0)

此代码解决了我的问题。

@font-face {
    font-family: 'Roboto-Regular';;
    src: url('/modules/mytheme/fonts/Roboto-Regular.woff') format('woff');
  }
@font-face {
    font-family: 'Roboto-Light';;
    src: url('/modules/mytheme/fonts/Roboto-Light.woff') format('woff');
}