カテゴリ:ブログツール( 20 )

2008年 09月 27日
コメント欄の作成について2
下の投稿は、ややこしく書かれていたかもしれません。
ちょっと簡単に書きます。

スキン編集のCSSをコピーアンドペーストでテキストエディタなどに表示させます。
そのCSSのソースの以下の部分を編集してください。

<コメント欄上部に画像を入れたい時>
DIV.COMMENT {
・・・
}

を探してください。ここを編集します。
BACKGROUND-IMAGE :url(画像URL) /* コメント全体部分の背景画像です */
BACKGROUND-REPEAT:NO-REPEAT; /* コメント全体部分の背景画像をリピートするかどうかです */
このソースを } (閉じカッコ)の手前に追加してください。
また、PADDING-TOPというソースがあればここで画像を表示する高さを指定しますのでサイズを変更してください。
ない場合は、付け加えてください。
PADDING-TOP : 190PX; /* コメント欄上部のサイズ(ここに画像を入れるためにサイズを調整してください) */

<トラックバックに画像を入れたい時>
DIV.TRACK_TOP {
・・・
}

を探してください。ここを編集します。
BACKGROUND-IMAGE :URL(画像URL); /* トラックバックURLが表示されている部分の背景画像です */
BACKGROUND-POSITION:100% 100%; /* トラックバックURLが表示されている部分背景画像の拡大率です */
BACKGROUND-REPEAT:NO-REPEAT;} /* トラックバックURLが表示されている部分の背景画像をリピートするかどうかです */
このソースを } (閉じカッコ)の手前に追加してください。

by buebue | 2008-09-27 10:55 | ブログツール | Trackback | Comments(2)
2008年 09月 27日
コメント欄の作成について
コメント欄について質問がありましたので、わかる範囲で書きます。

<画像の作成>
コメント欄上部に表示したい画像を作成しておきます。
また、トラックバック部分にも画像を貼り付けたい場合はそれも作成してください。
<画像のアップ>
作成した画像をスキン編集部分にある「マイイメージアカウントにイメージ登録」部分から登録してください。
登録した画像のURLをメモ帳などにコピーしておいてください。

<スキン編集>
スキン変更で、CSSの部分をテキストエディタにコピーしてください。

その中のコメント欄部分とトラックバック部分を編集します。
(元に戻せるようにコピーをとっておくことが重要です)
コメント欄とトラックバック部分に当たるのは以下の部分です。
DIV.COMMENT コメント全体部分
DIV.COMMENT_BODY コメント表示欄
DIV.COMMENT_TAIL commented by...欄について
DIV.COMMENT_INPUT コメント入力欄について
DIV.COMMENT_LINE コメント欄全体について
DIV.TRACK_TOP trackback情報部分


コメント欄の背景画像表示はDIV.COMMENT_BODY部分を編集していれます。
トラックバックの背景画像表示はDIV.TRACK_TOPを編集します。


編集内容については、下の枠欄に各部の説明をつけた私のCSSの該当部分を貼り付けておきますので、これの必要な部分をコピーしてを好きなようにいじってください。


CSS

/* ---------------コメント全体部分--------------- */
DIV.COMMENT {
MARGIN-TOP : 10PX;/* ---記事とコメント全体部分との間隔です--- */
MARGIN-BOTTOM : 10PX;/* ---コメント全体部分と下の部分(次の記事もしくは<前のページなどとの距離です--- */
BORDER : 2PX #696969 DOTTED;/* ---------------コメント全体部分の枠線のサイズ・色・線種です--------------- */
BACKGROUND : #000000 url(http://pds.exblog.jp/pds/1/200802/16/30/comment2.jpg) no-repeat;/* ---コメント全体部分の背景画像です--- */
COLOR : #000000;/* ---コメント全体部分の文字色です--- */
PADDING : 20PX;/* ---コメント全体部分(枠で囲まれた部分と記事全体部分の幅との間隔です--- */
PADDING-TOP : 190PX;/* ---コメント欄上部のサイズ(ここに画像を入れるためにサイズを調整してください)--- */
}

