shinobi access log

web Font

2011年1月28日金曜日

【はてなスター】 Bloggerに“はてなスター”を設置する方法(How to put Hatena Star.)

Stars'n balls
Stars'n balls Photo by brockvicky



ブログに“はてなスター”を付けてみましょう!

前回“はてブ”をbloggerサイトに設置&表示させたので今回は“はてなスター”を設置してみようと思います。

前回エントリ
[はてブ] Bloggerに“はてなブックマーク”を設置する方法a??a?Re¨?ao?a?Ra? ̄a?|a?ae¢≪a??a??a? ̄a??a??a? ̄a?°


ではさっそく始めましょう!
流れを説明します。

1.はてなスターにアクセスし、ログイン
2.外部のブログサイトを登録
3.ブログに貼り付けるHTMLのコードが発行される
4.blogger(自分のブログサイトに行く)ログイン
5.テンプレートの内容を編集する
6.一部HLMLタグの書き換えと追加を行う
7.完成



1.はてなスターにアクセスし、ログイン
まずは「はてなスター」にアクセスし、ログインします。そしてトップページ中央にある「ようこそ、○○さん」のリンクまたは右上のメニューの「ホーム」をクリックして、ユーザーページにアクセスしましょう。



2.外部のブログサイトを登録
「外部のブログサイトを登録する」の下の欄にご自分のブログのトップページのURLを入力して「追加」ボタンを押してください。



3.ブログに貼り付けるHTMLのコードが発行される
すると、ブログが登録されて「トークン」が発行され、ブログに貼り付けるHTMLのコードが表示されます。
トークン = Hatena.Star.Token)



4.blogger(自分のブログサイトに行く)ログイン
自分のブログサイトに行ってログインしてください。

5.テンプレートの内容を編集する
ダッシュボードから以下の用にクリックして進みます。
ブログを管理 > デザイン > HTML の編集 > テンプレートを編集



そして「ウィジェットのテンプレートを展開」にチェックを入れます。ここがポイントです!



6.一部HLMLタグの書き換えと追加を行う
そしてまず</head>をさがして直前に、貼り付け用コードをペーストします。



次に<h3 class='post-title entry-title'>を探して以下の用に書き換えます。

<h3 class='post-title'>
<a expr:href='data:post.url' style='display:none;' title='permanent link'></a>




最後に「テンプレートを保存」をクリック


7.完成

Befor


After


Bloggerをお使いの皆さんも“はてなスター”の設置でお気に入りのスターマークを付けてもらいましょう♪


【あとがき】

実は“はてなスター”の付け方をGoogle先生に聞いていたところここに来ました!

はてなスターをブログに設置するには - はてなスター日記a??a?Re¨?ao?a?Ra? ̄a?|a?ae¢≪a??a??a? ̄a??a??a? ̄a?°

今読むと最初のところに書いてあったのですが「Hatena.Star.Token」の取得方法を飛ばして中盤のbloggerに設置する方法まで読み飛ばしてました<( ̄□ ̄;)>

なので遠回りですがココを見て初めて「Hatena.Star.Token」の取得方法が分かりました!

はてなスターをlivedoor Blogに設置する方法 - PictorialConnect
まず「Hatena.Star.Token」を取得するために、以下にアクセスする必要がある。
http://s.hatena.ne.jp/自分のはてなID/blogs
※ちなみに私はここでつまずいた。「Hatena.Star.Token」をどうやって取得するか検索しただけではわかりづらかったからだ。

私もつまずきました。そしてあちこち探してやっとここにたどり着いたわけです!




Kazwoo


関連する記事
はてなスターをブログに設置するには - はてなスター日記a??a?Re¨?ao?a?Ra? ̄a?|a?ae¢≪a??a??a? ̄a??a??a? ̄a?°
はてなスターとは - はてなキーワードa??a?Re¨?ao?a?Ra? ̄a?|a?ae¢≪a??a??a? ̄a??a??a? ̄a?°



0 件のコメント:

コメントを投稿