はてなブログでシンタックスハイライトを使いたい - すなばいじり
こちらもわりと使っている手法なのですが、「ここは公開する場所ではなくsandboxだぞ！」という意味合いも含めて、ダイアリーに下書きエントリーを用意してそこから引っ張ってきています。(UIを変えておけばミスが減る) はてなブログの見たままモードでシンタックスハイライトを使う方法 - DREAMARK PC+モダンブラウザでは、(リアルタイム)プレビューで表示された該当部分をそのままコピペできるので、もうひと手間減らせていい感じです。 2016/07/10 13:43 PC+モダンブラウザでは、(リアルタイム)プレビューで表示された該当部分をそのままコピペできるので、もうひと手間減らせていい感じです。 - psne のコメント / はてなブックマーク ブラウザはHTMLの構造を「そのまま」コピペできる 「そのまま」という部分がある意味で厄介なのですが、見たままをコピーをして貼り付ける事(コピ
コード表示を綺麗に：シンタックスハイライトしたい - Qiita
サイト制作時に使うモジュール集を作成するときに、 他の人がコードを見やすいようにしたい。 ↓ google-code-prettify 導入！ google-code-prettifyとは コードを綺麗に表示 シンタックスハイライトをしてくれます。 autoloader（以下）を使い、CSSを読み込ませればすぐにできます。 <script type="text/javascript" src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script> （ホスト元が移動していたようです。修正しました。@annyamonnya さんご指摘ありがとうございます！） ただ、autoloaderだとカスタマイズが難しいようす。 （カスタマイズ無しでよいならばこちらの方が楽ですね） ファイル
SyntaxHighlighter を使ってみる（使い方編） - とにかくやってみるブログ - Ingwer Design
「SyntaxHighlighter を使ってみる（導入編）」に引き続き、今回はソースコードを記述する際の様々な使い方を試してみます。 まずは標準の記述法で書いたときの表示です。 <h4 class="id_title4">使用用途</h4> <p> 移動先のページやページ内の特定の場所を指定する<br /> HTMLだけでなく、画像や音声にリンクを指定することもできる </p> ソースコードのコピー 最初の行番号を変える 特定の行をハイライトする 他言語のソースコードとHTMLを同時に色分けする 行番号を表示させない ソースをコードを隠す ソースコードにタイトルをつける IE8でHTMLの要素が大文字になってしまうのを直す デザインテーマを変える 奇数行と偶数行で色分けする ソースコードのコピー 3系になってからFlashを使ったクリップボードへのコピーがなくなり、ソースコードをダブルク
SyntaxHighlighter を使ってみる（導入編） - とにかくやってみるブログ - Ingwer Design
「とにかくなんでもやってみる」の最初の記事は「SyntaxHighlighterを使ってみる（導入編）」です。 SyntaxHighlighterは行番号のついたソースコードを表示してくれるJavascriptライブラリで、言語ごとに見やすく色分け表示してくれる便利なライブラリです。 どんなことができるか ファイルのダウンロード ファイルをサーバに設置 SyntaxHighlighterのライブラリを読み込む ソースコードを記述する どんなことができるか まずはどんな風に表示されるのか見てみましょう。 最初に<pre>タグを使って通常のHTMLソースコード表示<h4 class="id_title4">使用用途</h4> <p> 移動先のページやページ内の特定の場所を指定する<br /> HTMLだけでなく、画像や音声にリンクを指定することもできる </p> 次はSyntaxHighlig
はてなブログの見たままモードでシンタックスハイライトを使う方法 - DREAMARK
今回から普通の記事に戻ります。題材的にはかなり一部の人向けになりますが、はてなブログの見たままモードでシンタックスハイライトを使う方法を紹介していきます。 使う方法といいますか、ｊＱｕｅｒｙなどは使わずに、かなり原始的な方法なのですが、はてな記法ではなく、見たままモードでもシンタックスハイライトを使いたい方の参考になるのではと記事にさせていただきます。 シンタックスハイライトとは はてなブログで使うには？ シンタックスハイライトはこんな風に表示されます 見たままモードで使ってみましょう 【追記】もっと簡単にシンタックスハイライトを貼り付ける方法 シンタックスハイライトとは まずシンタックスハイライトとは何か？これはコードをブログなどに表示する時にコードの内容に分けて色を分けてくれる機能です。カスタマイズのコピペコードなんかを表示する時に使ったり、プログラマの方が自分の書いたプログラムをブロ
はてなブログでコードハイライト表示する方法 - JavaScript勉強会
はてなブログに、プログラムのコードを掲載するとき、色を付けて見やすくする方法がありました。（メモ） ハイライト表示とは？ プログラムのコードに色を付けて、見やすくする表示方法のことです。 コード・ハイライトは、シンタックス・ハイライトとも言います。（いろんな呼び方があるんですね） シンタックスハイライト - Wikipedia シンタックスハイライト（英: Syntax highlighting）とは、テキストエディタの機能であり、テキスト中の一部分をその分類ごとに異なる色やフォントで表示するものである。 シンタックスカラーリング（英: Syntax coloring）とも。 この機能により、プログラミング言語やマークアップ言語といった構造化された言語において、その構造や構文上のエラーが視覚的に区別しやすくなるため、ソースコードの記述が容易となる。 はてなブログのモード はてなブログの編集
ソースコードをハイライトする軽量ライブラリ、Highlight.jsの使い方
ソースコードをハイライトして見やすく表示するには、Highlight.jsが、軽量でバグもなく、お勧めです。
ソースコードの装飾表示方法 SyntaxHighlighter
HTML,CSS,JS,Perl,PHPなどの各ソースコードをWebサイト上に綺麗に再現。 NetyaSun ソースコード表示 ホームページ 作成、運営、管理ガイド 行番号や各行背景色で見やすい ソースコード ビュー ライブラリ SyntaxHighlighter エディタのようにWebサイト上に綺麗にソースコードを表示する方法。 ソースを書くプロ達や未来の開発者のための学びの場である HTML,CSS,JS,Perl,PHPなどのマニュアル・解説サイトなどで、 PREソースコードを行頭番号付きでカッコよく表示するソース ビューア SyntaxHighlighter SyntaxHighlighter:Download ソース上にオンマウスで の操作タブがソースの右上に表示されるようになった。 ソースを別窓ビュー表示したりクリップボードに保存や印刷も可能な優れものです。 <?xml ve
超軽量であらゆる言語に対応！Webページ上のコードを読みやすくするスクリプト -microlight.js
通常のシンタックス ハイライトだと、言語ごとのルールを記述したファイルが必要ですが、ハイライトさせる箇所を最低限必要な箇所に絞ることで、超軽量化(2.2k minified)させたスクリプトを紹介します。 ページで見せるのであれば、充分ですね。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
はてなブログでソースコードをシンタックスハイライトする