how_to:editor_configuration_syntaxhighlight
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision Last revision Both sides next revision | ||
|
how_to:editor_configuration_syntaxhighlight [2014/12/12 15:34] shawn_a [Integration in GetSimple] |
how_to:editor_configuration_syntaxhighlight [2015/04/14 04:05] gsinfo [Integration in GetSimple] |
||
|---|---|---|---|
| Line 9: | Line 9: | ||
| Unpack it to a local directory and upload it as directory "//syntaxhighlighter//" to ///admin/template/js/// | Unpack it to a local directory and upload it as directory "//syntaxhighlighter//" to ///admin/template/js/// | ||
| - | Download the **SyntaxHighLighter-Plugin for CKeditor-Plugin** from [[http://code.google.com/p/ckeditor-syntaxhighlight/downloads/detail?name=ckeditor-syntaxhighlight-1.0.tar.bz2]] | + | Download the **SyntaxHighLighter-Plugin for CKeditor-Plugin** from [[http://s1.ckeditor.com/sites/default/files/uploads/syntaxhighlightv1.3-ckeditor-plugin.zip]] |
| ===== FileUpload===== | ===== FileUpload===== | ||
| Unpack it to a local directory and load that directory by FTP into your editor-plugin-directory at: //admin/template/js/ckeditor/plugins// | Unpack it to a local directory and load that directory by FTP into your editor-plugin-directory at: //admin/template/js/ckeditor/plugins// | ||
| + | |||
| + | Make sure you rename the folder so that it looks like this | ||
| + | //admin/template/js/ckeditor/plugins/syntaxhighlight// | ||
| + | |||
| + | This folder should contain the files plugin.js and the subdirectories dialogs, images, and lang | ||
| + | |||
| ===== Integration in GetSimple ===== | ===== Integration in GetSimple ===== | ||
| You will need a separate [[how_to:editor_configuration_custom_files|CKEditor-configuration file]] if you don't have one already. Add the following 2 lines to the custom config-file: \\ | You will need a separate [[how_to:editor_configuration_custom_files|CKEditor-configuration file]] if you don't have one already. Add the following 2 lines to the custom config-file: \\ | ||
| Line 26: | Line 33: | ||
| If you have defined extraPlugins already, add '//syntaxhighlight//' to that comma-separated list,for example:\\ | If you have defined extraPlugins already, add '//syntaxhighlight//' to that comma-separated list,for example:\\ | ||
| <code> | <code> | ||
| - | config.extraPlugins = 'fileicon,video,syntaxhighlight','templates', | + | config.extraPlugins = 'fileicon,video,syntaxhighlight,templates'; |
| </code> | </code> | ||
| Line 46: | Line 53: | ||
| ['Image','Flash','video','fileicon','Table','HorizontalRule','SpecialChar'], | ['Image','Flash','video','fileicon','Table','HorizontalRule','SpecialChar'], | ||
| '/', | '/', | ||
| - | ['Styles','Format','Font','FontSize'],['ShowBlocks'],['Code'],['Templates'] | + | ['Styles','Format','Font','FontSize'],['ShowBlocks'],['syntaxhighlight'],['Templates'] |
| ");</code> | ");</code> | ||
| - | you see the option <code>['Code']</code>? This places the Syntax-Highlighter-Button in your toolbar. | + | you see the option <code>['syntaxhighlight']</code>? This places the Syntax-Highlighter-Button in your toolbar. |
| ===== Edit the template.php of your theme ===== | ===== Edit the template.php of your theme ===== | ||
| Line 69: | Line 76: | ||
| </code> | </code> | ||
| ===== How to use ===== | ===== How to use ===== | ||
| - | After all, you will see a new icon in your toolbar: | + | After all, you will see a new icon in your toolbar:\\ |
| {{:how_to:ckeditor_plugin_syntaxhighlight.jpg|}}\\ | {{:how_to:ckeditor_plugin_syntaxhighlight.jpg|}}\\ | ||
| - | Click on that icon, you will see that PHP is the predefined language: | + | |
| + | Click on that icon, you will see that PHP is the predefined language:\\ | ||
| {{:how_to:ckeditor_plugin_syntaxhighlight_2.jpg|}}\\ | {{:how_to:ckeditor_plugin_syntaxhighlight_2.jpg|}}\\ | ||
| + | |||
| Now you can enter your code-snippet and after saving, \\ | Now you can enter your code-snippet and after saving, \\ | ||
| {{:how_to:ckeditor_plugin_syntaxhighlight_3.jpg|}}\\ | {{:how_to:ckeditor_plugin_syntaxhighlight_3.jpg|}}\\ | ||
| - | it will be integrated nicely formatted into your page. | + | |
| + | it will be integrated nicely formatted into your page.\\ | ||
| A screenshot:\\ | A screenshot:\\ | ||
| {{:how_to:ckeditor_plugin_syntaxhighlight_4.jpg|}} | {{:how_to:ckeditor_plugin_syntaxhighlight_4.jpg|}} | ||
how_to/editor_configuration_syntaxhighlight.txt · Last modified: 2015/04/14 04:06 by gsinfo
Page Tools
Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
