【问题标题】:using font awesome in Docbook generated HTML在 Docbook 生成的 HTML 中使用很棒的字体
【发布时间】:2015-05-04 21:02:57
【问题描述】:

我应该采取什么步骤在 docbook xml 文件中创建一个占位符,它将在生成的 HTML 输出中使用字体真棒字体。 寻找在从 DocBook 生成的 HTML 输出中使用字体真棒字体的 xslt 示例。

【问题讨论】:

  • 实际上,我认为我想要采取的方法是为所有代表出色字体的 unicode 字符创建一个实体文件,然后从 xml 标头中的 DOCTYPE ENTITY 语句中引用该实体文件。目前,字符在输出中显示为 # 磅符号。猜想我需要向自定义 xsl 层添加一些东西,以转换为正确的真棒图标,不确定。有什么想法吗?
  • 您还需要指定 FontAwesome 字体系列。要做到这一点而不改变周围的字体,你最终还是要添加一个跨度。如果你使用实体引用,不妨将整个标记放在实体中:<!ENTITY cake "<i class='fa fa-birthday-cake'></i>">(别忘了你还需要 FontAwesome 字体,这样才能解析 font-family。)
  • 感谢您提供的信息,它让我更接近,但是 docbook 验证和 xsl 文件不允许 i 元素。看来我需要在 docbook xsl 输出的 HTML 中查找哪些 docbook 元素和属性将转换为 i 元素和 class 属性,或者尝试自定义 xsl。
  • 如果我使用 Dec hex 或 html unicode,则 html 输出还包含 <和>而不是实际的字符。如果我按照您的指示使用实体语句,则标签为空 - 没有 fa class iinfo.
  • 澄清一下,无论我如何在 ENTITY 声明中表示小于和大于符号,xsl 转换后的 html 源都包含 <和>。如果我为 i 元素手动将它们更改为 ,则页面会以很棒的字体正确显示。有没有办法强制 html 输出包含 .

标签: xml xslt docbook docbook-5 docbook-xsl


【解决方案1】:

希望这个答案不是 tl;dr.如果您希望我将其分解为 3 个单独的答案,请告诉我。

选项 1

第一个选项是在实体声明中使用 HTML 标记,就像我在 cmets 中第一次提到的那样。

优点

  • XSLT 1.0 对文档样式表的 XSLT 更改极少

缺点

  • i html 元素无效,因此您的文档中会出现验证错误
  • 感觉像个黑客

您需要做什么:

  1. 将您的实体声明更改为如下所示:

    <!ENTITY fa-birthday-cake "<i class='fa fa-birthday-cake' xmlns=''></i>">
    

    这与我在第一条评论中的内容略有不同。我添加了一个空命名空间,这样i 元素就不会自动出现在默认命名空间中。

  2. head 中添加指向字体真棒css 的链接。 (我把它指向本地的字体真棒。)

    <link rel="stylesheet" href="font-awesome-4.3.0/css/font-awesome.min.css"/>
    

    为了测试我修改了frameworks/docbook/xsl/html/profile-docbook.xsl。我在match="*" mode="process.root" 模板的第460 行附近添加了link

  3. 添加模板以匹配i 元素,这样它就不会被替换。

    <xsl:template match="i">
        <xsl:copy-of select="."/>
    </xsl:template>
    

示例...

文档输入

<!DOCTYPE section [
<!ENTITY fa-birthday-cake "<i class='fa fa-birthday-cake' xmlns=''></i>">
]>
<section xmlns="http://docbook.org/ns/docbook" version="5.0">
    <title>Section Template Title</title>
    <para>birthday cake: &fa-birthday-cake;</para>
</section>

HTML 输出(使用 DocBook HTML 转换场景)

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <link rel="stylesheet" href="font-awesome-4.3.0/css/font-awesome.min.css">
        <title>Section Template Title</title>
        <meta name="generator" content="DocBook XSL Stylesheets V1.78.1">
    </head>
    <body bgcolor="white" text="black" link="#0000FF" vlink="#840084" alink="#0000FF">
        <div class="section">
            <div class="titlepage">
                <div>
                    <div>
                        <h2 class="title" style="clear: both">
                        <a name="d56e3"></a>Section Template Title</h2>
                    </div>
                </div>
                <div></div>
                <hr>
            </div>
            <p>birthday cake: <i class='fa fa-birthday-cake'></i></p>
        </div>
    </body>
</html>

渲染 HTML

选项 2

第二个选项是在实体声明中使用 font awesome 类,并使用带有特殊 role 属性的 symbol 元素来保存引用。

优点

  • XSLT 1.0 对文档样式表的 XSLT 更改极少
  • symbol 是一个 DocBook 元素,因此您不应该遇到验证问题

缺点

  • symbol 可能并非在您需要使用字体真棒图标的所有地方都可用
  • 感觉像 symbol 的一个 hacky 用法(但可能不像第一个选项那么 hacky)

