こんな感じにソースコード書いてあるサイト、よくありますよねぇ。
1 2 3 | #!/usr/bin/python# -*- coding: utf-8 -*-print("Hello World") |
Bloggerって、HTMLテンプレートをかなり柔軟にイジっていいみたいですね。
- [テンプレート] [HTML編集]をクリック
- <head>の中に、SyntaxHighliterのスタイルとスクリプトを追加する。
4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | <head> <meta charset='utf-8'/> <meta content='width=device-width, initial-scale=1.0' name='viewport'/> <!-- Syntax Highlighter Scripts Generator --> <link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/> <link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'/> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'/> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/> <script language='javascript' type='text/javascript'> SyntaxHighlighter.config.bloggerMode = true; SyntaxHighlighter.all(); </script> <style> .syntaxhighlighter { overflow: auto !important; overflow-y: hidden !important; } .syntaxhighlighter .toolbar{ display:none !important } </style> |
<pre>タグ中に使えない文字(<>"'など)をエスケープするには、preタグメーカーを使えばいいみたい。
