您的瀏覽器不支援JavaScript功能,若網頁功能無法正常使用時,請開啟瀏覽器JavaScript狀態
Antfire 的生活雜記
Skip

    Hexo 3 在文章中使用標籤外掛

    重大變更 - 渲染流程改變

    hexo.post.render的流程在 Hexo 3 改變了,標籤外掛會等到所有的原始檔案讀取完畢之後才會開始處理,意思就是標籤外掛可以取得所有的文章資料了。

    新功能的使用方式就是在你的Markdown檔案裡面,直接下以下語法,即可轉譯成對應的HTML。

    {% post_path hello-world %}
    // /2015/01/16/hello-world/
    {% post_link hello-world %}
    // <a href="/2015/01/16/hello-world/">Hello World</a>
    {% post_link hello-world Custom Title %}
    // <a href="/2015/01/16/hello-world/">Custom Title</a>
    
    {% asset_path example.jpg %}
    // /2015/01/16/hello-world/example.jpg
    {% asset_link example.jpg %}
    // <a href="/2015/01/16/hello-world/example.jpg">example.jpg</a>
    {% asset_link example.jpg Example %}
    // <a href="/2015/01/16/hello-world/example.jpg">Example</a>
    {% asset_img example.jpg %}
    // <img src="/2015/01/16/hello-world/example.jpg">

    效果如下

    {% asset_path example.jpg %}

    {% asset_link example.jpg %}

    {% asset_link example.jpg Example %}

    {% asset_img example.jpg %}

    要做到以上效果,你必須在source/_posts底下,建立一個跟Markdown檔名一模一樣的資料夾,然後將會用到的文件/檔案丟進去。
    舉例:
    假設你的Markdown檔名為 example-post.md
    那就要建立一個名為example-post的資料夾,然後將文件/檔案丟進去

    {% asset_img [.class1.class2] file_name.png [width [height]] ["caption" ["hint"]] %}
    
    {% asset_img .class1.class2 example.jpg 800 160  "foo" "bar" %}

    如果覺得自己手動建立資料夾很麻煩的話,可以到_confog.ymlpost_asset_folder: false 改為 post_asset_folder: true,如此一來,就會在你下 hexo new post xxxx的時候,順便幫你建一個資料夾了。

    參考資料

    Breaking Changes in Hexo 3.0
    hexo-tag-asset-res

     Comments