Skip to main content

在文章中放置程式碼區塊 - Drupal CKEditor CodeSnippet 模組介紹

Submitted by admin on Tue, 12/24/2019 - 08:48

簡介

這個模組可以讓我們在文章中放置程式碼模組區塊並上色,示意如下:

<?php
  echo "Hello World!";

function foo()
{
  echo 'this is a test function';
}
?>

 

如何使用

模組網址: https://www.drupal.org/project/codesnippet

 

1. 安裝CodeSnippet插件

https://ckeditor.com/cke4/addon/codesnippet下載版本至少為4.5.11的CodeSnippet插件檔案,

把解壓縮後的codesnippet資料夾放置於[site root]/libraries底下,如果原本沒有libraries文件夾的話可以自己創建一個。

這個步驟完成後的檔案目錄長相應該是[site root]/libraries/codesnippet/...,不應該有版本號碼出現。

2.安裝Drupal CKEditor CodeSnippet 模組

看是要透過/admin/modules頁面還是composer require drupal/codesnippet 都可以,

裝上去後記得install。

3. 啟用編輯器的工具列

在 Configuration > Text formats and editors > Basic HTML (或是其他文字格式)裡面,把代表codeSnippet的按鈕從Available buttons拖曳到Active toolbar底下。

drupal code snippet module drag toolbar icon

拖曳完成後應該可以看到下面的plugin setting欄位出現了語言設定,按下save就可以使用了。

plugin setting

 

enjoy~