■ウェブサイト管理:ブログカスタマイズ 記事一覧■
[SBM]日本のソーシャルブックマークサービスアイコン  2011年09月05日
[ブログ]あれ、背景の幅が足りてない?  2011年09月04日
[EUC-JPから]Livedoor Blogの文字コード変更[UTF-8へ]  2010年02月17日
[Tumblr.]投稿ボタンをLivedoorブログに設置  2010年01月28日
[Twitter]フォローして!とサイトやブログで表明  2010年01月20日



2011年09月05日

[SBM]日本のソーシャルブックマークサービスアイコン


こんばんは、蛛賢です。
海外のソーシャルブックマークアイコンは、かなりの数が高品質、フリーで見つかるのですが、
日本のそれってなかなかないんですよね。 

はてなブックマークや、ライブドアクリップなどがそれに当たります。

del.icio.usなどは豊富にあるんですよね。
Yahoo!も見つかるんですが、Japanは紫色じゃないんですよね~(わがまま?) 

リメイク予定のサイトにはJavascriptの関係で、ベタにリンクを貼らなければならないため、アイコンが必要となりました。 
(その他のサイトはAddClipsを現役使わせていただく予定です)

…で、見つけました。可愛い20x20サイズのアイコンです。 

こちらのサイトさまの丸型アイコンを利用させて頂きます。
http://sozai.any-style.net/twitter/mt334.html



at 03:22|Edit

Comment

2011年09月04日

[ブログ]あれ、背景の幅が足りてない?


こんにちは、蛛賢です。
タイトル通りなんですが、普段ブラウザはChromeを用いており、全く気付きませんでした。
Internet Explorer 7 では、このブログの背景の幅が足りていないんですね。

IE8以降、Firefox 3、Opera、そしてChromeでは大丈夫なので、原因がよく分かりません。
CSSと半日ほど、にらめっこしているんですけどね…、なんだろ。
HTMLの方かな?

あと、気付かれた方も居られると思いますが、CSS3に対応しているブラウザだと、
このブログ、角丸&影付きになっていますよね。

CSS3になって、あの四隅を角丸にしたり影付きにしたりするのが簡単になりました。
以前は画像使ったり試行錯誤だったんですけどね…。 

何はともあれ、お目汚し失礼致しております…。

※ 解決

すっごい残念な結果なんですが、コメントアウト「//」でなく「/* */」でしないといけなかったようです。
最近のブラウザだと「//」でもOKで… ってのがあるようです。

まぁ…、今回の問題の他にも、IE6や7に対応させるために、色々と創意工夫(ハック)が必要のようですね。 

トホホ…。

*別件 : floatした際の対応(参考にさせて頂きました)
http://css.webcreativepark.net/tips7

at 14:42|Edit

Comment
2010年02月17日

[EUC-JPから]Livedoor Blogの文字コード変更[UTF-8へ]


こんにちは、蛛賢です。
当ブログが一時期機能していなかったと思いますが、
文字コードの変更作業を行っておりました。見に来られた方にはご迷惑お掛けしました。

具体的に何をしたかったのかというと、

・古いLivedoor Blogの仕様がEUC-JPであり、新しい仕様がUTF-8である。
・UTF-8にすることでグローバル(?)に…(中華圏の方も安心して来てね!)
・DISQUSコメントを導入する際の文字化け対策


一番下が引き金だったりするんですけどね。
既に変わってますけど、DISQUSを導入しました!皆さんコメントしてね!

文字コード変更の手順(そのままのURIを使いたい場合)

1.(有料ブログ前提)ブログの記事をエクスポートする。
2.ブログパーツ等は削除されるので、並び順をメモする。
3.フリーエリア内に記述していた内容をコピペでも何でもいいので記録する。
4.テンプレートをカスタマイズしていたら、それを記録しておく。

5.新しいブログを作成する。
6.エクスポートしたHTMLファイルをインポートする。
7.新ブログを課金して、エクスポート機能を使えるようにする。
8.エクスポートする。

9.元々作成していたブログを削除する。
10.同じ名前でブログを作り直す(UTF-8になる)
11.インポートし直す。
12.ブログパーツやテンプレートを設定し直す。

この後は、課金するなり、画像をアップロードし直すなり…です。
ちなみに画像アップロード機能でアップしていた画像は消えます。
livedoor PICSに上げている画像は消えませんので、退避させても良いかと。

