はてな

SOY JOY オリジナルいちごBlogパーツ

おもしろそうだったので、貼り付けてみました。 画面右上の「いちご」をクリックすると、いちごが降ってくるそうです。 「「drawr」「SOY JOY オリジナルいちごBlogパーツ」を貼り付けられるようになりました - はてなダイアリー日記」 http://d.hatena.ne.j…

コメント欄の名前(ユーザID)の後に改行を入れる方法

昨日のおなかさん(id:onakanotomo)からのコメントでご質問がありました。 コメント欄の名前(ユーザID)の後に改行を入れるには、次の記述をスタイルシートに追加します。 ご参考まで。 span.commentator{ display:block; }

「はてなリング」をほかのモジュールと同様にサイドバーに表示する

ビー玉クラブの「はてなリング」を昨日からサイドバーに表示させました。 「ロゴ貼り付けタグ」をそのまま貼り付けたら、サイドバーのほかの項目と同じフォーマットで表示されなかったため、次のようなタグを追加しました。 <div class="hatena-module"> <div class="hatena-moduletitle">はてなリング</div> <div class="hatena-modulebody"> <center> <hatena name="ring" rid="bdama" sid="53739"> </hatena></center></div></div>

コレクションページで多読した本の一覧を作成

ブログで多読記録をつけていますが、読んだ本を一覧で見られるようにしたい!と常々思っていました。 そこで、いろいろ考えた末、はてなブックマークのコレクションページを利用することにしました。 タグを使った分類もできるということで、はっきりシリー…

Amazonリンク(書影画像のみ)の表示位置の設定*1

