ひさびさカスタマイズ

地獄変00さんのlivedoor Blogのテクニック集を参照にいくつかマイナーチェンジを行ってみました。こちらのリンク集は御自身のカスタマイズを含めて使えるテクニックばかり載っています。 色々と参考にさせていただいた沢山のサイト様本当にありがとうございました。 ひさびさのカスタマイズでなんか楽しくなってはまってしまいました。うまくいかないと苦しんですけどね(/TДT)/あうぅ・・・・。 【コラム開閉機能の変更】 以前こちらで紹介したコラム開閉ですが、チェックボックスを色々と変更できるようなので、infinite loopさんの誰にでも出来るコラムの開閉講座！！の記述どおりに前使っていたものから、Java Scriptも変更してチェックボックスとボックスの配置を右にすることに挑戦してみました。 とてもわかりやすい説明なので、説明どおりやると出来ると思います。最後にアップロードしたあとにプラグインの追加から、アップしたURLを指定してあげるを最後に行ってください。慣れている方はわかるかもしれませんが。 あと、実装時に気づかなかったのですが、このボタンをタイトルの下ではなく、左にしたり右にしたりする配置についての記事もここで解説していただいています。 ただ色々やったのですが、全部にやろうとすると、左だけタイトルが右寄せになったり、タイトルが上に上がったりしてしまって、なかなか全部に適応できませんでした（泣） 今日改めて配置の記事を見ながらやってみました。なんと二行ぐらい見落としていました。『marginの設定で、margin:-18px 5px 0px 5px;の様にトップ側をマイナスで指定してください。』ということで、マージンをマイナスにすればタイトルが上にいってしまうのを修正できました。これはボタンを上に上げてタイトルにあわせているのかなと思います。デフォルトではタイトルより下がった感じになるみたいです。 これがわからず色々どこが悪さしているのか結構調べてちょと大変でした。ちゃんと説明いただいていました。しっかり熟読しないといけないですね。 あと、デザインはアップするJava Scriptファイルに記述しますが、頻繁にボタンのデザインを変えたい方は、Open Fieldさんのサイドバーの開閉＆サイドバーの開閉スクリプトをちょこっと修正という記事を参照されるといいでしょう。ボタンデザインをスタイルシートに出す設定について書かれています。 ちなみに私の設定はこういった感じです。 [js] function toggleOpenClose(id,val){ if(val == "−"){ document.getElementById(id).style.display = "none"; document.getElementById(‘btn’ + id).value = "＋"; } else{ document.getElementById(id).style.display = "block"; document.getElementById(‘btn’ + id).value = "−"; } } function getButton(obj, i , sInner , bDefaut){ var ret; var val; if ( bDefaut ) { val = "−"; } else { val = "＋"; } ret = ‘<label for="btncolumn’ + i + ‘">’ + sInner + ‘</label>’ + ‘<div align="right"><input type="button" class="sidebtn" value="’ + val + ‘" id="btncolumn’ + i + ‘" onclick="toggleOpenClose(¥’column’ + i + ‘¥’,this.value);"/></div>’; obj.setAttribute("id", ‘column’ + i); return ret; } var aryTitle = new Array(); var aryDefault = new Array(); aryTitle[5] = "Search this Blog"; aryDefault[5] = true; aryTitle[10] = "Categories"; aryDefault[10] = true; aryTitle[11] = "Access Ranking[Total]"; aryDefault[11] = true; aryTitle[15] = "Archives"; aryDefault[15] = true; aryTitle[20] = "Recent Comments"; aryDefault[20] = true; aryTitle[25] = "Recent TrackBack"; aryDefault[25] = true; aryTitle[30] = "nikkansports.com"; aryDefault[30] = true; aryTitle[31] = "Advertise"; aryDefault[31] = true; aryTitle[35] = "Recommend Item"; aryDefault[35] = true; aryTitle[40] = "Blogs"; aryDefault[40] = true; aryTitle[45] = "Recent Entries"; aryDefault[45] = false; aryTitle[50] = "My Homepage"; aryDefault[50] = false; aryTitle[55] = "Profile"; aryDefault[55] = false; aryTitle[60] = "Links"; aryDefault[60] = false; aryTitle[65] = "MyblogList"; aryDefault[65] = true; aryTitle[70] = "BlogPeople"; aryDefault[70] = true; aryTitle[75] = "Information"; aryDefault[75] = true; aryTitle[80] = "TrackBack People"; aryDefault[80] = true; aryTitle[85] = "BBS"; aryDefault[85] = true; aryTitle[90] = "INTERNET Watch"; aryDefault[90] = true; aryTitle[95] = "Amazon Web"; aryDefault[95] = true; var aryDiv = document.getElementsByTagName("div"); var sTmpInner; for(var j = 0; j < aryDiv.length; j++){ if(aryDiv[j].getAttribute("class") == "sidetitle" || aryDiv[j].getAttribute("className") == "sidetitle"){ sTmpInner = aryDiv[j].innerHTML; for(var i = 0; i < aryTitle.length ; i++){ if (sTmpInner.indexOf(aryTitle[i]) != -1 ) { aryDiv[j].innerHTML = getButton(aryDiv[j+1], i , sTmpInner , aryDefault[i]); } } } } if(document.getElementById){ document.writeln(‘<style type="text/css" media="all">’); document.writeln(‘<!–‘); for(var i = 0; i < aryDefault.length ; i++){ if( aryDefault[i] ){ document.writeln(‘#column’ + i + ‘{display:block;}’); } else { document.writeln(‘#column’ + i + ‘{display:none;}’); } } document.writeln(‘–>’); document.writeln(‘</style>’); } [/js] スタイルシートの方は、 [css] .sidebtn{ margin:-17px 0px 0px 0px; font-size:xx-small; color:#697497; padding:0; background:#EAEAEA; border:1px solid #FFFFFF; } [/css] としています。ポイントは、やはりマージンをマイナス指定することでしょうか。 【トラックバックURLを扱いやすくする】 トラックバックをワンクリックで選択し、コピーできるようにする。パンパでガウチョさんのトラックバックURLをワンクリックで選択可能にという記事を参考に出来ました。 そして、ボタンを押すことで、クリップボードにコピーできる機能。これはIEのみでの動作なので、その点だけは意識するといいのかもしれません。最近はOPERAやFireFoxなどが人気ですからね。地獄変00さんのlivedoor BlogにTrackbackURLコピーボタンをつけるを参考につけました。 私の場合、コピーボタンとトラックバックURLがちょっと離れてしまったので、スタイルシートをいじって近づけました。 【コメント投稿者情報をクッキーに記憶を標準のものに変更】 以前地獄変00さんの記事を参考につけた機能ですが、livedoorで標準で対応したようですので、クッキーに投稿者情報を記憶〜標準機能編の記事を元に戻しました。ただ記憶してもすぐ消えてしまうような気がするんですが・・・。一応IEの設定でクッキー許可にしたりしてみたんですが、どうにも駄目です。 今後の課題ということで、わかりしだい追記したいと思います。 【サイドバーの頂いたコメント欄をツリー表示にした】 弱小エンジニアの小言さんのミニカスタマイズ　１６を参考に実装してみました。 うちはタイトルが長い記事が多かったので、おかげさまでいっきにすっきりしました。ありがたいものをつくっていただきました。 私の設定はこんな感じです。 [js] comment_convert_treeview( "Recent Comments", &quot;&amp;nbsp;&amp;nbsp;Ｌ&amp;nbsp;&amp;nbsp;&quot;,"","links","ガルティエ","" ); [/js] 説明のページにありますが、括弧内の””で囲まれているところが引数となります。左から第一引数で、この中には自分のブログのコメントのタイトルを記述します。 第二引数には、使いたい記号を。私のサイトの場合は”L”こういうマーク。前と後ろにある「&nbsp;」半角スペースをあけるというHTMLの記述です。この記述だと記号の前後に全角スペースがある感じでしょうか。 第三引数には名前の後ろにつける敬称をつけることができるようです。私の場合、ここはなにもいれないという意味で説明ページにあるように、””で囲って第五引数、第六引数は設定しなかったのですが、それだと「さん」とみんなについてしまっていました。そのため第五引数、第六引数を設定することで、つけないようにできました。これは以前はあたらしく機能を追加されたそうなので、その関係かもしれません。 第四引数には、設置場所のIDをかくようです。なくてもいいようですが、３カラムにしていて右にしている場合などは、”link2″などと指定するといいでしょう。左の場合もいちおう記述しておいたほうが無難なのかもしれません。 第五引数には、敬称を除外したい名前を書きます。サイト管理者にも敬称がついてしまうために追加された機能ということです。私の場合はメンバーで運営しているので、複数設定するにはどうするのか、わからないので使ってません；；。 第六引数には、敬称を書きます。第五引数で指定した名前以外の方に敬称がつくようです。私はつけないためになにも書いていません。 引数については必要なものだけを書けばいいようです。私の場合は、敬称なしがなぜか出来なかったので、第六引数まで書きました。 【サイドバーの頂いたトラックバックもツリー表示にする】 トラックバックの方はすっきりとまではいかないですが、それでも多少見やすくなったんじゃないかなと思います。 こちらも弱小エンジニアの小言さんのミニカスタマイズ　１７を参考にさせてもらいました。 引数の考え方は基本的に同じです。こちらはもうちょっと説明してくれているブログがあるので、そちらもみるといいかもしれません。 関連リンク： ●ＢＬＯＧわんさん:トラックバックのツリー表示 ●小春日和の陽射しの中でさん:トラックバックのツリー化もできた ●萌黄★色さん:ｺﾒﾝﾄ･ﾄﾗｯｸﾊﾞｯｸのﾂﾘｰ表示 【月別アーカイブをプルダウンメニュー形式にする】 これですが、livedoorではいつかの（？！）ブログの日で対応したそうです。すでにつけている人には非常にわかりにくいと思うんですが、追加すると、プルダウンにするか選択することができるようになっています。 それ以外に弱小エンジニアの小言さん:ミニカスタマイズ　第２段でフリースペースを使った方法もあります。違いは、プラグインのものだと「Go」というボタンをおさないといけないのですが、takoashiさんのものだと選択するだけで飛ぶことができるようになっています。

var start_year = 2004; // ブログを開始した年 var start_month = 1; // ブログを開始した月 var siteurl = “http://blog.livedoor.jp/takoashi/”

この三行は自分の環境に変更しましょう。

とりあえずこんな感じですね。補足修正があったら、追記いたします。

読んで頂いてありがとうございます！

↓↓このブログ独自の「いいね！」を導入しました。少しでもこの記事が気に入って頂けたら押して頂けるとうれしいです。各著者が無駄に喜びます(・∀・)ｲｲ!! よろしくお願いしますm(__)m