Title: Source Code Widget plugin for syntax highlighting
You can write program code and script in the Source Code widget to display it in your article with syntax highlighting.
Examples
SDL (TeamPage's markup language that is used to render view content)
<#example title="Using view properties">
<var.set name="foo" value="bar" />
<foreach list="<config.view.value name=authors>" set="name">
<loop.first>Prepared by </loop.first>
${name}
<loop.last not> and <else>.</loop.last>
</foreach>
</#example>
JavaScript
(function() {
function tryHighlightingAll() {
try {
Prism.highlightAll();
}
catch (e) {
console.log(e);
}
}
const eventsToListenFor = [ "load", "auto-refresh-load", "comment-insert", "comment-update", "feed-item-expand" ];
for (let i = 0; i < eventsToListenFor.length; i ++) {
Proteus.addHandler(eventsToListenFor[i], tryHighlightingAll);
}
})();
How to use
Select "Source Code" in the "Insert/Edit Widget" tool bar menu.
Select the name of the language in "Syntax", put your code into "Source Code", and click "OK".
The widget is inserted into the body area of the form. Submit the form.
Your code is colored and shows up in the widget embedded in the entry.
Choose a Color Theme
Click the "Configure" link in the "Source Code Widget" slot in Server Settings > Plugins to open the plugin's configuration dialog.
Choose a color theme as you like.
Here is a screenshot of the widget with the "Monakai" theme.
Download
This plug-in is bundled and included in a TeamPage installer and it is automatically available on your TeamPage server.
However, you can download a zip file of this plugin by clicking the link below.
Notes for the version 5.0
In version 5.0, the library used for highlighting has been changed to Prism.js. With this change, the following languages are no longer supported.
- ActionScript
- Cold Fusion
- Delphi / Pascal (replaced with "Pascal")
- JavaFX
In addition, the color themes have been changed in version 5.0. The following color themes that were available in version 4.0 are no longer available.
- Django
- Eclipse
- Emacs
- FadeToGrey
- MDUltra
- Midnight
- RDark
- Swift