投稿

ラベル(Blogger)が付いた投稿を表示しています

Bloggerの記事にソースコードを埋め込む

イメージ
 はじめに 私はゲーム制作をしているので、プログラミングに関する記事とかを書きます。 その際にソースコードを載せたりとかしたかったのですが、Blogger自体にはソースコードを埋め込むような仕様がなく、普通のテキストのように書く感じになるのですが、よくある感じのソースコード用のフィールドを作ってそこにコードを表示したかった。 Debug.Log("こんな感じ") 手順 ①テーマを選択 ②カスタマイズの三角を選択 ③HTMLを編集を選択 ④headタグに以下のコードを追加 <script src='https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?skin=sunburst'/> ⑤右上で保存 ⑥ソースコードを埋め込みたい記事を開き、左上でHTMLビューに変更 ⑦埋め込みたい場所に以下のコードをペーストする <pre class="prettyprint"> //ここにコード </pre> 基本的には以上。 参考にさせていただいた🙏 ・具体的な使い方等 https://soichiro.co.jp/blog/google_code_prettify/ https://rfs.jp/sb/javascript/js-lab/code-prettify.html ・表示のデザイン https://rawgit.com/google/code-prettify/master/styles/index.html ・HTMLタグなどを書く際 https://developer.mozilla.org/ja/docs/Glossary/Entity ・コピーボタンをつける https://mizunosame.blogspot.com/2022/09/source-code-copy-button-c...

Bloggerの埋め込みリンクをいい感じにする(Iframely)

イメージ
ブログのリンクをいい感じにしたい! というわけで、 やっていきます。 いい感じとは? はてなブログとかやってる人はよくわかると思うけど、 下のようなリンク先のスクショやタイトル、本文のプレビューなどが表示されるリンクをやりたい。 https://teppy-game.blogspot.com/2024/04/first-blog.html (ブログカードっていうみたい) コピペでOK Iframely このサイトで埋め込みたいURLを入れて「Check your URL」を押して、出てきたURLをコピー コピーしたコードをBloggerの記事のHTMLにペーストする  以上! コピペするだけなので、結構簡単にできました。 参考にさせてもらった記事等🙏 【Blogger】ブログカードを表示させる