原來在 WordPress 文章內，要展現程式碼的高亮顯示，是使用了「WP-Syntax」這個插件，效果展示如下 (Screenshot)：

程式碼展現的效果是還不錯的，但這個 Plugin 已經好幾年沒有更新了，為了新版本相容性與後續所新增各類程式語法及文件格式等高亮顯示效果，所以改選設置了這個「Code Syntax Block」插件，它是採用了「Prism Syntax Highlighter」藉此來擴展 WordPress 內對於程式碼展現的效果，同時它也開源在 Github 上以便於後續的開發維護。參考這一篇：「[WordPress] 176 種程式語言高亮標色 讓程式碼更容易閱讀 (支援Gutenberg)」，內有詳細的安裝與設定說明。

改使用「Code Syntax Block」後的程式碼展現效果對比如下：

/** 將 Tick 資料依 Interval 時間間隔組成為 OHLC Bar.
 * <param name="ticks">Ticks 型態的集合</param>            
 */

private IEnumerable<OHLCBar> generate_OHLCBar(IEnumerable<Tick> ticks)
{
    long barSizeInTicks = 5; 　　　　　　　　　　　　　　//5 secs.
    TimeSpan natural_time = new TimeSpan(8,45,0);　　   //台指期開盤時間

    var query =
        from tick in ticks
        //取得 TimeBar 的起始索引值, index 值必須為整數
        let barIndexForDay = 
             Convert.ToInt32((tick.Timestamp.TimeOfDay.Subtract(natural_time)).TotalSeconds / barSizeInTicks)

        // Calculate the begin-time of the bar associated with a tick.
        // For example, turn 2011/04/28 14:23.45 
        // into 2011/04/28 14:20.00, assuming 5 min bars.

        let barBeginDateTime = 
              tick.Timestamp.Date.Add(natural_time).AddSeconds(barIndexForDay * barSizeInTicks)

        // Produce raw tick-data for each bar by grouping.
        group tick by new { barBeginDateTime, tick.Symbol } into tickGroup
        orderby tickGroup.Key.barBeginDateTime

        // Order prices for a group chronologically.
        let orderedPrices = tickGroup.OrderBy(t => t.Timestamp).Select(t => t.Price)

        select new OHLCBar()
        {
            Symbol = tickGroup.Key.Symbol,
            OPEN = orderedPrices.First(),
            CLOSE = orderedPrices.Last(),
            HIGH = orderedPrices.Max(),
            LOW = orderedPrices.Min(),
            BeginTime = tickGroup.Key.barBeginDateTime,
            VOLUME= Convert.ToUInt32(tickGroup.Sum(t => t.volume))
        };

    return query;
}

使用了這個插件後有個問題需要調整，或者說原來 WordPress 文章內容編輯的習慣要改變。我一直都是很習慣採用 WordPress 內建的傳統文字編輯器撰寫文章內容，因為我算已很熟悉文字夾雜 html 的編排方式，如此我的純文件內容格式可以展現很簡潔的樣貌：

但這個插件 (應該說幾乎所有的程式高亮插件都一樣) 卻是需要在視覺化的編輯環境中，包括 TinyMCE、Gutenberg (古騰堡，新一代 WP 內建的編輯器)，才能完整相容程式碼高亮展現以及快速客製化它的功能設定。而如果是自行編輯 html TAG，很容易會發生顯示錯亂的問題 (主要是程式碼內如有特殊字元的關係)。

這讓我也重新省思原來用純文字撰寫帶 html 標籤文章內容已有10數年的習慣是否要改變並適應現今所謂的「區塊型視覺化編輯器」？！

這讓我很掙扎猶豫，不過直到我看到這篇：「[心得] WordPress 文章編輯請用區塊編輯器，別再用 Elementor /第三方頁面編輯器來寫文章了」，有寫網路文章的大佬也都早已改用「區塊編輯器」了。實在不用太執著純文字的編寫方式，專注在文章內容本身才是比較根本的。

所以本篇文章就是我第一次在 WordPress 所力推的「古騰堡」區塊編輯器撰寫的。是有些不太習慣，但效果覺得還是不錯，看來以後有圖文與程式碼展示的文章 (甚或所有文章) 我應該都會使用這種視覺化的區塊編輯器來撰寫。