あと、インポートの段階で個別記事のURIも全て変更されてしまうので、
Google先生の巡回を待つことと、記事ランキング等のURIの変更が必要です。
javascriptのcharset=euc-jputf-8に変更する箇所もあるかもですね。

課金途中のブログを削除すると、残り課金期間が残っていてもゼロになります。
5.のブログを結局課金するので、メインブログにすることも考えられますね。
独自ドメインの方は、転送先をこちらにすれば良いのではないかと思います。

私の場合は http://blog.livedoor.jp/yzatz/ がメインの期間もあり、
相互リンクの皆さんの中には、こちらでリンクを貼ってらっしゃる方が居たので、
そのままに致しました。数手間増えましたけどね。

以上です。

この件で、livedoorサポートの方に大変お世話になりました。
この場を借りて御礼申し上げます。

at 21:13|Edit

Comment
2010年01月28日

[Tumblr.]投稿ボタンをLivedoorブログに設置


こんばんは、蛛賢です。
蛛賢のTumblr.の方も興味のあるサイトがあれば誠意更新中でございます。
(自動的にTwitterにも反映されるので便利ですね)

今回は、このTumblr.を投稿するためのボタンをライブドアブログに設置する方法です。
javascriptを利用しています。

以下のブログ記事を参考にさせて頂きました。
自分のブログに「Tumblrに追加するボタン」を設置する

何が違うかと言うと、Livedoorブログの独自タグを使うことで、
トップページのブログ記事一覧毎に使え、各記事のURIで登録ボタンを作成できます。
(日本語が良く分からないかも…;)

Livedoorの独自タグを用いないの方法だと、トップページに貼られたボタンは
そのトップページのURIのみでしかTumblr.投稿できないってわけですね。
各記事それぞれのURIがありますので、それに基づいての投稿リンクを、
同じページ内(トップページなど)に存在しつつも作成します。

<a href="javascript:var d=document,w=window,e=w.getSelection,k=d.getSelection,x=d.selection,s=(e?e():(k)?k():(x?x.createRange().text:0)),lhref='<$ArticlePermalink$>',dtitle='<$ArticleTitle ESCAPE$>',f='http://www.tumblr.com/share',l=d.location,e=encodeURIComponent,p='?v=3&u='+e(lhref) +'&t='+e(dtitle) +'&s='+e(s),u=f+p;try{if(!/^(.*\.)?tumblr[^.]*$/.test(l.host))throw(0);tstbklt();}catch(z){a =function(){if(!w.open(u,'t','toolbar=0,resizable=0,status=1,width=450,height=430'))l.href=u;};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else a();}void(0);"><img src="○○○" height="16" alt="add Tumblr" style="border:none;vertical-align:bottom"></a>

○○○の部分に自分の用意した画像を貼りつけてみてください。
また、imgタグではなくテキストでもいいかも知れません。

上記のタグを<div class="blogbody">内に入れると機能するかと思います。

また、工夫すれば他のブログバージョンも簡単に作れそうですよね。
(ちなみに動けば良いやの駄改造なので、コード内容についてはご容赦下さい…)

以上です。

サンプルはこの記事の上下に設置しているアレです(笑)

at 22:04|Edit

Comment
2010年01月20日

[Twitter]フォローして!とサイトやブログで表明


Twitterでは、ブログよりも高頻度で発言中の蛛賢です。

さて、お気づきの方も居られるかも知れませんが、
不撓不屈ブログの右側に「Follow Me」なんていう
「あなたがもしTwitterをしてるなら友達になりましょう!」

という縦長のボタンバナーが貼り付いています。
画面をスクロールしても一定の場所を同期してスクロールします。

これは、GO2WEB20.netのサービスの一つです。
「Twitter "Follow" Badge for your site/blog」

英文のサイトですが、書かれていることはそう難しくないので、
簡単にタグ生成までいけると思います。(scriptタグで始まるHTMLソース)

生成したタグを自分のサイトのソースに貼り付けるだけでOKです。
貼り付ける場所は、BODYタグの中であれば、どこでも良いでしょう。

Livedoorブログの場合、つまり私の場合は、
トップページ、個別記事ページ、カテゴリアーカイブ、月別アーカイブ、
の全ての</body>の一歩手前に貼りつけています。

以上です。

みなさん、もしTwitterユーザであるなら友達になりましょう

at 16:22|Edit

Comment