/* ---------------コメント表示欄について--------------- */
DIV.COMMENT_BODY {
BACKGROUND-COLOR : #FFFFFF;/* ---コメント表示欄の背景色です--- */
BORDER-TOP : 1PX DOTTED #999966;/* ---コメント表示欄の縁(上)の線種と色です--- */
BORDER-BOTTOM : 1PX DOTTED #999966;/* ---コメント表示欄の縁(下)の線種と色です--- */
BORDER-LEFT : 1PX DOTTED #FFFFFF;/* ---コメント表示欄の縁(左)の線種と色です--- */
BORDER-RIGHT : 1PX DOTTED #FFFFFF;/* ---コメント表示欄の縁(右)の線種と色です--- */
MARGIN-TOP : 5PX;/* ---commented by...とコメント表示欄との間隔です--- */
LINE-HEIGHT : 100%;/* ---コメント表示欄の行間隔です。100以下にすると文字が重なります。行間隔を広げたいときは100以上を指定--- */
PADDING : 5PX ; BACKGROUND : #F8F8FF;/* ---コメント表示欄の縁から文字との間隔(空き)です--- */
COLOR : #000;/* ----------コメント表示欄の文字色です---------- */
}

/* ---------------commented by...欄について--------------- */
DIV.COMMENT_TAIL {
MARGIN-TOP : 10PX;/* ---コメントとコメントの間隔です。(コメント上部の空き)--- */
MARGIN-BOTTOM : 5PX;/* ---commented by...とコメント表示欄との間隔です(DIV.COMMENT_BODY部との合計になります)--- */
BORDER : 1PX #999966 SOLID;/* ---commented by...欄の縁の線種と色です--- */
BACKGROUND-COLOR : #005555;/* ---commented by...欄の背景色です--- */
FONT-FAMILY : VERDANA, TAHOMA;/* ---commented by...欄の文字種です--- */
FONT-SIZE : 8PT;/* ---commented by...欄の文字サイズです--- */
COLOR : #99cccc;/* ---commented by...欄の文字色です--- */
}

/* ---------------コメント入力欄について(入力欄上のダブルから送信ボタンまで含みます)--------------- */
DIV.COMMENT_INPUT {
HEIGHT : 20EM;/* ---コメント欄の高さです--- */
FONT-SIZE : 11PT;/* ---コメント表示欄の文字サイズです--- */
MARGIN-TOP : 15PX;/* ---コメント表示欄とコメント表示欄の間隔です--- */
BORDER-TOP : 3PX #AAA DOUBLE;/* ---コメント表示欄上部にある線種です--- */
PADDING-TOP : 5PX;/*---コメント表示欄上部の線とコメント入力欄の間隔です--- */
MARGIN-BOTTOM : 2PX;/* ---コメント欄下部の高さです。こことHEIGHTで調整してください--- */
}

/* ---------------コメント欄全体について--------------- */
DIV.COMMENT_LINE {
BORDER-TOP : 3PX #AAA DOUBLE;/* ---トラックバック表示欄上およびコメント表示欄上の線種と色、サイズです。--- */
MARGIN : 10PX 0PX 15PX;/* ----------線の上部・横・下部の間隔です---------- */
}

/* ----------trackback情報部分---------- */
DIV.TRACK_TOP {
LINE-HEIGHT : 170%;/* ---トラックバックURL トラックバックするが表示されている部分の大きさです--- */
COLOR : #999966;/* ---トラックバックURL:・・・部分の文字色です--- */
BACKGROUND : #FFFFFF;/* ---背景色です--- */
BORDER-TOP : 2PX DOTTED #999966;/* ---トラックバックURL トラックバックするが表示されている部分の枠線(上部)の線種・サイズ・色です--- */
BORDER-BOTTOM : 2PX DOTTED #999966;/* ---トラックバックURL トラックバックするが表示されている部分の枠線(下部)の線種・サイズ・色です--- */
BORDER-LEFT : 2PX DOTTED #999966;/* ---トラックバックURL トラックバックするが表示されている部分の枠線(左部)の線種・サイズ・色です--- */
BORDER-RIGHT : 2PX DOTTED #999966;/* ---トラックバックURL トラックバックするが表示されている部分の枠線(右部)の線種・サイズ・色です--- */
BACKGROUND-IMAGE :URL(http://pds.exblog.jp/pds/1/200802/16/30/comment3.jpg);/* ---トラックバックURL トラックバックするが表示されている部分背景画像です--- */
BACKGROUND-POSITION:100% 100%;/* ---トラックバックURL トラックバックするが表示されている部分背景画像の拡大率です--- */
BACKGROUND-REPEAT:NO-REPEAT;}/* ---トラックバックURL トラックバックするが表示されている部分の背景画像をリピートするかどうかです--- */
}

