はてなスターのアイコンを日本酒アイコンにしてみた

公開日: : 最終更新日:2014/04/20 IT, はてな


日本酒大好きです。
というわけで、はてなスターを日本酒アイコンにしてみました。

その流れは以下にメモ。

 はてなスターの導入

  • WordPressに「Hatena Star」プラグインをインストール
  • 参考1を元に「Hatena Star」プラグインの設定で、「認証トークン」を記入
  • スターを表示させたい場所のタグ名とクラス名を記入。

    • このサイトだと、タイトルの箇所のタグが<h2 class=”title”>なので、タイトルの横に表示させるためにタグ名「h2」、クラス名「title」と記入。

これで、タイトルの横にはてなスターが表示されます。
今のままだとデフォルトのスター。

 はてなスターのアイコン変更

通常のスターもいいのだけど、ここは個性を出して自分用に変更。

はてなスターのアイコンの変更方法。

  1. アイコンをどこかしらにアップ。

    • アップしたアイコンのURLを用意(例:http://example.com/star.gif)
  2. CSSに以下を追加

    • 新しくはてな用のCSSを用意するもよし、どこかに追記するもよし
.hatena-star-star-image {
  background-image: url(http://exapmle.com/star.gif);
}

というわけで、はてなスターを日本酒アイコンにしてみました。
是非日本酒を出しまくってください。

 参考

  1. はてなスターをブログに貼り付ける – はてなスター日記
  2. もっとカスタマイズをしよう – はてなスター日記

広告

関連記事

datebox-date

jQueryMobileでカレンダー表示 -DateBoxプラグインの利用-

スマートフォン対応をしているとカレンダーの表示の仕方をスマートフォンらしくしたいことがあると思います

記事を読む

no image

MacBook ProにGitのインストール

MacBook ProにGitをインストールしようと思いたち、思ったより手間取ってしまったので備忘録

記事を読む

no image

ターミナルでgitのコマンドを補完したりブランチ名を表示する – macでgitを便利に使うために –

* やりたいこと macのターミナルでgitをいじっていると -今のブランチってなんだっけ? -g

記事を読む

no image

CakePHP1.3でスマートフォン対応

CakePHP1.3でスマートフォン対応のためにやったことをメモしておきます。 * 環境 -

記事を読む

Jenkins + iPhoneアプリ(番外1) -TestFlightを利用する-

* これまで - -- 執事(Jenkins)を雇いました。 * やりたいこと Jenk

記事を読む

iPhoneアプリ開発 芳名帳アプリ作成(2) -記帳画面作成-

* 今までの流れ - * 画面構成 今回の芳名帳アプリは以下の画面で構成しています。 -

記事を読む

Selenium2.0でUIテスト(1) -まずはPHPでやってみる-

久しぶりにSeleniumを触ってみました。 Selenium2.0から色々と変わったみたいで少々

記事を読む

WordPressプラグイン「WP Hatena Notation」にPullRequestを投げた話

WordPressではてな記法が利用できる「WP Hatena Notation」を重宝しています。

記事を読む

no image

Androidアプリ開発 -画像を加工してセピア色にしてみる-

* やりたいこと ギャラリーから選んだ画像を加工してセピア色にしたい * ソース ** 画像を取得

記事を読む

no image

jQuery Mobileのバージョンアップではまった – pushStateの存在 –

jQuery Mobileをつかってスマートフォン対応をしたときにはまったこと。 * 前提

記事を読む

広告

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

広告

no image
[感想] Effective Objective-C 2.0 ☆☆☆☆★(4.5)

* 構成 - 第1章 Objective-Cに慣れる -

no image
[感想] iOSアプリテスト自動化入門 ☆☆☆(3.0)

* 構成 - Chapter 1 テスト自動化への取り組み

DeployGateを試してみた(iOS編) -DeployGateがiOSに対応-

今までのDeployGate - -[http://pplace.

iPhone/iPadアプリを開発するためにやったこと

今までに、iPhoneを3本ほどリリース((リリースしたアプリは全て1

no image
ターミナルでgitのコマンドを補完したりブランチ名を表示する – macでgitを便利に使うために –

* やりたいこと macのターミナルでgitをいじっていると -今の

→もっと見る

PAGE TOP ↑