Интересное

Сообщение об ошибке

Warning: ini_set(): A session is active. You cannot change the session module's ini settings at this time in drupal_environment_initialize() (line 684 of /home/www/nixtalk.com/includes/bootstrap.inc).

Geshi и Ckeditor в Drupal7

Опубликовано пн, 12/03/2012 - 22:51 пользователем Demontager

Эта статья для тех, кто хочет в Drupal 7 включить поддержку подсветки синтаксиса. Это могут быть сниппеты кода php, bash, javascript и др. Есть по крайней мере два модуля способные реализовать это -  Syntax Highlighter  и Geshi filter. Отличия между ними в том, что первый использует клиентский браузер для форматирования кода, а второй соответсвенно форматирование на стороне сервера. Лично для себя я выбрал Geshi и скажу почему, как минимум это надежнее когда твой код формируется на собственном сервере и никакие настройки клиентских браузеров не будут влиять на его отображение.  Еще заметил нюанс один, когда сохраняешь страницу с  кодом отформатированым в Syntax Highlighter, то при оффлайн просмотре, разметка теряется. В любом случае вам решать, но рекомендую именно Geshi filter.

Для настройки как минимум понадобятся такие модули :

  1. Geshi Filer 7.x-1.0
  2. Libraries API - 7.x-2.0-alpha2
  3. CKEditor - 7.x-1.9

При необходимости установите дополнительные модули для удовлетворения зависимостей. Также нужно скачать  библиотеку для Geshi ссылка. Затем скопировать ее в /sites/all/libriaries/geshi

На этом предварительная установка закончена. Приступаем к настройке, первым делом активируем модули и заходим в конфигурацию "Форматы текста",  /admin/config/content/formats здесь нужно указать тот формат, который вы желаете использовать для создания материалов, у меня стоит FullHTML, который разрешен только администратору и авторизированному пользователю и он стоит первый в списке, поэтому используется по умолчанию.

 

geshi

Нажимаем настроить и выбираем использование фильтра  Geshi

geshi

Далее идем в настройки модуля CKEditor  admin/config/content/ckeditor  и редактируем любой профиль или создаем свой. В  профиле важно выбрать тот формат, куда будет загружаться фильтр Geshi, как вы наверное помните у меня это FullHTML.

geshi

Остальные настройки можно оставить по умолчанию. Во вкладке EDITOR APPEARANCE нужно добавить кнопку Format если ее нет, далее она нам понадобится.

geshi

Теперь осталось настроить сам Geshi Filter, для этого переходим в  admin/config/content/formats/geshifilter , тут замечу, что его конфигурация не доступна с меню "Конфигурация", она есть только в менеджере модулей. 

geshi

Здесь нужно добавить дополнительный тег pre в подсветку синтаксиса, все остальные настройки можно оставить по умолчанию.

На этом настройка почти закончена, объясню далее почему не совсем закончена. Теперь, для того чтобы воспользоваться функцией подсветки синтаксиса, перейдите в создание любого типа материала, у вас должна появится панель инструментов CKEditor, никаких других специальных кнопок от Geshi вы не увидите. Вставьте произвольный текст кода в тело ноды, затем выделите весь кусок кода и нажмите на копку "Format", вам выпадет список возможного форматирования, выбираете Formatted. Как вы возможно догадались, это обрамит весь код в тег pre, который geshi распознает и сделает свое форматирование в соответствии с вашими настройками.

geshi

Можно сохранить и проверить результат, но тут есть маленькая проблема. Дело в том, что geshi не обрабатывает специальные символы, такие как $, &, >,< и др, а вместо них подставляются их кодовые значения. Для того чтобы это исправить, необходимо добавить несколько строк кода в библиотеку geshi по адресу sites/all/libraries/geshi/geshi.php

Начиная со строки 2138, вставляем код :

 

  1. function parse_code () {
  2.  
  3. // Start the timer
  4.  
  5. $start_time = microtime();
  6.  
  7.  
  8.  
  9.  
  10. $code = str_replace(&quot;\r\n&quot;, &quot;\n&quot;, $this-&gt;source);
  11.  
  12. $code = str_replace(&quot;\r&quot;, &quot;\n&quot;, $code);
  13.  
  14. $code = str_replace(&quot;&amp;gt;&quot;, &quot;&gt;&quot;, $code);
  15.  
  16. $code = str_replace(&quot;&amp;lt;&quot;, &quot;&lt;&quot;, $code);
  17.  
  18. $code = str_replace(&quot;&amp;amp;&quot;, &quot;&amp;&quot;, $code);
  19.  
  20. $code = str_replace(&quot;&amp;#39;&quot;, &quot;&#39;&quot;, $code);
  21.  
  22. $code = str_replace(&quot;&amp;quot;&quot;, &quot;\&quot;&quot;, $code);

Как видите, мы добавляем обработку спецсимволов.  

На этом все и не забудьте очистить кеш в админке Drupal, иначе изменения могут сразу не заработать.

И ещё один полезный момент. Для  того чтобы изменить стиль подсветки, допустим, вы хотите чтобы работал php по синтаксис (bash стоит по умолчанию), для этого в тег pre добавляем атрибут <pre language="php"> или любой другой, который доступен в конфигурации geshi  admin/config/content/formats/geshifilter/languages  "Языки". Там кстати можете задать свои значения для подсветки.

category_index: 
Поделится: 

Добавить комментарий