MyPanoramio Junk0128: Syntax Highlighter

ラベル Syntax Highlighter の投稿を表示しています。すべての投稿を表示

2016年5月11日水曜日

online HTML code converter with syntax highlight feature

HTMLなどのソースコードを見やすく表示してくれるシンタックス・ハイライトですが、ガジェットではなくオンライン版があることを知りました。

Blogger Tricks: How to highlight programming code in your blog post easily

上記で紹介されているのが hilite.me です。ソースコードを貼り付けてLanguageとStyleを選択し、「Highlight!」をクリックするとハイライトされてHTMLコードが表示されるので、それをコピーしてBloggerにソースモードで貼り付けすればOKです。下記にGoogle DevelopersのStreet Viewサンプルコードを記してみます。「Online syntax highlight」を検索すると他にもありますね。※２つめのサイト

var panorama;
function initialize() {
  panorama = new google.maps.StreetViewPanorama(
      document.getElementById('street-view'),
      {
        position: {lat: 37.869260, lng: -122.254811},
        pov: {heading: 165, pitch: 0},
        zoom: 1
      });
}

var panorama;
function initialize() {
  panorama = new google.maps.StreetViewPanorama(
      document.getElementById('street-view'),
      {
        position: {lat: 37.869260, lng: -122.254811},
        pov: {heading: 165, pitch: 0},
        zoom: 1
      });
}

2012年2月13日月曜日

SyntaxHighlighter for Windows Live Writer

やっぱり前のがいいのかなと、試して見るとエラーは出るものの使えるようです。wlwのプレビューではハイライトしていませんが、投稿するとちゃんと見えます。貼り付けた後でも再編集可能だし、長い行の折り返し表示も、これの方が見栄えがいい。「ブロックを閉じた状態で表示」も出来るけど、表示行数が指定出来るともっといいな。

エラーは「問題が発生しました：Object reference not set to an instance of an object.
Unexpected Error Occurred An unexpected error has occurred within the application.」
エラーは無視して、「レポートを送信しない」とするとそのまま使える。エラーが出ている時は右のサイドバーのセレクトボックスが空、エラーが出ない時は「XML/HTML」が表示されるみたい。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
	<title>Panoramio Data API</title>
	<meta http-equiv="content-script-type" content="text/javascript" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<link rel="stylesheet" type="text/css" href="css/stylesheet.css" />
	<script type="text/javascript" src="js/javascript.js" charset="utf-8"></script>
</head>
<body>
	<button id='prev' type='button' tabindex='1' accesskey="P">Prev</button>
	<span id='number'>0</span>
	<button id='next' type='button' tabindex='2' accesskey="N">Next</button>
	<span>Data API test [<a href='http://www.panoramio.com/user/1597930'> junk0128 </a>]</span>
	<div id='photos'></div>
	<div id='caption'></div>
	<div id='copyright'></div>
</body>
</html>

↓これは「ブロックを閉じた状態で表示」の場合です。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
	<title>Panoramio Data API</title>
	<meta http-equiv="content-script-type" content="text/javascript" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<link rel="stylesheet" type="text/css" href="css/stylesheet.css" />
	<script type="text/javascript" src="js/javascript.js" charset="utf-8"></script>
</head>
<body>
	<button id='prev' type='button' tabindex='1' accesskey="P">Prev</button>
	<span id='number'>0</span>
	<button id='next' type='button' tabindex='2' accesskey="N">Next</button>
	<span>Data API test [<a href='http://www.panoramio.com/user/1597930'> junk0128 </a>]</span>
	<div id='photos'></div>
	<div id='caption'></div>
	<div id='copyright'></div>
</body>
</html>

Code Snippet plugin for Windows Live Writer

以前に使っていたのを別のPCに導入したら、エラー発生し原因を調べるのが面倒なので新しいのを探してみました。表題のものにしようかと思ったら、XPマシンではエラー発生で使えない。エラーの内容は「Microsoft.mshtml」が見つからないでした。「Microsoft.mshtml」の機能を使ったアプリが使えないと、ネットで検索するとあちこちのブログにいっぱい書いてあります。

開発環境には入っているが、配布のアプリには同梱されていない。
アプリに同梱しようとしたら、7.8MBとでかいので配布しづらい。
Windows OfficeやVisual Studioなどがインストールされていれば導入済みで使用可能
Microsoft.mshtml.dllを同梱したアプリはいくつかある
Microsoft.mshtml.dllをコピーするだけでは駄目で、GAC登録が必要
GACってどうやれば出来るの？

GACって何だろうと更に検索して見ると、DOS時代のパスを通してやるみたいにどこからでも参照可能にすることらしい。「GAC登録方法」で検索して下記を見つけた。ファイルをエクスプローラでドロップすれば可能みたい。詳しくは下記を読んでください。

＠IT：インサイド .NET Framework ［改訂版］第3回　アセンブリのロード:

「ファイル名を指定して実行」に「%Systemroot%\assembly」を貼り付け
アセンブリの名前を一覧表示する窓が開く
別窓でエクスプローラを開き、そこから「Microsoft.mshtml.dll」を上記の窓にドラッグアンドドロップ

これで使えるようになりました。

   1: <?xml version="1.0" encoding="UTF-8"?>   2: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   3: <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">   4: <head>   5:     <title>Panoramio Data API</title>   6:     <meta http-equiv="content-script-type" content="text/javascript" />   7:     <meta http-equiv="Content-Style-Type" content="text/css" />   8:     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />   9:     <link rel="stylesheet" type="text/css" href="css/stylesheet.css" />  10:     <script type="text/javascript" src="js/javascript.js" charset="utf-8"></script>  11: </head>  12: <body>  13:     <button id='prev' type='button' tabindex='1' accesskey="P">Prev</button>  14:     <span id='number'>0</span>  15:     <button id='next' type='button' tabindex='2' accesskey="N">Next</button>  16:     <span>Data API test [<a href='http://www.panoramio.com/user/1597930'> junk0128 </a>]</span>  17:     <div id='photos'></div>  18:     <div id='caption'></div>  19:     <div id='copyright'></div>  20: </body>  21: </html>

使えるようにはなったものの、行番号を付けるとソースのコピーがしづらい。前のが良かったかも？？

2011年3月4日金曜日

Blogger Syntax Highlighter

htmlのソースをブログに書く時に、見やすくならないかなと検索していたら上記タイトルを見つけました。導入の仕方等はいくつか書かれているようなので、下記の検索結果からお好きな記事をお読み下さい。

Blogger Syntax Highlighter - Google 検索

使用例

<br />

登録: 投稿 (Atom)

MyPanoramio Junk0128

ページ

Panoramio Widget API