This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
ru:how_to:editor_configuration_syntaxhighlight [2013/10/21 08:52] Arkady [Интеграция подсветки с GetSimple] |
ru:how_to:editor_configuration_syntaxhighlight [2013/10/21 09:04] Arkady [Интеграция подсветки с GetSimple] |
||
---|---|---|---|
Line 3: | Line 3: | ||
===== Скачайте необходимые скрипты ===== | ===== Скачайте необходимые скрипты ===== | ||
- | Download the **Syntax-Highlighter-Script** from the [[http://alexgorbatchev.com/SyntaxHighlighter/download/download.php?sh_current|SyntaxHighLighter-Download-Page]] | + | Скачайте скрипт **Syntax-Highlighter-Script** [[http://alexgorbatchev.com/SyntaxHighlighter/download/download.php?sh_current|отсюда]]. |
- | Unpack it to a local directory and upload it as directory "//syntaxhighlighter//" to ///admin/template/js/// | + | Разархивируйте его в папку на локальной машине и загрузите на сервер в подпапку "//syntaxhighlighter//" в папку ///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]] | + | Скачайте плагин [[http://code.google.com/p/ckeditor-syntaxhighlight/downloads/detail?name=ckeditor-syntaxhighlight-1.0.tar.bz2|SyntaxHighLighter-Plugin]] для **CKeditor** |
===== Загрузите плагин на сервер===== | ===== Загрузите плагин на сервер===== | ||
- | Unpack it to a local directory and load that directory by FTP into your editor-plugin-directory at: //admin/template/js/ckeditor/plugins// | + | Разархивируйте его в папку на локальной машине и загрузите эту папку в директорию плагинов редактора //admin/template/js/ckeditor/plugins//. |
===== Интеграция подсветки с GetSimple ===== | ===== Интеграция подсветки с GetSimple ===== | ||
- | You will need a separate [[ru: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: \\ | + | Для активации подсветки синтаксиса понадобится отдельный [[ru:how_to:editor_configuration_custom_files|пользовательский файл конфигурации]] редактора, если вы еще такой файл не создали ранее. Добавьте в этот файл две строки:\\ |
<code> | <code> | ||
CKEDITOR.editorConfig = function( config ){ | CKEDITOR.editorConfig = function( config ){ | ||
Line 22: | Line 22: | ||
</code> | </code> | ||
- | If you have defined extraPlugins already, add '//syntaxhighlight//' to that comma-separated list,for example:\\ | + | Если вы уже указывали параметр extraPlugins, добавьте к значению '//syntaxhighlight//' через запятую, например:\\ |
<code> | <code> | ||
config.extraPlugins = 'fileicon,video,syntaxhighlight','templates', | config.extraPlugins = 'fileicon,video,syntaxhighlight','templates', | ||
</code> | </code> | ||
- | If you haven't done already, define the custom-config-file in the [[ru:how_to:editor_configuration_custom_files|GetSimple-Configuration file gsconfig.php]] | + | Если это пока не было сделано – укажите свой [[ru:how_to:editor_configuration_custom_files|файл пользовательской конфигурации]] редактора в файле gsconfig.php: |
+ | |||
+ | Для вывода кнопки подсветки синтаксиса на панель инструментов необходимо прописать эту опцию в параметре GSEDITORTOOL в файле gsconfig.php, например, вместо стандартной строки | ||
- | To show the button for the Syntax-Highlighter, you have to define that in the section "Editortoolbar" in gsconfig.php: | ||
- | an example: instead the standard-entry | ||
<code># WYSIWYG toolbars (advanced, basic or [custom config]) | <code># WYSIWYG toolbars (advanced, basic or [custom config]) | ||
define('GSEDITORTOOL', 'advanced');</code> | define('GSEDITORTOOL', 'advanced');</code> | ||
- | define the buttons: | + | определите следующие кнопки панелей инструментов: |
<code> | <code> | ||
define('GSEDITORTOOL',"['Source','Cut','Copy','Paste','PasteText','PasteFromWord','Undo','Redo','Find','Replace','SelectAll','RemoveFormat'], | define('GSEDITORTOOL',"['Source','Cut','Copy','Paste','PasteText','PasteFromWord','Undo','Redo','Find','Replace','SelectAll','RemoveFormat'], | ||
Line 47: | Line 48: | ||
");</code> | ");</code> | ||
- | you see the option <code>['Code']</code>? This places the Syntax-Highlighter-Button in your toolbar. | + | Опция <code>['Code']</code> размещает кнопку подсветки синтаксиса на панели инструментов редактора. |
===== Отредактируйте файл template.php вашей темы ===== | ===== Отредактируйте файл template.php вашей темы ===== | ||
- | you will have to add some stylesheets and scripts to your template-header, otherwise the visual effect of the syntax-highlighter will not work. | + | Теперь для обеспечения работы подсветки добавьте ссылки на необходимые файлы стилей и скрипты в секцию <head> файла шаблона. |
<code> | <code> | ||
<!-- SyntaxHighlighter --> | <!-- SyntaxHighlighter --> | ||
Line 62: | Line 63: | ||
</code> | </code> | ||
- | In case that the syntaxhighlighting still does not work at your site, you might add one more script-tag to your template.php: | + | Если после этого подсветка синтаксиса на вашем сайте все-таки не работает, попробуйте добавить еще один скрипт в файл шаблона template.php: |
<code> | <code> | ||
<script type="text/javascript">SyntaxHighlighter.all()</script> | <script type="text/javascript">SyntaxHighlighter.all()</script> | ||
</code> | </code> | ||
===== Как работать с подсветкой ===== | ===== Как работать с подсветкой ===== | ||
- | 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: | + | Кликните ее и убедитесь, что по умолчанию языком подсветки является PHP. |
{{:how_to:ckeditor_plugin_syntaxhighlight_2.jpg|}}\\ | {{:how_to:ckeditor_plugin_syntaxhighlight_2.jpg|}}\\ | ||
- | 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. | ||
- | A screenshot:\\ | + | он будет вставлен в вашу страницу уже с подсветкой.\\ |
+ | |||
+ | Скриншот:\\ | ||
{{:how_to:ckeditor_plugin_syntaxhighlight_4.jpg|}} | {{:how_to:ckeditor_plugin_syntaxhighlight_4.jpg|}} | ||