該当するCSSを変更したら、それをオリジナルのCSSの該当部分と差し替えてください。
それをコピーアンドペーストしてスキン編集のCSS編集部分と差し替えます。
/* -----と---- */に囲まれた部分は残しておいても支障はありません。

あまり説明になっていないかもしれませんが、チャレンジしてみてください。
オリジナルのCSSのコピーを保存していれば元に戻せますので怖いものなしです。
わからなければコメント欄に質問を入れておいてください。
(わかる範囲でしか答えられませんけど)

追伸:Firefoxというブラウザーをインストールして、Firebugというアドオンをダウンロードして使うと、CSSの何を変更するとどう変わるかをリアルタイムで表示することができて便利ですよ。設定が書き換わるわけではないので心配もありません


by buebue | 2008-09-27 00:39 | ブログツール | Trackback | Comments(4)
2007年 06月 28日
どうも昨日は網走にいたようです。
2日続けてブログツールについてです。
昨日紹介した「Geo Visitor」
会社からアクセスして見ました。
a0060230_7584313.gif

どうも会社は網走にあったようです。
秋葉原の近くだと思っていたんですが、勘違いだったようで(笑
IPの割り当てがそうなっているのか?ネットワークには詳しくないのでわかりません。

by buebue | 2007-06-28 06:55 | ブログツール | Trackback | Comments(12)
2007年 06月 27日
久々にブログツールの話題
ClustrMapsが月毎の更新になってしまって、もっと面白いツールはないかなぁと物色してみたら、Geo Visitorというものがありました。
24時間以内にどこからアクセスがあったか表示してくれるツールです。
残念ながらClustrMapsのようにブログにビジュアルで表示というわけには行かないのですが、これが意外と面白いのです。
ちなみに設置した直後の様子。
クリックすると拡大しますa0060230_7101738.gif

viewがWorldになっている場所をShowYourselfに替えると自分のアクセスポイント近くが表示されます。
(あくまでアクセスポイントであって、今アクセスしている場所ではありません)
クリックすると拡大しますa0060230_711130.gif

地図はgoogleMapなのでもっと拡大してみましょう。
クリックすると拡大します a0060230_7104234.gif

自宅はもっと左下に見える狭山湖・多摩湖のそばなんですが、所沢駅前にアクセスポイントがあるようです。
試してみてください。
試し方は右メニュー中央にGeo Visitorのバナーがあるのでクリックすればいいです。
設置は簡単なのでいかがですか?
設置方法は
ここの「GeoVisitor」をクリックして右上のタグを自分のブログのトップ(orメニュー)ページの
どこかに貼り付ければいいです。

by buebue | 2007-06-27 06:50 | ブログツール | Trackback | Comments(10)
2006年 06月 03日
6/3 雨 アドバンス
今日も雨で出かけてません。
ネームカードに登録すると画像容量が1GBにアップされるらしいです。
私の現在の使用量は380MBくらいです。
アドバンス会員になって無制限にはなっているんですけど、アドバンスを解約することも
進めているような感じになっているので・・・・。なんなんだろ??
思い切って解約手続きとってしまいました。
容量足りなくなったら再契約したいと思います。
前の記事消えたりしないですよね?エキサイトさん。

by buebue | 2006-06-03 15:46 | ブログツール | Trackback(2) | Comments(27)
2006年 04月 10日
4/10 曇時々雨 タグ機能つきましたね。
エキサイトブログはずっとカテゴリだけだったので、私のように記事の中に色んなレンズや色んな場所を載せている場合はカテゴリとしても分類ができなくて今のようなアバウトな分類をしていたんですけど、
タグ機能
がついて、ようやくレンズごと場所ごとに分類できそうです。
ひとつの記事でタグは3つ付けられるんだそうですけど、できれば5つくらいにして欲しかったなぁ。
ちょっとづつ過去記事にタグをつけて行きます。
場所や、レンズで記事がすばやく見られるようにできると訪問してくださる方も見やすいんじゃないでしょうか。

エキサイトさん。タグの入れ替えできるようにして欲しいなぁ。

by buebue | 2006-04-10 20:50 | ブログツール | Trackback | Comments(8)
2006年 03月 08日
3/8 晴れ ウェブ翻訳機能
ブログの記事にEnglish Hereとつけてますが、これはエキサイトのウェブページ翻訳を使ってます。
調べてみたらいろいろなウェブページ翻訳がありましたので、ちょっと遊んでみたいと思います。
この記事を翻訳するとつまらないので、短めの過去記事をチョイスしました。
ちょっと前ですが懐かしい記事だと思います。
エキサイト翻訳は今まで原文を載せていなかったのですが載せることもできます。

エキサイトウェブページ翻訳→English Here
@nifty翻訳→English Here
Yahoo!Japan翻訳→English Here
OCN翻訳サービス→English Here

どうでしょうか?どの翻訳が一番原文に近いのかな?
 エキサイト翻訳はスタイルが崩れてますね。おまけに日本語と英語が同じ白字なので見難いですね。
 yahoo!japanはその点優秀かも、でも日本語とちゃんぽんになってますね。
 @niftyとOCNは同じトランスレーターでしょうか。結構優秀です。英語が緑だと私のコメント欄は見難いですね。
ちなみにすべて中国語・韓国語にも翻訳できます。
フランス語やスペイン語やイタリア語は英語を介さないと翻訳できないですね。
皆さんも試されてはいかがですか?

追記:英語・中国語・韓国語翻訳以外のいい翻訳ページを見つけました!
   ワールドリンゴ コンピュータ翻訳
でも、翻訳がどうなってるか(正しいのか)分かりません。
Japanese→French
Japanese→German
Japanese→Dutch
Japanese→Italian
Japanese→Spanish
Japanese→Greek
Japanese→Portuguese(Brazilian)
Japanese→Russian

by buebue | 2006-03-08 22:57 | ブログツール | Trackback | Comments(20)
2006年 02月 28日
2/28 曇り時々雨 FIREFOX
inariwanさんとこのコメント欄がかっこよくなっていたので拙もと思い、ちょっといじってみました。
あんまりセンス良くないぞー!
緑が好きなんで・・・・なんていいわけを・・・。
スキンいじるときにはスキン編集のプレビューが簡単にできるMozilla Firefoxが便利ですね。
こんな感じで表示できます。
a0060230_2315672.jpg
左のスキンをいじると右に即座にプレビューされます。
(保存されるわけではないので、気に入ったらテキストエディタなどにコピーアンドペーストして保存しておきましょう。)
人のページを開くと、人のスキンを見ることもできます。
研究するのにもいいですよ!

PS:今日のサッカー・・・・orz・・・・・・・もうだめだ。小野ちゃん怪我しないでね。




と思ったら。ヒデが最後の最後で入れてくれました。根性見せてくれてアリガト!

by buebue | 2006-02-28 23:16 | ブログツール | Trackback | Comments(18)
2006年 02月 27日
2/27 istDS2 77mm
English Here
検索サイトで、istDS2 77mmを検索するとほぼ上位で自分の記事がヒットすることを知りました。
yahoo!japan : blogが1,2位 3位に私の投稿した写真の記事
yahoo.com : blogが4位 1位に私の投稿した写真の記事
yahoo.uk : blogが3位 1位に私の投稿した写真の記事
google : blogが2位 1位に私の投稿した写真の記事 3位に私の記事のトラックバック
goo : blogが2,3位 1位に私の投稿した写真の記事 3位に私の記事のトラックバック
infoseek : gooに同じ
livedoor : gooに同じ
msnサーチ : 1位に私の投稿した写真の記事 4位にblog

せっせと77mmでとり続けた成果でしょうか。ちょっとうれしい!
世界に広げよう77mmの輪!

by buebue | 2006-02-27 22:05 | ブログツール | Trackback | Comments(14)
2006年 02月 26日
動画:FLIPCLIPの使い方について
FLIPCLIPでの動画のアップ

1.FLIPCLIPのホームページに行く。

More

by buebue | 2006-02-26 20:00 | ブログツール | Trackback | Comments(18)