2022 年 9 個最佳 WordPress 代碼片段和語法熒光筆插件(2022 年)
已發表: 2022-05-28為您的網站尋找最好的 WordPress 語法高亮插件?
考慮到所有 Syntax Highlighter WordPress 插件要求,我們創建了這個最佳 WordPress 插件列表,以節省您的時間和金錢。 這些插件不僅僅是為了美觀:它們還提供許多功能和插件來提高您網站的性能。 所有流行的 WordPress 模板都與這些插件兼容。
我們策劃的這個語法熒光筆插件列表旨在幫助您選擇最佳插件。 此外,還有一些插件可用於 WordPress 代碼塊、WordPress 語法高亮塊、顯示代碼片段、WordPress 代碼格式化和 WordPress HTML 編輯器。
適用於 WordPress 的最佳代碼片段和語法熒光筆插件
- 啟蒙插件
- 語法高亮代碼塊插件
- 蠟筆語法熒光筆插件
- Urvanov 語法熒光筆插件
- WP Githuber MD 插件
- CodeMirror 塊插件
- 棱鏡插件
- 主題/插件編輯器插件的語法熒光筆
- 我的語法熒光筆插件
2022 年的語法高亮 WordPress 插件:
啟蒙插件
可自定義的 WordPress 語法高亮插件
使用名為 Enlighter 的直觀界面編輯博客或網站代碼時,您可以使用簡碼自動顯示。
Enlighter 是一個簡碼突出顯示工具,任何人都可以輕鬆使用,並允許他們在使用您網站上的代碼時突出顯示簡碼。
簡而言之,簡碼是一種特定於 wordpress 的代碼,它使您能夠在內容中手動執行特定功能,而無需了解 WordPress 源代碼。
基本上,短代碼為您提供內容中的功能,而無需了解 WordPress 源代碼的特定知識。
除了文件,短代碼還可以包含對象,這提供了僅使用幾行代碼來創建對象的可能性,而無需大量的專門編碼。
具有實時預覽模式的主題客戶允許用戶自動修改底層主題。 它還自動創建選項卡窗格,以邏輯方式顯示代碼組,例如 HTML+CSS+JS。
為了確保 WordPress 可視化編輯器插件及其支持通過 WordPress 網站的前端和後端完全集成,Enlighter 提供對這兩個插件的支持作為其支持服務的一部分。
您可以為每個表格片段創建單獨的選項卡,所有表格片段將作為一個組一起顯示在一個組中 TinyMCE 是最常用的 WordPress 插件之一,用於將響應式表格集成到帖子和頁面中。
如果將 Enlighter 插件與語法高亮代碼塊插件進行比較,則此插件可能無法在緩存設置中使用。 您必須確保從緩存設置中排除此插件。
使用 Enlighter 插件的高級版,您需要支付 19.00 美元,而精簡版是免費的。
主要特徵:
- 與經典編輯器 TinyMCE 完全兼容
- 突出顯示與文本內聯的句法結構
- 選項頁面提供高級配置選項
- 完全集成古騰堡編輯器
- 強大的高亮引擎,具有通用語法高亮功能,適用於未知語言
- 簡單的步驟指導您自定義主題
- 支持所有常用語言
隨機評論:
- 與 bbPress 配合得很好,總體上看起來像一個很棒的熒光筆。 我已經使用 syntaxhighlighter 進化了很長時間(據我所知,它不適用於 bbPress),並且對這個插件的多功能性感到驚喜! 感謝您提出來。
- 一段時間以來,我一直在尋找一個好的片段插件。 多謝。 它只是錯過了限制顯示行數的能力。 這是我的解決方法。 在外觀 > 自定義 > 附加 CSS 添加這些行 .enlighter-default{ max-height: 600px; 溢出:自動; }
截屏:
語法高亮代碼塊插件
WordPress 的語法高亮代碼塊
語法高亮代碼塊可以成為流行的代碼語法塊插件的一個很好的替代品,因為它通過使用語法高亮以與代碼語法塊相同的方式突出顯示您的代碼塊。
該插件在加載後立即呈現,從而創建了一個動態且響應迅速的網站。 亮點 JavaScript 是該插件的重要組成部分,有助於開發更具響應性的網站。
頁面右側有用於更改語言、突出顯示、行號和代碼換行的選項。 該插件允許您插入標準的 WordPress 代碼塊,然後粘貼您的代碼。
在設置面板中,您可以指定應在編輯器中突出顯示哪些行,您的代碼塊將自動突出顯示這些行。 這使您可以在打開編輯器時查看準確突出顯示的行。
語法高亮代碼塊不是從 WordPress 塊編輯器中選擇配色方案,而是由 WordPress 主題定制器控制。
因此,Code Block 中的語法高亮兼容 highlight php 支持的所有語言,總共支持 185 種語言。 該插件也可以自動檢測代碼塊中包含的語言。
我相信這個自動檢測功能是該插件的最大優勢之一,對於那些已經使用代碼塊來共享多種不同語言代碼的人來說,它極具吸引力。
語法高亮代碼塊插件免費。 這是免費的!
主要特徵:
- 此應用程序支持幾乎所有語言
- 為自動換行過程提供支持
- 強調代碼中的某些代碼行
- 如果插件停止維護,本機代碼塊不會進行內容轉換
- 你可以看到每個段落的行號
隨機評論:
- 使用 WordPress 現有的代碼塊,它利用了大量的語言,您可以顯示行並對代碼的某些部分進行更改。 哇,我需要的一切! 而且沒有什麼可配置的!
- Gutenberg 塊插件有助於共享代碼。 謝謝!
截屏:
蠟筆語法熒光筆插件
WordPress 代碼格式化插件
它旨在安裝、設置和微調 WordPress 中的語法熒光筆; 它還包含一個主題編輯器,允許您調整其設置。
因此,我們現在為您提供了可用於 WordPress 的最流行和最廣泛使用的語法熒光筆,那就是 Crayon Syntax Highlighter。
借助適用於 WordPress 的卡通語法熒光筆,您可以創建標籤、突出顯示線條並獲得有關 WordPress 網站內容的即時反饋。
因為與 WordPress URL 和帖子熒光筆合併的 HTML 編輯器提供了一個部分,可以在其中突出顯示此處文本的關鍵部分,您將能夠快速輕鬆地突出顯示這篇文章中文本的關鍵部分。
此外,WordPress HTML 編輯器使您可以使用 HTML 代碼撰寫帖子,這使您可以在撰寫文章時預覽突出顯示的內容,並且 HTML 編輯器還提供使用 CSS 代碼編寫的選項。
您會在我們的 HTML 編輯器中發現可以使用許多功能來增強您的網站。 使用簡碼、更改字體樣式、從其他網站複製和粘貼代碼以及許多其他功能來幫助增強您的網站。
使用 Crayon Syntax Highlighter,您還可以根據自己的喜好通過更改顏色、字體大小甚至容器大小來更改主題,以便您可以根據自己的喜好突出顯示選定的文本。
此外,您可以根據需要選擇使用您希望的任何編程語言進行編程。
另外我們應該提到,據報導,與 Urvanov 語法熒光筆插件相比,蠟筆語法熒光筆插件會對您網站的評論部分產生負面影響。
Crayon Syntax Highlighter 插件價格包括 12 個月的免費支持。
主要特徵:
- 在句首添加換行符
- 一支蠟筆可用於以多種語言突出顯示
- 可以通過對左側面板中的行編號來重新排列佈局
- 代碼將在彈出窗口的新窗口中打開
- 明文編碼可以通過開關打開和關閉
- 將代碼粘貼或複製到瀏覽器中
隨機評論:
Urvanov 語法熒光筆插件
Crayon Syntax Highlighter WordPress 插件的轉世
Urvanov Syntax Highlighter 有自己的塊,具有幾個有用的功能以及對 WordPress 經典編輯器的支持。
許多功能可確保 Urvanov 語法熒光筆滿足您的個人需求,包括選擇顏色方案、字體系列、字體大小和行高的能力。
此外,插件提供了設置最大框寬、高和邊距的選項。 除了代碼框之外,該工具箱還包含一個有用的工具欄,例如,它允許您繪製編號為 1 到 9 的線條、換行和使用條紋單元格。
您可能會喜歡 Urvanov Syntax Highlighter 的原因有很多,包括它的主題編輯器,它允許複製、修改任何主題並將其保存為您獨有的東西。
可以用 19 種不同的方式突出顯示字符串和文本,並且您可以自定義框架、行、行號和工具欄等不同的功能來控制代碼框。 您還可以命名您的主題並提供簡要說明。
設置頁麵包含範圍廣泛的選項,例如能夠編輯代碼、標籤、語言、文件等。還可以記錄錯誤。
您可能會認為沒有選項,因為當您將 Urvanov Syntax Highlighter 塊插入內容區域時,它在屏幕右側顯示為空。
由於設置選項卡只能通過單擊塊來訪問,因此只能通過單擊塊本身來完成。
沒有任何專業版或高級版的免費插件。
主要特徵:
- 使用集成的主題編輯器編輯主題
- 打開或關閉純代碼
- 標籤編輯器在可視化編輯器和 HTML 編輯器中都可用
- 遠程請求的對象緩存
- 打開和關閉行數
- 打開代碼的彈出窗口
- 複製或粘貼代碼
隨機評論:
- 非常感謝 Fedor 將 Crayon 的功能歸還給我們,沒有任何內容更改或 PHP 更新。
- 非常感謝您對蠟筆插件的轉世。 多年來我一直使用蠟筆插件,但它已被廢棄並且不再有效。
視頻:
WP Githuber MD 插件
WordPress 降價編輯器
WP Githuber MD 帶有強大的降價編輯器和有用的語法高亮工具。 它與帖子、頁面和自定義帖子類型兼容,並檢測降價內容以防止加載額外的腳本。
Markdown 設置頁面中提供了多種配置選項,包括設置寫作、元框和 Markdown 編輯器。
其他可用選項包括阻止修訂和自動保存、啟用拼寫檢查、顯示 HTML 到 Markdown 轉換器小部件以及顯示行號。
實時預覽使您能夠查看您的網站在前端的顯示方式。 此功能將 Markdown 編輯器拆分為兩個窗格,因此您可以從前端看到它的外觀
在模塊設置頁面中可以配置 11 個不同的模塊。 每個模塊都有一個示例,但請記住,如果未在模塊設置頁面中啟用該模塊,降價編輯器將無法使用該模塊。
如果在您的站點上激活了 Githuber MD,則會出現一個新的塊編輯器,其中包含“啟用 Markdown”選項。 通過選擇此選項,將修改經典編輯器以支持所有降價選項。
對於那些只對在其網站前端突出顯示代碼感興趣的人來說,有時 WP Githuber MD 可能太過分了。 它具有許多您不太可能使用的功能和設置。
那些使用附加格式和降價功能的人會發現它們非常有用,因為它可以讓他們更改其網站上的代碼、文本和媒體的外觀。
這是一項免費服務。 您無需為此付費。
主要特徵:
- 根據您的搜索歷史建議關鍵字的在線工具
- 帖子類型可以定制以滿足您的需求
- 一個將 HTML 轉換為 Markdown 的工具
- 複製圖像並將其粘貼到新窗口中
- 正在從服務器獲取遠程圖像
- 提供對 Markdown 語法擴展的支持
- 可以為單個帖子啟用或禁用 Markdown
- 支持古騰堡編輯器
- 提供類似於 Github 中的 Markdown 任務列表
隨機評論:
- 既然效果很好,我很想重寫我以前在 MD 中的所有帖子。 該話題由 keithkhl 於 11 個月, 1 週 前 修改。
- 降價插件是經過深思熟慮的。 它非常易於使用,功能也非常豐富。
- 我很想給它五顆星,但開發人員決定應該解釋所有 URL 文本。 這與 Markdown 不一致,並破壞了將 YouTube URL 轉換為視頻的 WP 功能。 我想,所有嵌入功能也是如此。
截圖和視頻:
CodeMirror 塊插件
顯示 WordPress 插件的任何程序的格式化代碼
CodeMirror Blocks 語法高亮工具易於使用,與 CodeMirror Javascript 庫完全集成,並支持 100 多種編程語言。
該工具包括 56 種配色方案,並且與經典編輯器兼容。 但是,某些附加選項在經典編輯器中不可用。
每個代碼塊都有自己的樣式、功能和選項設置,您可以在塊級別為每個代碼塊自定義設置。
此外,您可以自定義插件的設置,您可以在其中設置語言、主題和行號的默認值,以及行突出顯示、換行和代碼編輯等功能。
同樣,代碼上方的控制面板也可以自定義顯示語言或文件名。 還可以通過控制面板訪問全屏和復制功能。 HTML、CSS 和 JavaScript 也可以通過控制面板執行。
正如您在插件設置頁面上看到的,還有一個塊設置面板,您可以在其中更改代碼框設置。 我喜歡這種方法,因為每個代碼框都可以根據自己的喜好進行定制。
該應用程序的配色方案是其最令人印象深刻的功能之一。 但是,添加全屏選項最有幫助。
在處理大量代碼時,使用全屏功能可以消除所有乾擾並清晰地查看它們。
CodeMirror Blocks 最令人印象深刻的功能之一是它易於使用、高度可定制,並支持多種編程語言和配色方案。
有一個免費插件支持論壇。
主要特徵:
- 使用嚴格的編碼標準清晰和安全的代碼
- 從語言選擇菜單中選擇編程語言
- 可以使用此選項打開或關閉行號
- 支持至少 100 種編程語言,所有這些語言都是客戶最需要的
- 適用於 WordPress 的所有默認主題
- 瀏覽器兼容性確保無論使用何種瀏覽器都能流暢運行
- 提供許多選項的簡單界面
- CodeMirror 生成的文件僅在需要時加載
- 共提供56個主題
隨機評論:
- Vicky,我明白你為什麼想要這個插件了。 但是,沒有折疊功能。
- 感謝您創建此插件。 瀏覽了好幾本,這是目前為止最好的。 如果可以將在線支持添加到 Vivek,那就太好了,比如 Enlightener。 再次感謝!
- 我希望支持 CSS 和 JS 代碼預覽。
截屏:
棱鏡插件
代碼片段演示 WordPress 插件
您可以使用 Prismatic WordPress 插件的設置部分來設置代碼片段在 WordPress 網站上的顯示方式。 它是 Automattic 提供的工具之一,可讓您在 WordPress 網站上顯示代碼片段。
該擴展包括八種不同的配色方案和一個界面,可讓您通過突出顯示行、顯示行號、顯示語言以及使復制和粘貼更容易的插件來查看更改的顯示方式。
此外,您不僅可以使用它來限制其僅用於您網站的帖子和頁面,還可以在後端轉義代碼。 代碼在前端自動轉義,但您也可以在後端進行。
如果您選擇 Primmatic 插件,您可以從 50 多種編程語言中進行選擇,還可以使用塊編輯器或經典編輯器,甚至是轉義碼將摘錄、評論甚至評論中的評論插入帖子中。
除了 Prismatic 塊之外,PrismJS 和 HighlightJS Javascript 庫會自動應用於代碼; 因此,顏色方案會自動更新為 Pre 和 Code 部分的 CSS 類。
此外,需要應用特定元素的 CSS 類,例如行號,然後將 CSS 類複製到剪貼板。 這是我起初不熟悉的東西,假設它們會自動應用。
如果您想了解更多信息,您可以通過閱讀官方說明並訪問 Prismatic 插件頁面獲取更多信息。更多信息,您可以通過閱讀官方說明並訪問 Prismatic 插件頁面獲取更多信息
除了突出顯示語法外,Prismatic 還提供對各種配色方案的訪問。 該程序對 HTML 標記、預塊、代碼塊和 HTML 標記的支持對於任何有興趣快速更改現有內容的人來說應該是非常有吸引力的。
使用這個插件是免費的。 這是免費的。
主要特徵:
- 有超過 60 種不同的編碼語言可供選擇
- 帶有八種不同的主題供您選擇
- 以智能方式使用 CSS 和 JS 資產
- 代碼轉義可以以細粒度的方式進行控制
- 突出顯示具有單行和多行語法的代碼
- 添加一個 Gutenberg 塊,允許您將代碼片段添加到頁面
- 帖子內容、摘錄和評論中的代碼亮點
- 使用 TinyMCE 或 Visual 按鈕將代碼片段添加到您的項目
- 只允許文章和頁面的語法高亮
隨機評論:
- 易於安裝,易於配置,開箱即用。 您可以輕鬆地將簡碼集成到帖子和頁面中,顏色主題令人驚嘆,插件快速輕便。 它不會減慢網站加載時間。
- 過去,我使用了一堆語法高亮插件,但它們都運行不佳或根本不起作用。 如果您需要將代碼片段添加到 WordPress 帖子或頁面,那麼 Prismatic 是一個不錯的選擇。
- 清潔且易於使用。 該插件正是我們需要的。
截屏:
主題/插件編輯器插件的語法熒光筆
默認主題和插件源代碼編輯器替換插件
Syntax Highlighter for Theme/Plugin Editor Plugin for WordPress 用更直觀的高級編輯器替換了主題和插件的默認編輯器,並為使用它的人提供了許多好處。
它是一個易於安裝、易於使用且設計直觀的插件。 插件的設置頁面上有一個選項,您只需單擊一個按鈕即可選擇 36 種不同的顏色。
此外,它還允許設置行號、選擇主行號、定義要在選項卡中顯示的字符數以及配置要在列中顯示的字符數。
同樣在此頁面上,您可以預覽您選擇的配色方案和設置。如果您願意,您還可以直接在您的網站內編輯 WordPress 主題或插件來測試插件。
如果您經常對網站的主題和插件執行手動編輯,您可能會發現此 WordPress 代碼格式化插件很有用如果您經常對您的網站主題和插件執行手動編輯,此插件可能很有用。
您還可以測試字符串定位器,這是一個在主題、插件和 WordPress 核心中搜索文檔和文件的插件,除了語法高亮。
為主題/插件編輯器推薦 Syntax Highlighter 很容易,但您應該知道,不建議直接在您的網站主題和插件上進行編輯。 如果這樣做,您的網站可能會崩潰,並且您的安全性可能會受到威脅。
不建議在實時環境中使用 WordPress 主題和插件編輯器,因為它們應保留用於測試目的。
不收取任何費用。 這是免費的。
主要特徵:
- RTL 與從右到左的技術兼容
- 界面非常人性化,並提供了很多選項
- 編輯器允許您在文本中放置縮進的製表符
- 支持當前可用的所有 WordPress 主題
- 在 Web 瀏覽器中突出顯示代碼語法
- 可根據您想要的心情從 36 種不同的主題中選擇配色方案
- 安全代碼,基於清晰簡潔的編碼標準
- 所有現代瀏覽器都支持跨瀏覽器兼容性,因此它可以與其中任何一種兼容
隨機評論:
- 當我查看了許多可用的主題編輯器插件的描述時,我選擇了這個首先嘗試。 因為行號是一個很好的功能,它允許我通過 Firefox 的工具查看為我的網頁生成的代碼,並直接導航到行為不端的行。 用於故障排除的絕佳工具!
- Arthur Gareginyan,感謝您提供有用的插件! 其他插件不會突出顯示 /wp-admin/theme-editor.php?file=style.css 的語法,但您的插件會突出顯示! 感謝作者為 WordPress 提供的最佳語法高亮插件!
截屏:
我的語法熒光筆插件
在 Pages 插件中安全地嵌入語法突出顯示的源代碼
JavaScript 語法高亮工具 My Syntax Highlighter 使用 CodeMirror Javascript 庫來高亮語法。 它支持 36 種配色方案並使用 13 種編程語言,並且它依賴於簡碼來有效地顯示代碼片段。
對於設置的主頁,您可以為 CODE HTML 標籤指定默認語言。 這對於那些喜歡只以一種語言共享代碼的人來說可能很有用,但對於那些以多種語言共享代碼的人來說,它可能會導致格式失真。
在本節中,您還可以啟用行號,指定第一行號,在代碼前顯示美元符號,以及設置要在代碼中顯示的製表符數量
頁面底部會出現一個預覽框,以顯示您所做的更改。 此外,您可以決定代碼框的高度,並且可以將特殊字符轉換為 HTML 實體。
但是,My Syntax Highlighter 不支持其他 WordPress 語法高亮塊插件。 為了使用 My Syntax Highlighter,您必須在 16 個可用短代碼之一中輸入您的代碼。
您可能希望使用短代碼塊更改主插件設置頁面的默認設置。如果您願意,可以指定一個代碼塊,但您的選項有限。
不收費。 這是一個免費插件。
主要特徵:
- 一個記錄良好的案例研究
- 選擇您要使用的編程語言
- 應用程序的設置頁面不包含任何廣告
- 在文本中添加換行符
- 總共可以使用 125 個簡碼
- 您可以從 156 種不同的編程語言中進行選擇
- 有 64 個主題可供您選擇
- CodeMirror 文件僅在頁面需要時才加載
隨機評論:
- 該插件非常有用,並且完全按照它在錫上所說的那樣做。 做得好。
- 已經嘗試了幾種代碼熒光筆,我發現這個可以完美地滿足我的需求。 我強烈推薦它。 轉換特殊字符選項是最好的部分!
- 簡單且可擴展,了解 WordPress 和 CodeMirror。
截屏:
讓我以這樣的方式結束
最後,在上面的文字中,我們討論了最好的 WordPress Syntax Highlighter 插件。 您可以選擇其中一個插件來增強您的網站。
推薦:我們也強烈推薦我們關於最佳 WordPress 博客主題和博客最佳 WordPress 插件的文章。
此外,我們希望您能找到您需要的東西。
我們很樂意回答任何問題,因此請發表評論。 如果您有興趣幫助我們,只需在 Facebook 和 Twitter 上分享這篇文章。