Вирішив я попробувати блогерського щастя на blogger.com. Отримав красивий URL з закінченням blogspot.com і почав створювати статті. Перша ж незручність - це відсутність підсвітки синтаксису коду програм. Почав шукати як підключити, знайшов, проте коли почав експериментувати, чомусь ряд прикладів зі встановлення не запрацювало. Частково мабуть через те, що деякі статті були погано розписані, частково мабуть через те, що я не до кінця зрозумів як. Тут я вирішив навести, те, що в мене без проблем вийшло і запрацювало.
Перше, що я знайшов, як дещо покращити зовнішній вигляд коду задавши стиль для тегу <pre>. Для цього достатньо в оригінальний код додати наступний код:
Тому наступні мої пошуки привели до наступного способу. Заходимо в пункт "Шаблон" і тиснемо кнопку "Редагувати HTML" і там перед тегом <head> вставляємо:
Перше, що я знайшов, як дещо покращити зовнішній вигляд коду задавши стиль для тегу <pre>. Для цього достатньо в оригінальний код додати наступний код:
pre {
background-color:#FCFBF8;
border-color:#CCCCCC;
border-style:solid;
border-width:1px 1px 1px 1px;
line-height:1.2em;
margin:1em auto;
overflow:auto;
padding:1em;
width:90%;
word-wrap:normal; /* IE Fix */
}
Я це зробив за допомогою переходу на Шаблон/Налаштування/Додатково у списку знаходемо "Додайте CSS". Додаємо і зберігаємо. Можна також вставити і напряму в код шаблону. Тепер усе, що треба це взяти наш код у тег <pre>. Одержуємо код в рамочці із смугами прокрутки, а хотілося б все ж підсвітку синтаксису.Тому наступні мої пошуки привели до наступного способу. Заходимо в пункт "Шаблон" і тиснемо кнопку "Редагувати HTML" і там перед тегом <head> вставляємо:
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/> <link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'></script> <script language='javascript'> SyntaxHighlighter.config.bloggerMode = true; SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf'; SyntaxHighlighter.all(); </script>Для пришвидшення завантаження сторінки в браузері можна викинути деякі рядки з мовами, які Ви не збираєтесь використовувати. Якщо потрібно лише кілька мов, викидаємо зайві рядки. Тепер обрамляємо наш текст тегами <pre> з вказанням відповідної мови:
<pre class="brush: html"> </pre>Дивіться також:
Немає коментарів:
Дописати коментар