highlight.js 標示程式碼上色、高亮工具

想在網頁秀出程式碼對應不同的程式語言、標示不同顏色,只需要透過highlight.js就能輕鬆標示上色,highlight.js目前擁有176種不同程式語言對應以及76種不同樣式能夠使用,對於一些目前正在整理網站語法的人來說highlight.js在執行上能夠更短時間簡單的整合。

網站名稱:highlightjs
網站網址:https://highlightjs.org/

使用方法很簡單:只需要在網頁內連結 highlight.js 的 js及 style 檔案或者使用 highlight.js 的 cdn 在 </head> 內加入。

以 cdn 方式作為示範,只需要將下列兩段語法放置 </head> 以內

<link rel="stylesheet" target="_blank" rel="noopener" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>

使用方法

<pre><code>/*放入程式碼*/</code></pre>

php 範例

<?php
//移除閱讀//點選時時產生滑動定位//
function remove_more_link_scroll( $link ) {
$link = preg_replace( '|#more-[0-9]+|', '', $link );
return $link;
}
add_filter( 'the_content_more_link', 'remove_more_link_scroll' );
?>

相關文章
作者簡介
個人頭像照片
努力寫文中!