Добро пожаловать на мой блог

Собственно о чем речь?

Это блог! В котором я веду свои заметки и копи-пасты с других сайтов. В основном это не что иное как дневник. Приятного чтения.

Как сделать себе такую панель?

Это можно выяснить перейдя по ссылке »

Вход в блог

Забыли/потеряли пароль?

Регистрация закрыта

Мне жаль, но регистрация на этом блоге закрыта!

Для того, чтоб получить регистрацию свяжитесь с владельцем блога nick {at} homolibere {dot} info.

Note: If you are the admin and want to display the register form here, log in to your dashboard, and go to Settings > General and click "Anyone can register".

CodeColorer TinyMCE Button

Для подсветки синтаксиса в постах своего блога я выбрал CodeColorer (хороший плагин для ВП на основе geshi библиотеки). Однако у него есть недостаток  — нет кнопки на панели TinyMCE. Меня это долго не удовлетворяло и даже раздражало. Вот я взял и написал отдельный плугинец, который работает в связке с CodeColorer добавляя удобную кнопку на панель TinyMCE.

English version here

Кнопка, которая появляется на панели TinyMCE

Кнопка, которая появляется на панели TinyMCE

Вот так вот выглядит окно по нажатию на кнопку:

Форма, отображающаяся по нажатию на кнопку

Форма, отображающаяся по нажатию на кнопку

В общем-то я писал его как отдельный плагин, чтоб его можно было легко адаптировать для других плагинов расцветки кода. По странному стечению обстоятельств ни один плагин такого типа не предоставляет кнопки на тулбаре TinyMCE.

Из особенностей могу добавить только то, что:

- работает исключительно с TinyMCE 3.х и выше

- возможно работает с ВП 2.7 и выше

Для подстройки под другие плагины расцветки достаточно поправить файл tinymce.js, где надо изменить формат подстановки текста.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function insertCCTBcode() {

var tagtext;
var langname_ddb = document.getElementById('cctb_lang');
var langname = langname_ddb.value;
var linenumbers = document.getElementById('cctb_linenumbers').checked;
var inst = tinyMCE.getInstanceById('content');
var html = inst.selection.getContent();

if (linenumbers)
//править надо именно тут подстановку
tagtext = "[cc lang='" + langname + "' ";
else
tagtext = "[cc lang='" + langname + "' line_numbers='false'";
//и не забыть чутка тут ({ } замените на [ ] потому как тут в коде они ломали синтаксис)
window.tinyMCE.execInstanceCommand('content', 'mceInsertContent', false, tagtext+']'+html+'{/cc}');
tinyMCEPopup.editor.execCommand('mceRepaint');
tinyMCEPopup.close();
return;
}

codecolorer-tinymce-buttom скачиваем и тестируем (версия 0.1)

Обсуждение можно вести на форуме.

Pages: 1 2

марта 31, 2009 Add a comment
Home > IMadeThis, Webware > CodeColorer TinyMCE Button
Comments (10) Trackback Leave a comment
  1. Июль 22nd, 2011 at 16:50 | #1

    @Aahan
    yes it’s possible. contact me in GTalk, nickname — homolibere (@gmail.com)

  2. Aahan
    Июль 22nd, 2011 at 15:26 | #2

    Thank you. If possible can we have a chat on GTalk please? (not skype, if possible)

  3. Июль 22nd, 2011 at 10:11 | #3

    @Aahan
    nope, just tested… it’s broken for now. i’ll fix it today and inform you later about my progress.

    tnx for interesting my plugin)))

  4. Aahan
    Июль 21st, 2011 at 21:38 | #4

    Is your plugin still working? I mean on wordpress 3.2.1 and with CodeColorer 0.9.9?? Please update me on this.

  5. Май 21st, 2009 at 16:34 | #5

    Hello!

    I couldn’t find a contact link; I hope it’s okay I reach you this way.

    I would like to include parts of this plugin in a patch for syntaxhighlighter-plus. Would you grant me permission for that?

    Thank you for your excellent work. :-)

    Ciao!

    • Май 21st, 2009 at 16:38 | #6

      Yes, of course. Feel free to use this cod under GPL License as everything on official WP-Plugins page ;-)

  6. Апрель 8th, 2009 at 23:05 | #7

    еще раз обновил статью и добавил английскую версию

  7. Апрель 4th, 2009 at 13:44 | #8

    Обновил статью и переместил ссылку на официальный сайт расширений для ВП

  8. Апрель 1st, 2009 at 17:45 | #9

    Если прочитать внимательно комментарии автора плагина, то можно заметить, что код, вставленый через визуальный редактор, ломается. И это правда :)

    • Апрель 1st, 2009 at 22:08 | #10

      С первым апреля! На самом деле раньше код действительно ломался, но я уже поправил код еще до выкладывания, однако поправить пост запамятовал… мот скоро поправлю. Сейчас код не ломается.

Allowed tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>
Trackbacks (0 ) Detail Trackback