はてなブログ 見たままモードでソースコードを貼り付ける方法

見たままモードでソースコードが貼り付けられない？

はてな記法じゃないとダメとか見たままモードでは推奨されないと聞くが

Github と連携させると見たままモードでも型崩れなくスムーズに貼れました。

下記がその例です。

gistcb2392af871c7fcbaebf9823c6178b0e

すみません。コードの公開は取りやめました。リンクは404エラーになります。

やり方

1. 自分のGithubのページからGistのページにてソースコードを貼り付ける。
2. 作成したGistをPublicで公開する
3. はてなブログとGithubを連携させる。サイドバー→Github連携
4. 自分のGithubユーザー名を入力し連携するをクリック
5. 出てきたGistの内容を見たままモードで貼り付ける
6. プレビュー表示をするとコードが掲載されている。

まずGithubの会員登録

面倒ですが一度やると後がラクです。

Gistの作成

ギットハブページの右上から gist のページへ飛ぶ。

Gist作成

必ずpublicにする。 secretだとはてなで読み込み不可だった。

Gist作成2

Gistの投稿が出来たらはてなからGithubを連携する

サイドバーから

サイドバーから猫のマークを探す。オンにする。

はてなからgist貼り付け

選択したアイテムを貼り付けてプレビューすればソースコードが表示される。