Показаны сообщения с ярлыком Блогопримочки. Показать все сообщения
Показаны сообщения с ярлыком Блогопримочки. Показать все сообщения

WLW – Windows Live Writer или как публиковать программный код на Blogger'е.

HighLight2

Пробуем вставить код, используя SyntaxHighlighter for Windows Live Writer Plugin:

/******************************************
Auto-readmore link script, version 2.0 (for blogspot)

(C)2008 by Anhvo

visit http://en.vietwebguide.com to get more cool hacks
********************************************/
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}

В режиме просмотра Windows Live Writer вижу то, что и должен был увидеть: блок раскрашенного кода на javascript.
Читать полностью >>>

Syntax Highlighter Widget для Blogger'а

HighLight2

Здесь я попробовал применить знания, полученные на Syntax Highlighter в Blogger'е. Вариант так сказать для ленивых: Щелкнуть по ссылке –> Добавить на страницу виджет –> Установить виджет –> Использовать.

Наука по использованию возможностей виджета - очень простая. Любой текст, помещенный в теги:

<pre class="тип_хайлайтера" name="code">
... Какой-то код, соответствующий типу хайлайтера ...
</pre>
или
<textarea name="code" class="тип_хайлайтера" cols="60" rows="10">
... Какой-то код, соответствующий типу хайлайтера ...
</textarea>

раскрасится виджетом без всяких там занудных правок шаблона блога, как в ранее рассмотренных вариантах подветки. Вот так то... Все гениальное - просто!


Подробности использования здесь, типы хайлайтеров здесь.


Пример использования для class="delphi":

FUNCTION  Utf8ToAnsi (Source : STRING; UnknownChar : CHAR = 'ї') : ANSISTRING;
(* Converts the given UTF-8 String to Windows ANSI (Win-1252).
If a character can not be converted, the "UnknownChar" is inserted. *)
VAR
SourceLen : INTEGER; // Length of Source string
I, K : INTEGER;
A : BYTE; // Current ANSI character value
U : WORD;
{$IFDEF UNICODE} // #2009-09-17 DremLIN
Ch : WIDECHAR; // Dest char
{$ELSE}
Ch : CHAR; // Dest char
{$ENDIF}
Len : INTEGER; // Current real length of "Result" string
BEGIN
SourceLen := Length (Source);
SetLength (Result, SourceLen); // Enough room to live
Len := 0;
I := 1;
WHILE I <= SourceLen DO BEGIN
A := ORD (Source [I]);
IF A < $80 THEN BEGIN // Range $0000..$007F
INC (Len);
{$IFDEF UNICODE} // #2009-09-17 DremLIN
Result [Len] := AnsiChar(Source[I]);
{$ELSE}
Result [Len] := Source [I];
{$ENDIF}
INC (I);
END
ELSE BEGIN // Determine U, Inc I
IF (A AND $E0 = $C0) AND (I < SourceLen) THEN BEGIN // Range $0080..$07FF
U := (WORD (A AND $1F) SHL 6) OR (ORD (Source [I+1]) AND $3F);
INC (I, 2);
END
ELSE IF (A AND $F0 = $E0) AND (I < SourceLen-1) THEN BEGIN // Range $0800..$FFFF
U := (WORD (A AND $0F) SHL 12) OR
(WORD (ORD (Source [I+1]) AND $3F) SHL 6) OR
( ORD (Source [I+2]) AND $3F);
INC (I, 3);
END
ELSE BEGIN // Unknown/unsupported
INC (I);
FOR K := 7 DOWNTO 0 DO
IF A AND (1 SHL K) = 0 THEN BEGIN
INC (I, (A SHR (K+1))-1);
BREAK;
END;
U := WIN1252_UNICODE [ORD (UnknownChar)];
END;
Ch := UnknownChar; // Retrieve ANSI char
FOR A := $00 TO $FF DO
IF WIN1252_UNICODE [A] = U THEN BEGIN
Ch := CHR (A);
BREAK;
END;
INC (Len);
{$IFDEF UNICODE} // #2009-09-17 DremLIN
Result [Len] := AnsiChar(Ch);
{$ELSE}
Result [Len] := Ch;
{$ENDIF}
END;
END;
SetLength (Result, Len);
END;

Смотрю на красивую подсветку кода Delphi. Радуюсь.


- DejaVu???

- Ку!!!...
Читать полностью >>>

Подсветка кода или Syntax Highlighter на Blogger’е

HighLight

Прикручивание публикации кода с подсветкой синтаксиса к Blogger’у.

Задумалось мне, на досуге, реализовать подсветку кода в моем блоге. Погуглил. Нашел несколько вариантов реализации задуманного. Вот обзорчик по теме:

