Wordress и постинг исходного кода с подсветкой - 2

В помощь блоггеру20.03.2008 08:54

Наткнулся на еще один интересный хак. Т.к. написан он несколько криво, поясню.

  1. Качаем и ставим WP-Syntax Plugin
  2. Качаем отсюда и заменяем свой wp-includes/js/quicktags.js
  3. Прописываем в коде плагина 
    $geshi = new GeSHi(htmlspecialchars_decode($code), $language);
$geshi->enable_keyword_links(false);
$geshi->set_header_type(GESHI_HEADER_DIV);
$geshi->set_tab_width(4);
  4. В CSS темы дописываем нечто вроде 
    /***** SYNTAX HIGHLIGHTER *****/
.wp_syntax {
    color: #100;
    background-color: #f9f9f9;
    border: 1px solid silver;
    margin: 0 0 1.5em 0;
    overflow: auto;
}

/* IE FIX */
.wp_syntax {
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: expression(this.scrollWidth > this.offsetWidth ? 15 : 0);
    width: 100%;
}

.wp_syntax table {
    border-collapse: collapse;
}

.wp_syntax div, .wp_syntax td {
    vertical-align: top;
    padding: 2px 4px;
    white-space: nowrap;
}

.wp_syntax .line_numbers {
    text-align: right;
    background-color: #e8e9dc;
    color: gray;
    overflow: visible;
}

td.code div {
    padding-top: 0px;
}

Если замечается несовпадение нумерации и кода, советую поиграть с последним padding-top и удалить/отредактировать CSS-код, влияющий на pre теги.

Оставить комментарий