您需要做什么:

  1. 将您的实体声明更改为如下所示:

    <!ENTITY fa-birthday-cake "fa-birthday-cake">
    
  2. head 中添加指向字体真棒css 的链接。 (我把它指向本地的字体真棒。)

    <link rel="stylesheet" href="font-awesome-4.3.0/css/font-awesome.min.css"/>
    

    为了测试我修改了frameworks/docbook/xsl/html/profile-docbook.xsl。我在match="*" mode="process.root" 模板的第460 行附近添加了link

  3. 添加模板以匹配symbol 元素与'fa'role 并输出i。 (d 绑定到 profile-docbook.xsl 中的 http://docbook.org/ns/docbook 命名空间)

    <xsl:template match="d:symbol[@role='fa']">
        <i class="fa {.}"></i>
    </xsl:template>
    

示例...

文档输入

<!DOCTYPE section [
<!ENTITY fa-birthday-cake "fa-birthday-cake">
]>
<section xmlns="http://docbook.org/ns/docbook" version="5.0">
    <title>Section Template Title</title>
    <para>birthday cake: <symbol role="fa">&fa-birthday-cake;</symbol></para>
</section>

HTML 输出(使用 DocBook HTML 转换场景)

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <link rel="stylesheet" href="font-awesome-4.3.0/css/font-awesome.min.css">
        <title>Section Template Title</title>
        <meta name="generator" content="DocBook XSL Stylesheets V1.78.1">
    </head>
    <body bgcolor="white" text="black" link="#0000FF" vlink="#840084" alink="#0000FF">
        <div class="section">
            <div class="titlepage">
                <div>
                    <div>
                        <h2 class="title" style="clear: both">
                        <a name="d56e3"></a>Section Template Title</h2>
                    </div>
                </div>
                <div></div>
                <hr>
            </div>
            <p>birthday cake: <i class='fa fa-birthday-cake'></i></p>
        </div>
    </body>
</html>

渲染 HTML

选项 3

第三个选项是切换到 XSLT 2.0 并使用xsl:character-map

优点

  • 简单的概念
  • 在 docbook 实例或实体声明中不需要额外的标记
  • 感觉很好(不是 hacky)

缺点

  • XSLT 2.0 因此需要使用 2.0 处理器
  • 更改为 2.0 处理器后,可能会有其他 XSLT 更改。 (例如,在我的测试中,我必须删除 profile-docbook.xsl 中的 3 个 exslt:node-set() 使用。)

您需要做什么:

  1. 让你的实体声明看起来像这样(基于你的其他问题https://stackoverflow.com/questions/30055181/how-do-i-insert-fonts-as-an-entity-in-docbook):

    <!ENTITY fa-birthday-cake "&#xf1fd;">
    
  2. head 中添加指向字体真棒css 的链接。 (我把它指向本地的字体真棒。)

    <link rel="stylesheet" href="font-awesome-4.3.0/css/font-awesome.min.css"/>
    

    为了测试我修改了frameworks/docbook/xsl/html/profile-docbook.xsl。我在match="*" mode="process.root" 模板的第460 行附近添加了link

  3. xsl:stylesheet 版本更改为2.0。

  4. 导入xsl:character-map

    <xsl:include href="font-awesome.xsl"/>
    

    我已经包含了一个示例“font-awesome.xsl”。我今天 (2015-05-06) 有了基于 font-awesome 备忘单的完整版本。添加全部内容会使我的答案超过字符限制;如果您需要,请告诉我。

    <xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
        <xsl:character-map name="fa">
            <xsl:output-character string="&lt;i class='fa fa-birthday-cake'&gt;&lt;/i&gt;" character="&#xf1fd;"/>
        </xsl:character-map>
    </xsl:stylesheet>
    
  5. xsl:output 中引用字符映射(带有use-character-maps)。

    <xsl:output method="html" encoding="ISO-8859-1" indent="no" use-character-maps="fa"/>
    
  6. 可能的其他更改。

    如“缺点”部分所述,您可能需要根据您使用的处理器对 docbook 样式表进行一些更改。我使用了 Saxon-HE 9.5.1.3。我通过复制 DocBook HTML 转换场景并更改处理器来做到这一点。

示例...

文档输入

<!DOCTYPE section [
<!ENTITY fa-birthday-cake "&#xf1fd;">
]>
<section xmlns="http://docbook.org/ns/docbook" version="5.0">
    <title>Section Template Title</title>
    <para>birthday cake: &fa-birthday-cake;</para>
</section>

HTML 输出(使用修改后的 DocBook HTML 转换场景)

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <link rel="stylesheet" href="font-awesome-4.3.0/css/font-awesome.min.css">
        <title>Section Template Title</title>
        <meta name="generator" content="DocBook XSL Stylesheets V1.78.1">
    </head>
    <body bgcolor="white" text="black" link="#0000FF" vlink="#840084" alink="#0000FF">
        <div class="section">
            <div class="titlepage">
                <div>
                    <div>
                        <h2 class="title" style="clear: both">
                        <a name="d56e3"></a>Section Template Title</h2>
                    </div>
                </div>
                <div></div>
                <hr>
            </div>
            <p>birthday cake: <i class='fa fa-birthday-cake'></i></p>
        </div>
    </body>
</html>

渲染 HTML

【讨论】:

  • 这听起来很棒。我认为这是很多公司酒吧部门可以使用的东西。我想要一份您的 font-awesome.xsl 文件的副本。我还使用 docbook 文字元素对选项 2 进行了试验,但我认为它也可能对可以使用的位置有限制。我明天会试试这个。再次感谢。
  • @JeffCunningham - 如果你给我发一封电子邮件 (dhaley77 gmail) 我会发给你的。
  • 好的,从 jeffcc 向您发送了电子邮件。谢谢
  • @JeffCunningham - 你能做到吗?如果这个答案足够,请考虑accepting it
  • 这是我现在要做的,直到我们转向 XSLT 2.0 处理器。实体声明:&lt;!ENTITY fa-beer "&lt;markup role='fa fa-beer'&gt;&lt;/markup&gt;"&gt; 在 xml 文件中:&lt;para&gt;&amp;fa-beer; Assistant&lt;/para&gt; 在 xsl 文件中:&lt;xsl:template match="d:markup[@role]"&gt; ` ` &lt;/xsl:template&gt; HTML 输出:&lt;span class="fa fa-beer"/&gt;
猜你喜欢
  • 1970-01-01
  • 2018-04-09
  • 1970-01-01
  • 2016-02-13
  • 2022-01-07
  • 1970-01-01
  • 2020-05-28
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多