我一直使用github頁面jekyll用於使用markdown文檔自動生成我的博客。Jekyll取消隱藏Github頁面上的參考樣式鏈接

我想使用引用樣式的鏈接，然後顯示頁面底部的鏈接列表。

基本上，我希望參考樣式的鏈接打印在頁面上，默認情況下它們是隱藏的。

這個想法是有一個引用列表，讀者可以參考以獲取更多信息。

例如，下面的文字：

# some header 
...some body text in the blog with a link to [wikipedia][1] 
... 
... 
# reference links 
[1]: https://www.wikipedia.org

應該生成以下的輸出：

一些頭

...與博客中的一些正文鏈接到wikipedia ... ...

個

參考鏈接

[1]：https://www.wikipedia.org

如圖所示，參考式鏈接在markdown使用，但它也被顯示在頁面上。

以前的「正確」輸出是通過複製每一行並轉義特殊字符來實現的，但這似乎有點多餘。

這可以通過更改爲_config.yml或使用ruby來實現嗎？其他選項也很受歡迎（css魔法？）。

tldr;我想要一種方法來「取消隱藏」我的markdown頁面底部的參考樣式鏈接。

來源

2016-09-20 Nathan McCoy

Jekyll和unHyde :)我認爲你必須使用CSS來覆蓋並顯示它們'display：block' – jrbedard

我不知道我關注。看着html，似乎沒有任何東西可以顯示，有沒有辦法在文件末尾生成它們？ –

首先，你要了解什麼是做什麼的：

你降價解析器轉換您的降價成html。
傑基爾正在把這個html組織成頁面。
GitHub頁面正在提供這些html頁面。
客戶端讀取HTML和執行任何JavaScript等

的問題是，降價分析器不包括在頁面底部的參考鏈接。這不像他們在那裏，但隱藏。他們根本就不在那裏。所以你不會找到一個CSS解決方案，因爲沒有任何風格。你可以可能能夠實現這一點與自定義降價解析器，其中包括生成的HTML中的引用鏈接，但這不會與GitHub頁面一起工作，並可能會相當hackish。

另一種選擇是執行JavaScript，使用document.links獲取頁面上的每個鏈接，然後在頁面底部輸入<ul>或其他東西。喜歡的東西this：

var links = document.links; 
for(var i = 0; i < links.length; i++) { 
    var linkHref = document.createTextNode(links[i].href); 
    var lineBreak = document.createElement("br"); 
    document.body.appendChild(linkHref); 
    document.body.appendChild(lineBreak); 
}

你可能會限制爲僅包含在某個DIV鏈接（如this），這樣你就不必解析出您的導航鏈接和諸如此類的東西。您還必須考慮訂單。

另一種選擇可能是將它們作爲一個XML列表包含在每個帖子的前端，然後在顯示該帖子的佈局中顯示它們。

當然，您也可以使用markdown簡單地創建引用。

來源

2016-09-21 18:29:03

'這不像他們在那裏，但隱藏。他們根本就不在那裏。「我確實在HTML中注意到了這一點，並開始探索更多。我將不得不定製一個自定義解析器。謝謝您的幫助。 –

@NathanMcCoy沒問題。請注意，自定義降價引擎不適用於GitHub頁面。這聽起來像是一個脖子上的痛苦發展，但也許你比寫我更傾向於寫降價引擎。如果我是你，我會首先嚐試JavaScript選項，然後選擇frontmatter選項，如果這樣做不起作用，並且如果這兩者都不起作用，我可能只是自己編寫參考。但無論如何，我祝你好運！ –

Jekyll取消隱藏Github頁面上的參考樣式鏈接

一些頭

參考鏈接

回答

相關問題