Решил пока остановиться на этом: Highlight.js. Причины выбора:

  • Динамический;
  • Не загромождает шаблон страницы;
  • Поддержка Delphi/Object Pascal (а также много других, распознование - автоматом);
  • Легко прикручивается к Blogger.

Как я его прикручивал? Рассказываю.

Во первых выяснилось, что для размещения скрипта подсветки, да и вообще любых пользовательских скриптов, нужен отдельный файловый хостинг, потому что blogger пользовательские файлы не хранит. Обидно, досадно, ну да ладно. Зарегался значит, я на fileave.com, а там предоставляют на халяву всего 50М, но мне для скриптиков блоггера – достаточно.

Скачиваю Highlight.js (нужно обязательно расставить галки напротив нужных вариантов) заливаю на fileave.com. Теперь действую по инструкции: Подсветка синтаксиса в блоге на Blogger.com. Хотя описание несколько устарело, основную идею переделки шаблона оттуда я извлек.

Особое внимание надо уделить чтению файла readme.rus.txt из дистрибутива Highlight.js, по поводу использованию файла highlight.pack.js. И все получиться…

Затем я, путем проб и ошибок, добавил скроллинг в элемент отображения кода. Для этого пришлось немного поправить используемый мною, для раскраски кода, стиль “Magula”:

/* highlight.js styles */

pre {
margin: .5em; padding: .5em;
border-style: solid;
border-width: thin;
border-color: darkgrey;
background-color: #f4f4f4;
}

pre code,
.ruby .subst,
.lisp .title {
display: block;
height: 420px;
overflow: scroll;
word-wrap: normal; /* Для Internet Explorer 5.5+ */
line-height: 1.2em;
color: black;
}

... Здесь пропущены прочие описания стилей ... :)

/* End of highlight.js styles */

Смотрю на красивую подсветку кода Delphi. Радуюсь. Ку!...

FUNCTION  Utf8ToAnsi (Source : STRING; UnknownChar : CHAR = 'ї') : ANSISTRING;
(* Converts the given UTF-8 String to Windows ANSI (Win-1252).
If a character can not be converted, the "UnknownChar" is inserted. *)
VAR
SourceLen : INTEGER; // Length of Source string
I, K : INTEGER;
A : BYTE; // Current ANSI character value
U : WORD;
{$IFDEF UNICODE} // #2009-09-17 DremLIN
Ch : WIDECHAR; // Dest char
{$ELSE}
Ch : CHAR; // Dest char
{$ENDIF}
Len : INTEGER; // Current real length of "Result" string
BEGIN
SourceLen := Length (Source);
SetLength (Result, SourceLen); // Enough room to live
Len := 0;
I := 1;
WHILE I <= SourceLen DO BEGIN
A := ORD (Source [I]);
IF A < $80 THEN BEGIN // Range $0000..$007F
INC (Len);
{$IFDEF UNICODE} // #2009-09-17 DremLIN
Result [Len] := AnsiChar(Source[I]);
{$ELSE}
Result [Len] := Source [I];
{$ENDIF}
INC (I);
END
ELSE BEGIN // Determine U, Inc I
IF (A AND $E0 = $C0) AND (I < SourceLen) THEN BEGIN // Range $0080..$07FF
U := (WORD (A AND $1F) SHL 6) OR (ORD (Source [I+1]) AND $3F);
INC (I, 2);
END
ELSE IF (A AND $F0 = $E0) AND (I < SourceLen-1) THEN BEGIN // Range $0800..$FFFF
U := (WORD (A AND $0F) SHL 12) OR
(WORD (ORD (Source [I+1]) AND $3F) SHL 6) OR
( ORD (Source [I+2]) AND $3F);
INC (I, 3);
END
ELSE BEGIN // Unknown/unsupported
INC (I);
FOR K := 7 DOWNTO 0 DO
IF A AND (1 SHL K) = 0 THEN BEGIN
INC (I, (A SHR (K+1))-1);
BREAK;
END;
U := WIN1252_UNICODE [ORD (UnknownChar)];
END;
Ch := UnknownChar; // Retrieve ANSI char
FOR A := $00 TO $FF DO
IF WIN1252_UNICODE [A] = U THEN BEGIN
Ch := CHR (A);
BREAK;
END;
INC (Len);
{$IFDEF UNICODE} // #2009-09-17 DremLIN
Result [Len] := AnsiChar(Ch);
{$ELSE}
Result [Len] := Ch;
{$ENDIF}
END;
END;
SetLength (Result, Len);
END;


Для полного счастья не хватает нумерации строк. Ну что ж… А так ли она нужна? Возможно прав автор проекта Highlight.js Сагалаев Иван ГригорьевичБаловство все это… Буду морщить ум с этой стороны… А пока – Пока! Чао – какао… :)

Читать полностью >>>