選択しているテーマにより、「ISBN:4789725650:detail」と記述すると左寄せで表示されるのに、「ISBN:4789725650:image 」と記述すると右寄せで表示される場合があります。 これは、スタイルシートに次のように記述されていることが原因です。 img.asin { …

BlogPetの背景画像

エトワールさん(id:etoile1)のブログを見て、背景を変えたくなりました。 自分では描けないので、無料で利用できる背景画像を提供しているサイトを探しました。 素敵な画像がいっぱいです♪ 「BlogPet/ブログペット(こうさぎ)用背景画像リスト」 http://2…

BlogPet

モカさん(id:Remus)のブログを見て、BlogPetが はてなダイアリーでも使えることを知り、さっそく設置してみました。 6/24から利用できるようになったようです。 http://d.hatena.ne.jp/hatenadiary/20050624/1119589082 Blog Pet(ブログペット)は、Blog…

けたがずれるのを防ぐ方法

宿題メールの問題をブログに貼り付けた場合、けたがずれることがあります。 ジャン先生が紹介されていた「pre」タグを使う以外に、はてなダイアリーでは省略記法が用意されています。 (参考:http://guide.g.hatena.ne.jp/sugio/19010103#pre) 普通に貼り…

ブログモード

昨日から試しているブログモードですが、すでに元に戻したい気持ちになっています。 理由は、こんな感じです。 カウンターが余計に回ってしまう。 それだけコメントを下さる方の手間が増えているということですよね。 コメントのお返事を記事ごとに書くのは…

ブログモード

ブログモードが追加されたということで、さっそく設定を変更してみました。 一般的なブログのように記事ごとにコメントを表示するという形式に憧れていた時期もありましたが、最近は日付ごとの形式にすっかり慣れてしまいました。 とりあえず、様子見でしば…

色の選び方

はてなのデザインをカスタマイズするとき、一番悩むのは配色です。 以前は、カラーの一覧(色のサンプル)を利用して選んでいました。 「Color Table」 http://www.finitojapan.com/cltable.html でも、借り物の素材を利用した場合は、その素材の中に含まれ…

デザイン・マイナーチェンジ

春も終わりつつあるので、若干デザインを変えてみました。 今回素材を利用させていただいたサイトです。 自分では絵が書けないので、無料で利用できる素材サイトはありがたい存在です。 「自然いっぱいの素材集」 http://www.ne.jp/asahi/syaraku/kichinyado…

CSSセレクタ一覧

日記全体の構造とセレクタがわかりやすくまとめられています。 またデザインを変えたくなったときに使えそうなので、リンクを貼っておきます。 「はてなダイアリーガイド「CSSセレクタ」」 http://d.hatena.ne.jp/keyword/%a4%cf%a4%c6%a4%ca%a5%c0%a5%a4%a5…

Amazonリンクの画像の青い縁取り(枠線)を取る方法

フォトライフ以外に、スタイルシートの設定によりAmazonリンクの画像(「ISBN:〜:detail」など)にも青い縁取り(枠線)が付く場合があります。 これを取りたいときには、下記の記述をスタイルシートに追加します。 「ISBN:〜:detail」と記述する場合 im…

フォトライフの青い縁取り(枠線)を取る方法

フォトライフの写真を日記内に表示すると、青い枠線や下線が表示されることがあります。 もし、この枠線を表示させたくない場合には、 「管理ツール画面 > デザイン > 詳細デザイン設定」のスタイルシート欄に、次の内容を記述(追加)します。 img.hatena-f…

トラックバックについて

トラックバックに関する「はてなダイアリーガイド」のリンクを貼っておきます。 これを読むだけでも、ある程度、疑問点が解決できる方もいらっしゃるのではないでしょうか。 ただ、下記の自動トラックバック以外の方法でうまくいかないことがあるのは、私も…

スタイルシートの動的な切り替えは無理?

先日から、スタイルシートに記述を追加することで、コメント欄をデフォルトで非表示にしていますが、皆さんからいただいたコメントを見ると賛否両論のようです。 そこで、2種類のスタイルシートを用意しておいて、ボタンを押したら動的に設定を切り替えられ…

コメント欄の非表示

他社のブログでは、コメント欄が通常は非表示で、コメントを投稿する画面にだけにコメントを表示させるという形態のものがあります。 はてなでも、それに近いことができるようです。その方法は、スタイルシートに以下の記述を追加するだけです。 div.comment…

Amazonリンク(詳細)の書式設定

あきさん(id:akimirakuru)からコメントでご質問があったので、自分の設定を載せてみます。どなたかの日記やヘルプにも紹介されていたような気はしますが、見つからないので(^^ゞ 下記の記述をスタイルシートに追加すればOKです。色や線の設定はお好みのも…

はてなの新機能「Fotolife」

はてなダイアリーの編集画面に何やら「Fotolife」という新しいボタンが・・・ とりあえず、試してみます。(まだベータテスト中のようですが・・・) (左側:2週間前のピラカンサのミニ盆栽 右側:今日撮影したピラカンサのミニ盆栽) おぉー、写真が複数ア…

各種検索フォームの設置方法

以前の日記(http://d.hatena.ne.jp/tama_fk/20041014#p1)で、サイドバーにサーチボックス(検索フォーム)を複数設置したときに誤動作すると書きましたが、いまだ原因は不明です。 原因を追究するのが面倒になったことと、たぶん自分しか使わないんじゃな…

ナビゲーションバーの作り方

位置の調整以外はわりとカンタンです。 私はこんな感じで、HTMLとCSSを書いています。(その部分のみ抜粋) HTML部分はそのままでも、CSSを工夫すると枠色の濃淡でボタンのように見せたり、画像のボタンにしたりもできるようです。 【HTMLの例】 <div id="nav"> <a href="リンク先のURL">コンテンツ</a></div>…

日記の索引を作る方法

以前書いた記事をまとめて一覧で見たい!と思い、下記のページにたどり着きました。100日分しか一覧表示できないようですが、サイドバーに表示させるよりは見やすいかなと思います。http://d.hatena.ne.jp/xppm/20040626 これを応用して、日記内で言及したUR…

ヘッダやフッタの好きな場所に何かを入れる方法

サイドバーをつけたデザインにしていると、日記本文の上にだけ文字を書きたいとか、サイドバーと日記本文の両方の上に何かを入れたいという希望が出てきます。HTMLがちゃんとわかっている方なら、すぐにわかることなのかもしれませんが、私はよくわからず悩…

今日明日中には完成させたいな(^^)

カスタマイズもだいぶ進んできましたが、あともう一息というところです。細かいところは後回しにして、今までサイドバーに入れていたプロフィールやカテゴリのドロップダウンボックス、PageViewなどをヘッダに持っていこうと思っています。さて、上手にでき…

カスタマイズされたはてなダイアリーの例

はてなダイアリーをカスタマイズしたい!と思っても、どういうふうにカスタマイズ可能なのかがイメージできないと難しいですね。そこで参考にしていたのが、いろいろな方のカスタマイズされたページをサムネイル版で紹介しているページです。 個性豊かなペー…

コメントとトラックバック部分のカスタマイズ

今日は、ずっと気になっていたコメントとトラックバック部分のカスタマイズをしてみました。 今回行った内容は、「ポータル、プロバイダ別blogデザインカスタマイズ事典」に載っている内容を、ほぼそのまま適用しています。 この本は白黒のページで、色の感…

素材の調達先

本当は自分で壁紙やアイコンを作りたいのですが、センスがないのでフリー素材を使わせてもらっています。いろんなサイトが山ほどあるのですが、私は次のサイトを利用させてもらっています。 「フリー素材集 Little Garden」http://cutenao.cool.ne.jpフッタ…

スタイルシートのテスト用HTMLとはてなヘッダ色サンプル

昨日の日記のコメントでkanataさんから、「スタイルシートのテスト用HTML」のページを教えていただきました。 http://yokohama.cool.ne.jp/alisato/hatena/index.shtmlローカルな環境にダウンロードして、スタイルシートのテストを行えるというものです。ほ…

サイドバーの作り方

私は、たくさんのモジュールを表示させたいので、右と左の両方にサイドバーがある「3カラム(3段組)」スタイルにします。既存のテーマが選択された状態で設定すると、なかなかうまくいかないのですが、シンプルな状態に戻してから行うと案外カンタンにでき…