dp.SyntaxHighlighter
ソースコードを綺麗にBlog内に表示させる
dp.SyntaxHighlighter
をこのブログにも導入してみました。
ファイルをダウンロードして各自サイトの適切な場所にファイルを展開
そして<head>タグないに下記を記述
CSSの
href
=
パスやJavaScriptの
src
=パスは各自の設定に変更します。
<!-- syntaxhighlighter CSS--> <link rel="stylesheet" href="<$MTBlogURL$>tpl/js/dp.SyntaxHighlighter/Styles/SyntaxHighlighter.css" type="text/css" /> <!-- syntaxhighlighter JS --> <script type="text/javascript" src="<$MTBlogURL$>tpl/js/dp.SyntaxHighlighter/Scripts/shCore.js"></script> <script type="text/javascript" src="<$MTBlogURL$>tpl/js/dp.SyntaxHighlighter/Scripts/shBrushXml.js"></script> <script type="text/javascript" src="<$MTBlogURL$>tpl/js/dp.SyntaxHighlighter/Scripts/shBrushCss.js"></script> <script type="text/javascript" src="<$MTBlogURL$>tpl/js/dp.SyntaxHighlighter/Scripts/shBrushPhp.js"></script> <script type="text/javascript" src="<$MTBlogURL$>tpl/js/dp.SyntaxHighlighter/Scripts/shBrushJScript.js"></script> <script type="text/javascript" src="<$MTBlogURL$>tpl/js/dp.SyntaxHighlighter/Scripts/webscript.js"></script>
shCore.jsと
webscript.jsは必須とのことです。
他は整形したい言語に合わせて設定します、自分の場合は
XML、CSS、PHPとJavaScriptです。
次に
<script language="javascript"> window.onload = function() { dp.SyntaxHighlighter.HighlightAll('code', true, false); } </script>
を記述 そして使用するときは下記のタグでソースを囲んで使用します。
<textarea name="code" class="xhtml"> : : : </textarea>
classのセレクタを囲みたい言語に設定します。
xhtmlコードの場合、class="xhtml"
CSSコードの場合、class="css"
JavaScriptコードの場合、class="js"
その他、などなど
作成日時:2010年1月29日 00:07
スポンサー広告
カテゴリー
CSS
Flash
JavaScript
MOVABLE TYPE
PHP
SEO
WEBツール
素材
雑談
このBlogについて
このBlogはしがないWEBデザイナーの覚え書きのWebメモです。
このサイトはFlashを使用している箇所がございます、Adobe Flash Playerをお持ちでない方は下記バナーからどうぞ
広告エリア
Webベクター素材販売
ダイエット器具通販店
Blogランキング参加中
HOME
|
BLOG
|
GALLERY
|
CONTACT