如何在ckEditor中使用Gists代码段功能?

时间:2017-05-15 11:24:56

标签: javascript jsf ckeditor gist primefaces-extensions

要创建博客帖子,我有文本编辑器(ckEditor),如下所示。 enter image description here

代码:

@if (@CodeSection == @Batch) ‌@then
‌@echo off
‌start "" runas /user:testuser c:/path/to/my/program.exe
‌CScript //nologo //E:JScript "%~F0"
‌goto :EOF
‌@end
‌WScript.CreateObject("WScript.Shell").SendKeys("password{ENTER}");

我将<h:form> <p:growl id="growl" showDetail="true" /> <pe:ckEditor id="editor" value="#{EditorController.content}" interfaceColor="#{EditorController.color}" checkDirtyInterval="0"> <p:ajax event="save" listener="#{EditorController.saveListener}" update="growl" /> </pe:ckEditor> <p:commandButton action="#{EditorController.changeColor}" update="editor" value="Change color with AJAX" style="margin-top:10px;" /> </h:form> content保存为支持bean,如下所示:

String

输出屏幕如下: enter image description here

代码:

private String content;
public void saveListener() {

content = content.replaceAll("\\r|\\n", "");
}

但我希望在此行<h:body> Hello World Result! <br /> <h:outputText id="outformat" value="#{EditorController.content}" escape="false" /> </h:body>

中看到gists代码段

如下所示:enter image description here

问题是如何在我的JSF Primefaces扩展ckEditor中添加这些gists代码段功能。它有可能还是有些我误解了?

1 个答案:

答案 0 :(得分:1)

  1. 点击Source按钮。
  2. 然后在弹出窗口中粘贴HTML代码(<script src=... ></script>) 窗口。
  3. 点击ok
  4. 有关详细信息,请参阅ckeditor的sourcedialog文档。

    enter image description here