ブログ記事下にお茶の差し入れボタンを実装してみました(差し入れ待ってます!) - 切り絵Blog 影織文庫

ブログ記事下にお茶の差し入れボタンを実装してみました(差し入れ待ってます!)

記事の末尾に、影織にお茶の差し入れができちゃうボタンを作って設置してみました笑


こんな感じです。
スクロールすれば、この記事の下にもありますよ。

こちらを読んでいて、記事末尾に「コーヒーをおごる」のボタンがあったのが面白いなぁと思い、自分でも設置してみたのです。


設置の仕方(簡易版・HTML, CSSがある程度わかる人向け)

ソースコード内で、ソーシャルアイコンの並びを指定しているところを見つけ出し、 の一行を追加しました。
Amazonであらかじめほしいものリストを作成しておき、href内に記入します。
fa fa-coffeeは、Font Awesomeという無料でかわいいアイコン集の中の、コーヒーカップのマークを指定している部分です。
CSSでボタン色も指定しましょう。


まとめ

エンジニアになり、「あっ、これちょっと実装してみたいな」と思ったらすぐ実現できるようになったので、なんだか嬉しいです。

今回アイコンで使ったFont Awesomeはかなり素敵なアイコンをさくっと使えて嬉しいので、後日また記事にまとめたいなと思います。

ちなみに、今回公開したお茶差し入れ用リスト以外に、ほしいものリストも公開しています。
「いつもブログ見てるし、何か贈ってあげようかなー」という方がいらっしゃったら、ぜひお願いします!

ブログ記事下にお茶の差し入れボタンを実装してみました(差し入れ待ってます!) ブログ記事下にお茶の差し入れボタンを実装してみました(差し入れ待ってます!) Reviewed by 影織 on 5月 31, 2018 Rating: 5