大豆猫の空

気になること備忘録

フォントアイコンなるモの∥初心者がHTMLを漁った話

 

 

見つけたもの

ブログの編集を検索していたらいろいろ次々出てきて沼っています。

 

今回はフォントアイコンなるものがあるというので試してみたく。

 

 

こちらの方々のサイトを参考にさせていただきました。

 

 【ブログカスタマイズ】「はてなブログ」のアイコンフォントの種類・使い方を解説|グローバルメニューにおすすめ - redoブログ

https://shirokai.hatenablog.com/entry/hatenablog-icon-webfont

 

 はてなブログで使えるアイコンWebフォントの一覧と使い方まとめ - しろかい!

https://shirokai.hatenablog.com/entry/hatenablog-icon-webfont

・Hatenaにすでに使えるものがある。

・font awesomeだともっとたくさん種類がある。

 

【保存版】Font Awesomeの使い方:Webアイコンフォントを使おうーサルワカくん

https://saruwakakun.com/html-css/basic/font-awesome#section6

・さらにFont Awesomeではアイコンをいろいろ動かせる&アニメーションも可

魅力的であります。 

 

とりまHatenaのデフォルトで挑戦です。

 

 試してみました。

さっそくはてなで使用可能というのをHTML欄で打ち込んでみます。

編集見たまま欄に言ってみると…文字のみでアイコンが出ない。

 

落ち着いて基本的な確認。

綴り、スペース確認。問題なし。 「出ない、 ムム」

アイコンのクラス名を変えて打ってみる。 「出ない、 ヤヤっ」

再度打ち直して確認してみる。 「出ない、 ぐぬぬ

 

 

定型文登録できたら便利だったけど、

使い道いろいろ考えて楽しかったけど、

自分にはまだ早かったんだな、 

と諦めかけてました。

 

ふとプレビュー欄に行ってみると、

今まで書いたアイコンがめっちゃでてる。

イヤイヤめっちゃおる。

 

 『プ レ ビュ ー 欄』でした。

 

ハイ。きちんと使えました。

redoさん、しろかい!さん、サルワカくんさんありがとうございました。

 

 

あわててはダメだめな典型ですね。

 

 

わーい。ワクワクすっぞ。

 

 

 

まとめ

確認はプレビュー欄ですね。

いつも最後の最後にしか見てませんでしたが、作業途中でも確認しようと思います。

 

 

▽記念のアイコン

  hatena