Gistでコードを書いて保存して，
embedをクリックするとスクリプトのリンク表示されるのでコピーして，
HTMLモードで編集して貼り付ける．
すると以下のように表示されます．
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #!/usr/bin/env python | |
| # -*- coding: utf-8 -*- | |
| if __name__ == '__main__': | |
| print "Hello, world!" |
デフォルトだと行番号は表示されないので．表示させるために https://gist.github.com/454771 を参考にBloggerのレイアウトに以下のHTML/Javascriptガジェットを追加しました．（※他の場所でjQueryが読み込まれている必要があります．
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- add line number to gist --> | |
| <script type="text/javascript"> | |
| $('.gist').each(function() { | |
| $('.line',this).each(function(i, e) { | |
| $(this).prepend( | |
| $('<div/>').attr('unselectable','on').css({ | |
| 'float' : 'left', | |
| 'width': '30px', | |
| 'font-weight' : 'bold', | |
| 'color': 'grey', | |
| '-moz-user-select': 'none', | |
| '-webkit-user-select': 'none' | |
| }).text(++i) | |
| ); | |
| }); | |
| }); | |
| </script> |
追記
without jQuery
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- add line number to gist --> | |
| <script type="text/javascript"> | |
| var gists = document.getElementsByClassName('gist'); | |
| for (var i = 0; i < gists.length; i++) { | |
| var lines = gists[i].getElementsByClassName('line'); | |
| for (var j = 0; j < lines.length; j++) { | |
| var div = document.createElement('div'); | |
| div.innerHTML = j + 1; | |
| div.style.cssFloat = 'left'; | |
| div.style.width = '30px'; | |
| div.style.fontWeight = 'bold'; | |
| div.style.color = 'grey'; | |
| div.style.MozUserSelect = 'none'; | |
| div.style.webkitUserSelect = 'none'; | |
| div.setAttribute('unselectable', 'on'); | |
| lines[j].insertBefore(div, lines[j].childNodes[0]); | |
| } | |
| } | |
| </script> |
