如何引用汇流插件中的字体文件？

Question

我希望文本使用特定的字体样式，我将其CSS类指定为".title“，相关代码都在汇流插件中的CSS文件中声明，如下所示：

@font-face {
    font-family: 'Myriad Pro';
    font-style: normal;
    src: url(MyriadPro-Regular.otf) format("opentype"), local("Consolas");
}

.title {
    font-family: Myriad Pro;
}

但是插件找不到字体文件。字体文件与CSS文件位于同一个文件夹中。字体文件的url应该是什么？

Answer 1

对于Confluence Server，可以定义一个基本插件如下：

具有以下结构中的某些文件：

/your-plugin-name/
/your-plugin-name/main
/your-plugin-name/main/java
/your-plugin-name/main/resources
/your-plugin-name/main/resources/atlassian-plugin.xml
/your-plugin-name/main/resources/css/custom.css
/your-plugin-name/main/resources/fonts/MyriadPro-Regular.otf

像这样的atlassian-plugin.xml：

<atlassian-plugin key="${project.groupId}.${project.artifactId}" name="${project.name}" plugins-version="2">
  <plugin-info>
    <description>${project.description}</description>
    <version>${project.version}</version>
    <vendor name="${project.organization.name}" url="${project.organization.url}" />
  </plugin-info>

  <web-resource key="your-web-resources" name="Web Resources">

    <resource name="style.css"  type="download" location="css/custom.css" />
    <resource name="myriad.otf" type="download" location="fonts/MyriadPro-Regular.otf" />

    <!-- Adding main & global contexts means that these web resources will always be loaded. -->
    <context>main</context>
    <context>global</context>

  </web-resource>

</atlassian-plugin>

您的CSS和字体文件将在整个合流过程中全面可用。

您的CSS文件将自动加载并命名为类似于/downloads/gfdsgfdsgf/fdsgfd/me.davidsimpson.confluence.plugins.example:your-web-resources/style.css的名称，其中gfdsgfdsgf/fdsgfd是一些随机字符。

您应该能够引用您的字体文件，就像它们在css文件所在的目录中一样：

@font-face {
  font-family: 'Myriad Pro';
  font-style: normal;
  src: url(myriad.otf) format("opentype"), local("Consolas");
}

.title {
  font-family: Myriad Pro;
}

..but注意到他们有新的名字-- style.css & myriad.otf。

Answer 2

用于汇流服务器

如果您想让Consolas这样的字体在Confluence中工作，您需要确保字体安装在所有浏览器上，或者使用类似的web字体(如令人遗憾 )。

如果您对每个人都安装了正确的字体感到高兴，请添加以下内容

汇合点管理自定义的末尾

<style> body { font-family: Consolas, monaco, monospace; } </style>

如果您决定使用web字体，请将以下内容添加到

汇合点管理自定义的末尾

<link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
<style> body { font-family: Inconsolata, Consolas, monaco, monospace; } </style>

这些假设假设您想要使用Consolas字体堆栈 --如果Consolas/Inconsolata字体加载失败，将使用类似的字体。

用于会合云

您不能编辑CSS或向页面添加标记，因此这是不可能的。