SSブログ

ブログにソースコードをどう貼るか悩む。。。パート2! [ソフト一般]

昨日 Syntax Highlighter を導入してやれやれと思っていたのですが、スマートフォンから見るとかなり表示が崩れてる。。。 う~む。

なんかイマイチだなぁと思っていたら、”google-code-prettify”なるものを発見!


google-code-prettify
https://code.google.com/p/google-code-prettify/


さすが、インターネッツの雄 Google さんです。で、早速下記コードをHTMLヘッダーに追加してみました。(追加の仕方はまた後日~)


<link href="https://google-code-prettify.googlecode.com/svn/loader/prettify.css" type="text/css"
 rel="stylesheet" />
<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script>
<script src="https://google-code-prettify.googlecode.com/svn/loader/lang-css.js"></script>
<script src="https://google-code-prettify.googlecode.com/svn/loader/lang-sql.js"></script>
<script src="https://google-code-prettify.googlecode.com/svn/loader/lang-vb.js"></script>




きちんと見えるかな。。。いろいろ試行錯誤しましたが、ようやく見えるようになりました。スマートフォンでもそれらしく見えています。

PCとスマホ両方それなりに見せるには、"Syntax Highlighter" ではなくて "google-code-prettify" のほうがよさそうです。でもちょっと癖があるので使いこなすのが大変そうだなぁ。
σ(ー ε ー)


関連記事
ブログにソースコードをどう貼るか悩む。。。
http://makers-with-myson.blog.so-net.ne.jp/2014-10-27






HTML+JavaScriptによるプログラミング入門

HTML+JavaScriptによるプログラミング入門

  • 作者: 古金谷 博
  • 出版社/メーカー: 日経BP社
  • 発売日: 2014/08/06
  • メディア: 単行本



HTMLとCSSで基礎から学ぶJavaScript

HTMLとCSSで基礎から学ぶJavaScript

  • 作者: 園田 誠
  • 出版社/メーカー: 秀和システム
  • 発売日: 2011/09
  • メディア: 単行本



ゲームを作りながら楽しく学べるHTML5+CSS+JavaScriptプログラミング (NextPublishing)

ゲームを作りながら楽しく学べるHTML5+CSS+JavaScriptプログラミング (NextPublishing)

  • 作者: 田中 賢一郎
  • 出版社/メーカー: インプレスR&D
  • 発売日: 2013/10/25
  • メディア: オンデマンド (ペーパーバック)




nice!(36)  コメント(0)  トラックバック(0) 
共通テーマ:趣味・カルチャー

nice! 36

コメント 0

コメントを書く

お名前:
URL:
コメント:
画像認証:
下の画像に表示されている文字を入力してください。

トラックバック 0