Bloggerでgistを編集中に場所がわかるように埋め込む

gist embed code:



Bloggerに埋め込むHTML:


編集画面プレビュー

ここに編集画面での見え方が表示されます


説明

BloggerでもGitHubのgistのウェブサイトへの埋め込みを使うことができます。

gistのEmbedのコードをコピーして、BloggerのHTMLビューでコードを表示したい場所に挿入すれば、プレビューや公開したウェブページ上にgistのコードが表示されます。

しかし、HTMLビューで gistのembedのコード(<script>...</script>)を挿入して作成ビューに戻ると、どの場所にembedコードがあるかわからなくなります。


 

このページでは、作成ビューでも場所がわかるようなHTMLに変換します。

変換したHTMLはBloggerのHTMLビューでコードを表示したい場所に挿入してください。作成ビューでもgistを挿入した位置がわかります。しかし、作成ビューで見えている表示は、プレビューや公開したウェブページ上では見えません。

(注意)

作成ビューで見えている表示が、プレビューや公開したウェブページで見えない仕組みはJavascriptを使っています。このため、Javascriptが無効になっていると、作成ビューで見えている表示が見えてしまいます。しかし、Javascriptが無効の場合はgistのコードも表示されないのであまり影響はないでしょう。


使い方