rayhy

hugo 中的函数 replaceRE 用处很多!

  •  
  •   rayhy · Mar 2, 2019 · 1575 views
    This topic created in 2651 days ago, the information mentioned may be changed or developed.

    偶然看到一篇博客: https://www.junian.net/hugo-image-figure-wrap/

    可以用 replaceRE 把 Markdown 转换得到的 HTML 中的 img 标签变成 figure 标签:

    <p><img src="https://www.example.com/image.png" alt="Alt Text" title="Title Text"></p>
    

    变为

    <figure>
      <img src="https://www.example.com/image.png" alt="Alt Text" title="Title Text">
      <figcaption>Alt Text</figcaption>
    </figure>
    

    我按它的思路,顺手改了下我博客的主题代码,可以把图片的 src 由本地地址变为图床上的地址:

    src原来是ranked_results.jpg,现在是https://图床 HOST/img/blog/ReID 任务中的 CMC 和 mAP/ranked_results.jpg。省的自己在 Markdown 文件中改了。感觉蛮方便的。

    上面这个功能最关键的代码是

    {{ $reAltIn := "<img src=\"([^\"/]+)\" alt=\"([^\"]+)\" />" }}
    {{ $reAltOut := (printf "<img src=\"%s%s$1\" alt=\"$2\">" .Site.Params.CDN.Host .Dir )}}
    {{ $altContent := .Content | replaceRE $reAltIn $reAltOut | safeHTML }}
    

    replaceRE+斟酌半天的正则=奇巧淫计

    2 replies    2019-03-04 11:24:06 +08:00
    rayhy
        1
    rayhy  
    OP
       Mar 2, 2019
    甚至可以实现用![ALT text@200]( https://www.example.com/image.png)来指定图片的宽度为 200,就看你 replace 时怎么写了。
    codehz
        2
    codehz  
       Mar 4, 2019 via Android
    正则写得爽,修改火葬场
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   3609 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 31ms · UTC 10:33 · PVG 18:33 · LAX 03:33 · JFK 06:33
    ♥ Do have faith in what you're doing.