BloggerにMarkdownを導入する
コードブロックが欲しいのでMarkdownを導入します
参考記事
1. [BloggerでMarkdown書けるようにした。]
2. [Markdown で Blogger の記事を書く]
テーマのHTMLの編集
[テーマ] にある [HTMLの編集] のボタンをクリックして、`</body>`の前に下の行を足す。2050行くらいにありました。
```html
<script src='https://rawgithub.com/chjj/marked/master/lib/marked.js'/>
<script>
var mdEls = document.querySelectorAll('.markdown');
for(var i in mdEls){
var mdEl = mdEls[i];
var converted = document.createElement('div');
converted.innerHTML = marked(mdEl.value);
mdEl.parentNode.replaceChild(converted, mdEl);
}
</script>
```
CSSの追加
[テーマ] の [カスタマイズ] から [上級者向け] をクリックして、下にスクロールすると [CSSを追加] があるので下の行を追加
```css
.markdown {
width:100%;
height:auto;
overflow:scroll;
background-color:#ffffff;
}
.showdown {
background-color:#ffffff
}
.showdown img {
height:auto;
width:100%;
}
code {
border-radius: 2px;
display: inline-block;
border: 1px solid #d3d6db;
background-color: #f9f9f9;
padding: 1px 5px;
margin: 3px;
}
```
HTMLテンプレの追加
[設定] から [投稿とコメント] の [投稿テンプレート] に下の行を追加
```
<textarea border-style:dotted="border-style:dotted" class="markdown" disabled="disabled">
<!--md内容をここに書く!-->
</textarea>
```
投稿時はHTMLで内容を書いていけば終了です。