为org文件增加badge

栏目: 后端 · 前端 · 发布时间: 5年前

内容简介:github项目中经常都会包含很多badge,这些badge能够很直观地展示出项目的状态来。然而大多数badge生成的站点提供的badge代码都是markdown格式的,而缺少org格式的。 比如下面是要在org文件中增加badge就必须手工将之转成org link的格式。

github项目中经常都会包含很多badge,这些badge能够很直观地展示出项目的状态来。

然而大多数badge生成的站点提供的badge代码都是markdown格式的,而缺少org格式的。 比如下面是 netlify 提供的badge代码:

[![Netlify Status](https://api.netlify.com/api/v1/badges/3b4ebb33-1ce2-4238-9a69-e4ecdafd2f1a/deploy-status)](https://app.netlify.com/sites/thirsty-pike-764a9b/deploys)

要在org文件中增加badge就必须手工将之转成org link的格式。

哪些org link会被转换成image

org并没有像markdown一样专门定义了一套语法来指明链接是图片而不是引用。

ox.el 的源代码中有这么一段注释:

;; `org-export-inline-image-p' returns a non-nil value when the link
;; provided should be considered as an inline image.

也就是说一个link是应该看成引用链接还是图片是由 org-export-inline-image-p 这个函数来决定的

然而具体到org-html转换来说,根据 ox-html 中的代码,一个org link转换成image必须满足两个方面的条件:

  1. org-html-inline-images 的值需要设置为非nil
  2. 链接要被 org-export-inline-image-p 函数识别成图片,识别的规则由 org-html-inline-image-rules 决定

相关代码如下:

((and (plist-get info :html-inline-images)
      (org-export-inline-image-p
       link (plist-get info :html-inline-image-rules)))
 (org-html--format-image path attributes-plist info))

(:html-inline-images nil nil org-html-inline-images)

(:html-inline-image-rules nil nil org-html-inline-image-rules)

org-html-inline-image-rules 的默认值为:

(defcustom org-html-inline-image-rules
  '(("file" . "\\.\\(jpeg\\|jpg\\|png\\|gif\\|svg\\)\\'")
    ("http" . "\\.\\(jpeg\\|jpg\\|png\\|gif\\|svg\\)\\'")
    ("https" . "\\.\\(jpeg\\|jpg\\|png\\|gif\\|svg\\)\\'"))
  "Rules characterizing image files that can be inlined into HTML.
A rule consists in an association whose key is the type of link
to consider, and value is a regexp that will be matched against
link's path."
  :group 'org-export-html
  :version "24.4"
  :package-version '(Org . "8.0")
  :type '(alist :key-type (string :tag "Type")
                :value-type (regexp :tag "Path")))

也就说以 .jpeg , .jpg , .png , .gif.svg 结尾的链接才会被认为是图片。

在org文件中添加badge

通过分析,我们可以知道,若badge给出的链接本身就是以 .jpeg , .jpg , .png , .gif.svg 结尾的,那么很简单,我们只需要将

[![$alt]($image_linke)](link)

转换成

#+ATTR_HTML :alt $alt
$image_link

就可以了(其中通过 #+ATTR_HTML 来为image添加alt属性).

但是对于那些不是以 .jpeg , .jpg , .png , .gif.svg 结尾的链接则似乎只能通过定义buffer local的 org-html-inline-image-rules 来实现了.

比如下面这段org代码

# -*- org-html-inline-image-rules: (("https" . "deploy-status\\'")); -*-

https://api.netlify.com/api/v1/badges/3b4ebb33-1ce2-4238-9a69-e4ecdafd2f1a/deploy-status

导出为HTML后会变成

<div class="figure">
<p><a href="https://app.netlify.com/sites/thirsty-pike-764a9b/deploys"><img src="https://api.netlify.com/api/v1/badges/3b4ebb33-1ce2-4238-9a69-e4ecdafd2f1a/deploy-status" alt="deploy-status" /></a>
</p>
</div>

github直接渲染

由于github不支持buffer local 变量,其对org的渲染也不是很完善,因此对于非 .jpeg , .jpg , .png , .gif.svg 结尾的链接似乎是没有办法显示为图片的。

但是值得指出的是,有些badge服务提供的链接是允许在最后面添加后缀的,比如 netlify 提供的badge,我可以在其图片链接后面增加 .png 也不会影响badge的生成。 因此上面那段markdonw代码我可以改写成

https://api.netlify.com/api/v1/badges/3b4ebb33-1ce2-4238-9a69-e4ecdafd2f1a/deploy-status.png

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

互联网创业核心技术:构建可伸缩的web应用

互联网创业核心技术:构建可伸缩的web应用

【美】Artur Ejsmont / 李智慧、何坤 / 电子工业出版社 / 2016-12 / 89

可伸缩架构技术是所有互联网技术中最重要,也是最引人入胜的技术。《互联网创业核心技术:构建可伸缩的web应用》针对互联网创业需求快速迭代,业务快速发展,短时间内用户、数据、访问量激增的特点,提纲挈领地描述了伸缩性架构的基本原理与设计原则,详细阐述了Web应用前端层、服务层、数据层的可伸缩架构,并花大量篇幅讲述了缓存技术和异步处理技术的可伸缩设计及其在Web系统中的具体应用。 《互联网创业核心技......一起来看看 《互联网创业核心技术:构建可伸缩的web应用》 这本书的介绍吧!

HTML 压缩/解压工具
HTML 压缩/解压工具

在线压缩/解压 HTML 代码

CSS 压缩/解压工具
CSS 压缩/解压工具

在线压缩/解压 CSS 代码

MD5 加密
MD5 加密

MD5 加密工具