在ckeditor wysiwyg我們如何改變塊引用按鈕的動作

我最終要做的是實現一些簡單的代碼高亮器（/語法高亮器），因爲在ckEditor中沒有可用的東西。出於這個原因，我正在考慮通過以下方式單擊所選文本更改來添加新按鈕（或修改其中一個現有按鈕）： 1-獲取單色空間字體以保留源代碼中的縮進（例如「Courier新「） 2 - 字體顏色更改爲藍色在ckeditor wysiwyg我們如何改變塊引用按鈕的動作

由於我不知道如何添加新按鈕，我正在考慮使用其中一個現有按鈕（例如塊引用按鈕）來執行此項任務。

補充說明： 由我只注意到的方式使CKEDITOR 4是出過：ckeditor 4 其中插件是定製過：ckeditor 4 builder

來源

2012-11-26 C graphics

你可以考慮下面的插件我在匆忙從頭開始創建（這不是一個完整的解決方案，但它顯示了正確的方向）：

要運行它，提取Google Prettify庫爲lib目錄prettify插入。然後嘗試以下HTML並使用工具欄中的按鈕來美化pre：

<textarea cols="80" id="editor1" name="editor1" rows="10"> 
<pre>function insertResources(editor) { 
    var outerHead = CKEDITOR.document.getHead(), 
     innerHead = editor.document.getHead(), 
     path = CKEDITOR.plugins.getPath('prettify'); 
</pre> 

<p>Foo:</p> 

<pre>outerHead.append(CKEDITOR.document.createElement('script', { 
     attributes: { 
      type: 'text/javascript', 
      async: 'true', 
      src: path + 'lib/prettify.js' 
     } 
    }));</pre> 

<p>Bar:</p> 

<pre>innerHead.append(CKEDITOR.document.createElement('link', { 
     attributes: { 
      rel: 'stylesheet', 
      href: path + 'lib/prettify.css' 
     } 
    })); 
}</pre> 
</textarea> 
<script> 

    CKEDITOR.replace('editor1', { 
     extraPlugins: 'prettify', 
     toolbar: [ 
      [ 'Source', '-', 'NewPage', 'Preview', '-', 'Templates' ], 
      [ 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ], 
      [ 'Bold', 'Italic' ], 
      '/', 
      [ 'Prettify'] 
     ] 
    }); 

</script>

來源

2012-12-05 13:47:07 oleq

所見即所得的編輯器生成的一個HTML標記或編碼的HTML回到你的存儲格式，讓我們說的引號，可能會產生在後面的代碼：

<blockquote> … </blockquote>

（然而，這從一個編輯器到另一個變化）

最簡單的方法是找出它在後臺生成的標記並將CSS樣式應用到其中。

//.CSS 
blockquote{ 
//Styles here… 
}

希望它有幫助。

來源

2012-11-26 06:16:13 SajjadHashmi

-1

我剛剛發現這個超級簡單的解決方案：

在CKEditor的根打開contents.css
添加以下內容：

塊引用{ 顏色：藍色; font-family：「Courier New」， Courier， monospace; }

來源

2012-11-30 10:36:05

沒有幫助！原來它會被渲染成不同的樣子！ –

不知道什麼是完整的使用情況，但這裏是我的，它結束了一個custom plugin

我希望能夠通過一個對話窗口中插入代碼片段到CKEditor的（不知道你爲什麼喜歡blockquote元素）
我想有這些代碼片段莫名其妙視覺標記CKEditor的，我也沒在意具有CKEditor的
真正的語法高亮最後，保存後的續ent，我想將真正的語法格式應用於插入的元素，而不用花費太多的工作。我用prettify。

隨意檢查插件並修改它以滿足您的需求。

來源

2012-11-30 16:57:01

我想要一個這樣的語法高亮這裏：http://www.question2answer.org/qa/?qa=blob&qa_blobid=14850463595885004827，但對於ckEditor –

在ckeditor wysiwyg我們如何改變塊引用按鈕的動作

回答

相關問題