二〇〇六年 一月 四日(水)

400blogスタイルシートを切り替える

[Blog記録]

正月の深夜にこまごまとカスタマイズ。
壁紙とかラインとか、スタイルシートで切り替えているんだけど、それをいくつか用意しておいて見るときに切り替えられるオマケをつけた。

小粋空間: スタイルシート切り替え

いつものことだが、書くのも面倒だ・・・とにかく入れたのでよしとしよう(笑)

トップページの場合は右上にsylesheetと書いてあるところで適当に選ぶ。
今は正月なのでnewyearも作ってみたけど・・・色々あってちょい変なとこがある。
まあ正月過ぎたら止めるのでいいや~

二〇〇五年 十二月 三十一日(土)

400blog折りたたみその2

[Blog記録]

昨日の折りたたみもよかったのだけど、折りたたみの状態を維持することができないので変えます。

小粋空間: サイドメニューの折りたたみ(v4.0)

本当は最初からこっちにしたかったんだけど、前回やったときにはうまくいかなかったの・・・をリベンジ。
今度はなんとかうまくいったようです。
これで、いつ見ても自分の見たいメニューは開いて、見なくてよいメニューは閉じているという。素晴らしい。

詳しくカスタマイズ内容を書くと朝が来てしまうのでやめます~(笑)

二〇〇五年 十二月 三十日(金)

400blogエントリーを楽にするボタン

[Blog記録]

以前も作ったエントリーボタンですが、なんとなく不具合っていたので、ちゃんとしたものを作り直し。

こだるま日和: エントリーを楽にしたい。

以下、詳細。

と思ったけど・・・

長くてどうやったかもうちょっと忘れたので、もういいや~( ̄m ̄*)

400blogサイドバー折りたたみ

[Blog記録]

過去の日記が増えたせいか、なんだかサイドバーが長い。
そうでなくてもいちいちスクロールして見るのが面倒なときにいらないものを隠すことができる。

サイドバーのメニューを折りたたんで、隠したり出したりするスクリプト。
ダイズバタケ: サイドバーを折りたたみ式にしてみた

以下、詳細。

folding_sidebar.js を用意してアップロード

function toggleFold(sender, id) {
var elm = document.getElementById(id);
if (elm.style.display == "none") {
elm.style.display = "block";
sender.className = "unfolded";
} else {
elm.style.display = "none";
sender.className = "folded";
}

<head>~</head>に追加

<!--サイドバー折り畳み-->
<script type="text/javascript" src="<$MTBlogURL$>folding_sidebar.js" charset="utf-8"></script>


テンプレートを以下のように書き換える。

<div class="folded" onmousedown="toggleFold(this, '●○');">タイトル</div>
<div id="●○" style="display: block;">
隠したい内容
</div>

●○の部分は、折りたたみを複数のメニューで使いたいときに個別の名前を付けて管理する。

display: block;だと最初は出してある。
display: none;だと最初は隠してある。
お好みで。

二〇〇五年 十二月 二十九日(木)

400blogjavasctiptの外部読み込み

[Blog記録]

ちょこちょこといじっているのです、実は。
スタイルシートを変えてみました。ちょっとノート風?ポスト○ット風のタイトルが気に入ってます。

その他、javasctiptを外部から読み込むようにした。

以下、カスタマイズの覚書

javasctiptはテンプレートの<head>部分に書き込む構文だが、いくつも使うとソースを見てもなにがなにやらわからなくなって、使わなくなったものを消すときに面倒。外に別ファイルを作って読み出すことに。

1)<script type="text/javascript">~</script>の間に書かれた構文をコピーして「~.js」という名前で保存。index.phpのあるところにアップ。
ただし、文字コードを本文と合わせないといけないので注意。あと保存すると「~.js.txt」とかなったらリネームしておく。

2)もとの<script type="text/javascript">~</script>を書き換える。

<script type="text/javascript" src="<$MTBlogURL$>~.js" charset="utf-8"></script>

charset="utf-8"の部分は文字コードを本文に合わせて。あとは、なんのスクリプトか忘れないように<!--続きを読むのスクリプト-->みたいな感じで名前を書いておくと便利。

ずいぶんとすっきりしました。

二〇〇五年 十二月 四日(日)

400blog過去日記

[Blog記録] | [古い日記帳]

過去の日記を移しています。
2001年9月から2004年5月頭まで。
以前のCGI日記帳では2001年から書いているみたい。でもサイト開設当時1999年ごろにもなんか書いていたような気もするからもう5年以上も日記を書いているのか。凄いなあ、これって。
もうたぶん読む人も少ない日記なので、本当に日記になっているけど(笑)
それでも飽きっぽい私が5年も書いているのは凄い。
読んでくださっている数人の方々。いつもありがとうございますとお礼を言ってみたりする。

追記:移し終わりました。そうか~ちょうどNYテロの直前から書いてますね、日記。
こうやってまとめてみてみると面白いこともあるな。

二〇〇五年 十一月 二十七日(日)

400blog模様替え

[Blog記録]

模様替えしてみました。
他にも、見えないところが大々的に変わってます(笑)
だんだん慣れてきたのであまり時間はかからなくなってきたね。

今回は、デザインをDr.Blogからいただきました。
たくさん綺麗なテンプレートがあるので、しばらく楽しめそうだ。

それから、仕様変更でうまく読み込めなくなっていたモブログをどうにかしたくて、そのためにフツーのhtmlをphpに変更。よくわからんけど、これでリアルタイムに読み込めるようになりました。やれやれ。

こちらで、phpモジュール化、ついでにつけたパンくずリストなど、色々拾いました。
小粋空間
以下覚書

phpモジュール化は、ようするに今まで拡張子が.htmlだったものを全て.phpに変更するだけ。
それと、環境設定>設定 の アーカイブファイルの拡張子もphpに。
さらに、.htaccess によるリダイレクト を設定する。よく意味はわからないけど、以前のファイルにアクセスしたときに迷子にならないようにするのね。

モブログを読み込む文を変える。

<?php readfile("●●●.html"); ?>

これで自動的に更新してくれる。ありがたい。


パンくずリスト

小粋空間: パンくずリスト アーカイブ
ぱんくずリストっていうのは、カテゴリーごとや日付ごとの記事をどの階層にあるのかを表示するもの。

Top > 日常記録 > 仕事まわり

みたいなものをつけるためのもの

カテゴリー用

<a href="<$MTBlogURL$>">Top</a> &#65310; <MTParentCategories glue=" &#65310; ">
<MTIfNonZero tag="MTCategoryCount">
<?php
if ('<$MTCategoryLabel encode_php="q"$>' != '<$MTArchiveTitle encode_php="q"$>') {
print '<a href="<$MTCategoryArchiveLink$>"><$MTCategoryLabel encode_php="q"$></a>';
} else {
print '<$MTCategoryLabel encode_php="q"$>';
}
?>
<MTElse><$MTCategoryLabel$></MTElse></MTIfNonZero>
</MTParentCategories>

個別記事用

<a href="<$MTBlogURL$>">Top</a> &#65310;
<MTParentCategories glue=" &#65310; ">
<MTIfNonZero tag="MTCategoryCount">
<a href="<$MTCategoryArchiveLink$>"><$MTCategoryLabel$></a>
<MTElse><$MTCategoryLabel$></MTElse>
</MTIfNonZero>
</MTParentCategories>
&#65310; <$MTEntryTitle$>

日付ごと用

<a href="<$MTBlogURL$>">Top</a> &#65310; <$MTArchiveTitle$>

二〇〇五年 十一月 十四日(月)

400blogタイトル変更

[Blog記録]

タイトル変更した。
そろそろお頭っていうのも恥ずかしくなってきたのさ。
「あゝ人生に涙あり」
知っている人は知っている・・・水戸黄門の主題歌(笑)
私子どものころ水戸黄門と大岡越前のファンだったのよ。
大岡越前は片岡千恵蔵好きでねえ・・・水戸黄門はもちろん東野英治郎さまです。

相変わらず誰も見てないブログですが(笑)
まあシュミだし、日記だと三日坊主だった私にしては、以前のものを足すともう何年も書いていることになるし・・・お、5年くらい?凄いね~自分でもびっくりした。
そのうち、HPで書いていた文もアップしてもいいかもしれない。

二〇〇五年 八月 三日(水)

400blogカレンダーのカスタマイズ

[Blog記録]

なんだかいじっていたらカレンダーが消えたので(爆)新しく横型にしてみた。

小粋空間: 月送りカレンダー(横型・リアルタイム版)

カレンダーテンプレートの設定
管理メニューの「テンプレート」クリック→「アーカイブに関連したテンプレート」の右側にある「新しいアーカイブ・テンプレートを作る」をクリック。次画面で下記を設定してください。
・テンプレートの名前:カレンダー(名称は何でもOKです)
・このテンプレートにリンクするファイル:(設定不要)


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1./ Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
<link rel="stylesheet" href="<$MTBlogURL$>calendar.css" type="text/css" />
<MTBlogIfCCLicense>
<$MTCCLicenseRDF$>
</MTBlogIfCCLicense>
</head>
<body >
<div class="calendar">
<span class="calendarHead">
<MTArchivePrevious>
<a href="<$MTBlogURL$>archives/calendar/<$MTArchiveDate format="%Y/%m/index" $>.php"><</a>
</MTArchivePrevious>
<$MTArchiveDate format="%B %Y" language="en"$>
<MTArchiveNext>
<a href="<$MTBlogURL$>archives/calendar/<$MTArchiveDate format="%Y/%m/index" $>.php" >></a>
</MTArchiveNext>/
</span>
<?php $day = date(j); $year = date(Y); $month = date(m); ?>
<MTCalendar month="this"><MTCalendarIfEntries><?php $y="<$MTCalendarDate format='%Y'$>"; $m="<$MTCalendarDate format='%m'$>"; $d="<$MTCalendarDay$>"; if($year == $y && $month == $m && $day == $d) { $style = "today"; } else { $style = "notoday"; } ?><span class="<?php print "$style"; ?>"><MTEntries lastn="1"><a href="<$MTEntryLink archive_type="Daily"$>" target="_top"><$MTCalendarDay$></a></MTEntries>
</MTCalendarIfEntries><MTCalendarIfNoEntries><?php $y="<$MTCalendarDate format='%Y'$>"; $m="<$MTCalendarDate format='%m'$>"; $d="<$MTCalendarDay$>"; if($year == $y && $month == $m && $day == $d) { $style = "today"; } else { $style = "notoday"; } ?><span class="<?php print "$style"; ?>"><$MTCalendarDay$></MTCalendarIfNoEntries>
<MTCalendarIfBlank>
<MTElse></span></MTElse></MTCalendarIfBlank></MTCalendar>
</div>
</body>
</html>


スタイルシートも用意する(calendar.css)

a,
a:link,
a:visited,
a:active {
color: #8FABBE;
background: none;
}
a:hover {
color: #006699;
background: underline;
}
.calendar {
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
}
.calendarHead {
color:#666666;
font-size: 11px;
font-weight: normal;
font-family: Verdana, Arial, sans-serif;
padding-right: 5px;
}
.notoday {
margin-right:4px;
color:#666666;
font-size: 11px;
font-family: Verdana, Arial, sans-serif;
}
.today {
margin-right:4px;
color:#666666;
font-size: 11px;
font-family: Verdana, Arial, sans-serif;
border : 1px solid #999999;
}

カレンダーテンプレートを月別アーカイブに関連付け
管理メニューの「ウェブログの設定」クリック→次ページ右上「アーカイブの設定」クリック→次ページの「新しく、テンプレートとアーカイブを関連付ける。」欄で下記の設定にして「追加」をクリック。

次に同じ「アーカイブ」欄の「月別」の「カレンダー」の右側にある「アーカイブファイルのテンプレート」に下記を設定。

<$MTArchiveDate format="calendar/%Y/%m/index.php"$>

カレンダーを入れる場所に以下を追加。

<div id="globalnavi">
<iframe name="cal-iframe" src="<MTBlogURL>archives/calendar/<MTDate format="%Y/%m/index">.php" width="698" height="20" scrolling="NO" frameborder="0" marginwidth="0" marginheight="0">
</iframe>
</div>
<script type="text/javascript" language="javascript">
<!--
setAttributeByTagNameAndAttribute(1, 'iframe', 0, 'height', '27');
-->
</script>

スタイルシート(もともとあるやつ)に以下を追加

#globalnavi {
text-align: center;
padding-bottom: 5px;
border-bottom : 1px solid #666699;
}

修正したテンプレートの <head>~</head> の間に下記を追加

<script type="text/javascript" src="<$MTBlogURL$>util.js" charset="utf-8"></script>

あと、よくわからないスクリプトを適当な位置にアップロード(多分メインのあるあたりでよろしいかと・・・)
util.jsのダウンロード一番下の方にある。

はうっっ

二〇〇五年 七月 十八日(月)海の日

400blogその他カスタマイズ その2

[Blog記録]

エントリーの画面で文字に色をつけたりするためのボタン
ちょっと面倒だった。

まずは、mt.js に 以下を付け足します。

function replaceEntity(str) { // 置換処理
str = str.split("&").join("&amp;"); // & から変換すること
str = str.split("<").join("&lt;");
str = str.split(">").join("&gt;");
str = str.split('"').join("&quot;");
return(str);
}
function changeEntity(obj) {
if (document.selection) { // WinIE
obj.focus();
var str = document.selection.createRange().text;
if (str) {
document.selection.createRange().text = replaceEntity(str);
} else if (obj.value && confirm('テキストエリア内の「&,<,>,"」を実体参照化します。\n\nよろしいですか?')) { // 選択されていないとき
obj.value = replaceEntity(obj.value);
}
} else if ( (obj.selectionEnd - obj.selectionStart) > 0 ) { // Mozilla
var bgnPos = obj.selectionStart;
var endPos = obj.selectionEnd;
var bfrStr = obj.value.substring(0, bgnPos);
var fcsStr = replaceEntity(obj.value.substring(bgnPos, endPos));
var difLen = fcsStr.length - (endPos - bgnPos);
var aftStr = obj.value.substring(endPos, obj.value.length);
obj.value = Array(bfrStr,fcsStr,aftStr).join('');
obj.setSelectionRange(bgnPos,endPos + difLen); // 選択し直し
} else if (obj.value) { // Others (テキストエリア内全てが対象)
if (confirm('テキストエリア内の「&,<,>,"」を実体参照化します。\n\nよろしいですか?')) {
obj.value = replaceEntity(obj.value);
}
}
return;
}
function changeTag(str) { // 置換処理
str = str.split('&lt;').join("<");
str = str.split('&gt;').join(">");
str = str.split('&quot;').join('"');
str = str.split('&amp;').join("&"); // & は最後に変換
return(str);
}
function reverseEntity(obj) {
if (document.selection) { // WinIE
obj.focus();
var str = document.selection.createRange().text;
if (str) {
document.selection.createRange().text = changeTag(str);
} else if (obj.value && confirm('テキストエリア内の実体参照文字を「&,<,>,"」に変換します。\n\nよろしいですか?')) { // 選択されていないとき
obj.value = changeTag(obj.value);
}
} else if ( (obj.selectionEnd - obj.selectionStart) > 0 ) { // Mozilla
var bgnPos = obj.selectionStart;
var endPos = obj.selectionEnd;
var bfrStr = obj.value.substring(0, bgnPos);
var fcsStr = changeTag(obj.value.substring(bgnPos, endPos));
var difLen = fcsStr.length - (endPos - bgnPos);
var aftStr = obj.value.substring(endPos, obj.value.length);
obj.value = Array(bfrStr,fcsStr,aftStr).join('');
obj.setSelectionRange(bgnPos,endPos + difLen); // 選択し直し
} else if (obj.value) { // Others (テキストエリア内全てが対象)
if (confirm('テキストエリア内の実体参照文字を「&,<,>,"」に変換します。\n\nよろしいですか?')) {
obj.value = changeTag(obj.value);
}
}
return;
}
function addClear(obj)
{
var item = '<div style="clear: both"> </div>';
//IE
if (document.selection) {
obj.focus();
sel = document.selection.createRange();
sel.text = item;
}
//Mozilla
else if (obj.selectionStart || obj.selectionStart == '0') {
var startPos = obj.selectionStart;
var endPos = obj.selectionEnd;
obj.value = obj.value.substring(0, startPos)
+ item
+ obj.value.substring(endPos, obj.value.length);
//Other
} else {
obj.value += item;
}
}
function changeFontsize(obj, tag) {
var startTag = '<span style=\"font-size:' + tag + '\;\">';
var endTag = '</span>';
//IE
if (document.selection) {
obj.focus();
var str = document.selection.createRange().text;
if(!str) {
return;
}
document.selection.createRange().text = startTag + str + endTag;
return;
}
//Mozilla
else if ((obj.selectionEnd - obj.selectionStart) >0) {
var startPos = obj.selectionStart;
var endPos = obj.selectionEnd;
obj.value = obj.value.substring(0, startPos)
+ startTag
+ obj.value.substring(startPos, endPos)
+ endTag
+ obj.value.substring(endPos, obj.value.length);
return;
}
//Other
else {
obj.value += startTag + endTag;
}
}
function changeFontcolor(obj, tag) {
var startTag = '<span style=\"color:' + tag + '\;\">';
var endTag = '</span>';
//IE
if (document.selection) {
obj.focus();
var str = document.selection.createRange().text;
if(!str) {
return;
}
document.selection.createRange().text = startTag + str + endTag;
return;
}
//Mozilla
else if ((obj.selectionEnd - obj.selectionStart) >0) {
var startPos = obj.selectionStart;
var endPos = obj.selectionEnd;
obj.value = obj.value.substring(0, startPos)
+ startTag
+ obj.value.substring(startPos, endPos)
+ endTag
+ obj.value.substring(endPos, obj.value.length);
return;
}
//Other
else {
obj.value += startTag + endTag;
}
}
function colorSelect (obj) {
var v;
if (!document.selection) return;
var str = document.selection.createRange().text;
if (!str) return;
with(obj) {
if (options[selectedIndex].value == "------") return;
v = options[selectedIndex].value;
}
document.all.colcol.style.backgroundColor = v;
document.selection.createRange().text = '<span style="color:' + v + ';">' + str + '</span>';
}
function colorSet() {
var v;
if (!document.selection) return;
var str = document.selection.createRange().text;
if (!str) return;
if (document.all.colcol.options[document.all.colcol.selectedIndex].value == "------") return;
v = document.all.colcol.options[document.all.colcol.selectedIndex].value;
document.selection.createRange().text = '<span style="color:' + v + ';">' + str + '</span>';
}
function fontsizeSelect (obj) {
var v;
if (!document.selection) return;
var str = document.selection.createRange().text;
if (!str) return;
with(obj) {
if (options[selectedIndex].value == "------") return;
v = options[selectedIndex].value;
}
document.selection.createRange().text = '<span style="font-size:' + v + ';">' + str + '</span>';
}
function fontSet() {
var v;
if (!document.selection) return;
var str = document.selection.createRange().text;
if (!str) return;
if (document.all.foncha.options[document.all.foncha.selectedIndex].value == "------") return;
v = document.all.foncha.options[document.all.foncha.selectedIndex].value;
document.selection.createRange().text = '<span style="font-size:' + v + ';">' + str + '</span>';
}
function bgSelect (obj) {
var v;
if (!document.selection) return;
var str = document.selection.createRange().text;
if (!str) return;
with(obj) {
if (options[selectedIndex].value == "BG") return;
v = options[selectedIndex].value;
}
document.all.bg.style.backgroundColor = v;
document.selection.createRange().text = '<span style="background:' + v + '">' + str + '</span>';
}
function bgSet() {
var v;
if (!document.selection) return;
var str = document.selection.createRange().text;
if (!str) return;
if (document.all.bg.options[document.all.bg.selectedIndex].value == "BG") return;
v = document.all.bg.options[document.all.bg.selectedIndex].value;
document.selection.createRange().text = '<span style="background:' + v + '">' + str + '</span>';
}

次は、edit_entry.tmpl です。body のところには・・・

<script type="text/javascript">
<!--
if (canFormat) {
with (document) {
write('<a href="javascript:changeEntity(document.entry_form.text);"><img src="<TMPL_VAR NAME=STATIC_URI>images/jittai_1.gif" alt="<MT_TRANS phrase="jittai_1">" width="40" height="16" border="0" /></a>');
write('<a href="javascript:reverseEntity(document.entry_form.text);"><img src="<TMPL_VAR NAME=STATIC_URI>images/jittai_2.gif" alt="<MT_TRANS phrase="jittai_2">" width="40" height="16" border="0" /></a>');
write('<a href="javascript:addClear(document.entry_form.text);"><img src="<TMPL_VAR NAME=STATIC_URI>images/clear.gif" border="0" alt="クリア" width="30" height="16" /></a>');
write('<a title="<MT_TRANS phrase="Bold">" href="#" onclick="return formatStr(document.entry_form.text, \'strong\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-bold.gif" alt="<MT_TRANS phrase="Bold">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="strike">" href="#" onclick="return formatStr(document.entry_form.text, \'strike\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/strike.gif" alt="<MT_TRANS phrase="Strike">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Italic">" href="#" onclick="return formatStr(document.entry_form.text, \'em\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-italic.gif" alt="<MT_TRANS phrase="Italic">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Underline">" href="#" onclick="return formatStr(document.entry_form.text, \'u\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-underline.gif" alt="<MT_TRANS phrase="Underline">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Insert Link">" href="#" onclick="return insertLink(document.entry_form.text)"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-link.gif" alt="<MT_TRANS phrase="Insert Link">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Insert Email Link">" href="#" onclick="return insertLink(document.entry_form.text, 1)"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-email.gif" alt="<MT_TRANS phrase="Insert Email Link">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Quote">" href="#" onclick="return formatStr(document.entry_form.text, \'blockquote\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-quote.gif" alt="<MT_TRANS phrase="Quote">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Upload File">" href="<TMPL_VAR NAME=SCRIPT_URL>?__mode=start_upload&amp;blog_id=<TMPL_VAR NAME=BLOG_ID>" onclick="window.open(this.href, \'upload\', \'width=400,height=450,resizable=yes\'); return false"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-file.gif" alt="<MT_TRANS phrase="Upload File">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="textarea">" href="#" onclick="return formatStr(document.entry_form.text, \'textarea\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/text.gif" alt="<MT_TRANS phrase="textarea">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Insert Horizontal Rule">" href="#" onclick="return insertSomething(document.entry_form.text, \'<hr size=&quot;1&quot; noshade />\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-hr.gif" alt="<MT_TRANS phrase="Insert Horizontal Rule">" width="22" height="16" border="0" /></a>');
write('<!--[if gte IE 5]><a title="<MT_TRANS phrase="Setcolor">" href="#" <form name="colform"><select name="colcol" onchange="colorSelect(this)"><option value="color" selected>Color<option value="#ff3300">Red<option value="#6666ff">Blue<option value="#009933">Green</select><input type="button" onclick="colorSet()" value="&#x25ef;"></a><![endif]-->');
write('<!--[if gte IE 5]><a title="<MT_TRANS phrase="Setbgcolor">" href="#" <form name="bgform"><select name="bg" onchange="bgSelect(this)"><option value="BG" selected>BG<option style="background-color:#FF3333;" value="#FF3333">red<option style="background-color:#FFFF33;" value="#FFFF33">yellow<option style="background-color:#3399FF;" value="#3399FF">blue<option style="background-color:#00FF66;" value="#00FF66">green<option style="background-color:#CC6600;" value="#CC6600">brown</select><input type="button" onclick="bgSet()" value="!"></a><![endif]-->');
}
}
// -->
</script>
<![if !gte IE 5]>
<div style="float: right;">
<select>
<option value="">Font
<option onclick="javascript:changeFontcolor(document.entry_form.text,'#009933')">Green
<option onclick="javascript:changeFontcolor(document.entry_form.text,'#6666ff')">Blue
<option onclick="javascript:changeFontcolor(document.entry_form.text,'#ff3300')">Red
<option onclick="javascript:changeBGcolor(document.entry_form.text,'#FF3333')">red
<option onclick="javascript:changeBGcolor(document.entry_form.text,'#FFFF33')">yellow
<option onclick="javascript:changeBGcolor(document.entry_form.text,'#3399FF')">blue
<option onclick="javascript:changeBGcolor(document.entry_form.text,'#00FF66')">green
<option onclick="javascript:changeBGcolor(document.entry_form.text,'#CC6600')">brown
</select>
</div>
<![endif]>

同様に extend のところには・・・

<script type="text/javascript">
<!--
if (canFormat) {
with (document) {
write('<a href="javascript:changeEntity(document.entry_form.text_more);"><img src="<TMPL_VAR NAME=STATIC_URI>images/jittai_1.gif" alt="<MT_TRANS phrase="jittai_1">" width="40" height="16" border="0" /></a>');
write('<a href="javascript:reverseEntity(document.entry_form.text_more);"><img src="<TMPL_VAR NAME=STATIC_URI>images/jittai_2.gif" alt="<MT_TRANS phrase="jittai_2">" width="40" height="16" border="0" /></a>');
write('<a href="javascript:addClear(document.entry_form.text_more);"><img src="<TMPL_VAR NAME=STATIC_URI>images/clear.gif" border="0" alt="クリア" width="30" height="16" /></a>');
write('<a title="<MT_TRANS phrase="Bold">" href="#" onclick="return formatStr(document.entry_form.text_more, \'strong\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-bold.gif" alt="<MT_TRANS phrase="Bold">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="strike">" href="#" onclick="return formatStr(document.entry_form.text_more, \'strike\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/strike.gif" alt="<MT_TRANS phrase="Strike">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Italic">" href="#" onclick="return formatStr(document.entry_form.text_more, \'em\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-italic.gif" alt="<MT_TRANS phrase="Italic">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Underline">" href="#" onclick="return formatStr(document.entry_form.text_more, \'u\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-underline.gif" alt="<MT_TRANS phrase="Underline">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Insert Link">" href="#" onclick="return insertLink(document.entry_form.text_more)"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-link.gif" alt="<MT_TRANS phrase="Insert Link">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Insert Email Link">" href="#" onclick="return insertLink(document.entry_form.text_more, 1)"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-email.gif" alt="<MT_TRANS phrase="Insert Email Link">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Quote">" href="#" onclick="return formatStr(document.entry_form.text_more, \'blockquote\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-quote.gif" alt="<MT_TRANS phrase="Quote">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Upload File">" href="<TMPL_VAR NAME=SCRIPT_URL>?__mode=start_upload&amp;blog_id=<TMPL_VAR NAME=BLOG_ID>" onclick="window.open(this.href, \'upload\', \'width=400,height=450,resizable=yes\'); return false"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-file.gif" alt="<MT_TRANS phrase="Upload File">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="textarea">" href="#" onclick="return formatStr(document.entry_form.text_more, \'textarea\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/text.gif" alt="<MT_TRANS phrase="textarea">" width="22" height="16" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Insert Horizontal Rule">" href="#" onclick="return insertSomething(document.entry_form.text_more, \'<hr size=&quot;1&quot; noshade />\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-hr.gif" alt="<MT_TRANS phrase="Insert Horizontal Rule">" width="22" height="16" border="0" /></a>');
write('<!--[if gte IE 5]><a title="<MT_TRANS phrase="Setfontsize">" href="#" <form name="fonchaform"><select name="foncha" onchange="fontsizeSelect(this)"><option value="Font" selected>Font<option value="50%">50%<option value="70%">70%<option value="130%">130%<option value="200%">200%</select><input type="button" onclick="fontSet()" value="&#x25ef;"></a><![endif]-->');
}
}
// -->
</script>
<![if !gte IE 5]>
<div style="float: right;">
<select>
<option value="">Font
<option onclick="javascript:changeFontsize(document.entry_form.text,'50%')">50%
<option onclick="javascript:changeFontsize(document.entry_form.text,'70%')">70%
<option onclick="javascript:changeFontsize(document.entry_form.text,'130%')">130%
<option onclick="javascript:changeFontsize(document.entry_form.text,'200%')">200%
</select>
</div>
<![endif]>
</div>

はあはあ。

400blogその他カスタマイズ

[Blog記録]

ブログにトラブルがあるたびに、カスタマイズを探してあれこれ・・・
(主に自分で壊している気もするが(^_^;)
しかも、参考にしたサイトさんが移動していたり無くなっていたり、そのたびに探すのが面倒なので、やっぱり自分でちゃんと記録しよう・・・。

追加のカスタマイズ カテゴリを階層ごとに表示

<dt id="category-list">カテゴリー</dt>
<MTCategories>
<MTHasNoParentCategory></MTHasNoParentCategory>
<li><MTHasParentCategory> ┗</MTHasParentCategory>
<a href="<$MTCategoryArchiveLink$>"><$MTCategoryDescription$>
</a>[<$MTCategoryCount$>] </li></MTCategories>

サイドバーのカテゴリ一覧でした。

二〇〇五年 七月 十七日(日)

400blogやっと復旧?

[Blog記録]

以前のログはなんとか復旧したぜ。ぜいぜいっ
しかし、写真の方はまだまだかかりそう・・・(涙)
っつーか、直せるのか?
今度からは絶対にバックアップをもっと真剣に取ろう!!←とってなかったんかいっ

二〇〇五年 七月 十日(日)

400blogこ・・・こわれた・・・

[Blog記録]

ううっバージョンアップしようとおもったら、こわれまちた・・・
どうも、私の使っているスペースの自動広告挿入のためだったらしく、それがわかるまでにじかんがかかってしまいました。
ああ~~どうしよう。記事を復帰させるのにはものすごい時間がかかりそう。
まあぼちぼち復旧させます。ふう。

二〇〇五年 一月 二十八日(金)

400blogがちゃがちゃエントリ

[Blog記録]

久々に新しいモノ付けてみた

がちゃがちゃエントリ for MT - PIROBLOG2

ようするに、今まで書いたエントリをランダムに表示させることができるということ
ボタンに書いたとおり「テキトーに日記を選んで」読むためのスクリプト
暇なときにいいわね^_^;

二〇〇四年 七月 二十六日(月)

400blogMT3.0のその後

[Blog記録]

やっとこバージョンアップ前の状態に戻しました
カスタマイズの記録を残しておいてよかったあ~
ほとんどはそのまま利用できるものばかり
心配していた日本語表記対応の日付プラグインも使えました
やれやれ

二〇〇四年 七月 十七日(土)

400blogバージョンアップ

[Blog記録]

MovableType3.0の日本語版が正式リリース
新しい物好きの私としては使ってみたい
しかし、せっかくここまで色々カスタマイズしたものを
もう一度やり直すのは少々面倒なので、一度3.0を立ち上げて
それから考えようと思っていた・・・思っていたが

なぜだかわからないけど、インストールできない
よくわからないけど、データベースかなにかの関係らしい
わからないものをどうにかしようとするのは無理なので、
しぶしぶバージョンアップを試すことにする

しかし、今までのが壊れたら困るので、まるっと全体をバックアップ
そして書き換えるファイルを転送して上書きする・・・
どうもうまくいったらしい
なんとなくメニュー画面が変わっただけで、特に機能が増えたとか
そういうこともないので、別にしなくても良かったのか(-_-;)

二〇〇四年 七月 六日(火)

400blogカスタマイズのオニ・・・その6

[Blog記録]

まだやるのか!なカスタマイズの旅
カテゴリーの名前を日本語にしたい
が、カテゴリーの名前がそのままファイル名になる関係で日本語にできないみたい
それでも日本語にしたい人が私以外にもいるらしいね

BLOG質問箱: カテゴリを日本語名で表示する

なるほど、抜け道はあるものだ・・・
カテゴリ名に説明文を付ける機能があるんだけど、それを利用して
表示を日本語にすることができた
やっぱり日本人は日本語だす・・・単に私が英語ニガテなだけ?

二〇〇四年 七月 四日(日)

400blogカスタマイズのオニ・・・その5

[Blog記録]

BlogTimesとこうさぎを入れたら、ちょっと見にくくなったので
以前からやろうと思っていたメニューをプルダウンにする
でもこれはこれで見にくいという気もする・・・
またそのうち元に戻すかもしれない

400blogおまけをつける・・・その1

[Blog記録]

今度はブログにおまけを付けてみる
ついでに、実は用を成していなかったカレンダーをはずす
でもどっちも飽きたら多分すぐはずすだろうな~(笑)

おまけその1
パソに向かっている時間がばれる・・・ぶるぶるっ
だからどうだ的なおまけです
BlogTimes/TypeR - PukiWiki:魂の叫び
それの円グラフバージョンを採用

おまけその2
Blog Pet こうさぎ
ブログのなかで生きるこうさぎさん
自分で言葉を覚えたり、ブログを書いたりするらしい
うーん、ポスペ的な感じかな?

二〇〇四年 六月 三十日(水)

400blogカスタマイズのオニ・・・その4

[Blog記録]

- -Myumyu's Blog- - : EDITボタン

記事を読んでいて誤字脱字を見つけたときに、いちいち管理画面を開いて修正・・・なんてまどろっこしくてやってられない
そんな時に便利なスクリプト発見~♪

EDIT
このタグをIndexページにはっ付けると、そこから修正画面にひとっとび
さらにわたしはちょっといじってそこから投稿画面に飛ぶリンクも作っておいた

POST

ちなみにそれを他の人が押しても、パスワードがわからないと管理画面には入れないそうだ
もし見つけても押しても無駄ですよん

今は使ってませんけど(-_-;)

二〇〇四年 六月 二十九日(火)

400blogカスタマイズのオニ・・・その3

[Blog記録]

長い文を書くと、1ページが長くなって表示が見づらい
そこで、投稿するときに、主文と追記に分けて書くと
「続きを読む」という表示で後半を隠すことができるんだけど、
今度はその代わりに全文を読むときにいちいち個別のページに飛んでしまって読みにくい
そんなときに、クリックすると隠されている文がシュッと(笑)出てくるスクリプト
シュルッとね(笑)読みやすくなった

なかよしこよし: 続きを読むのスクリプト

以前のカスタマイズでカテゴリーごとや月間のアーガイブが最近の何件かだけの表示になったから、それも見やすくなった
ただ、どこらあたりで追記に切り替えるべきなのか・・・
思わせぶりに「続きを読む」にして、後の分が大した事ないならクリックするだけ損ではない?
まあブックレピューなんかには向いているね、この方法

二〇〇四年 六月 二十八日(月)

400blogカスタマイズのオニ・・・その2

[Blog記録]

やっほーい
意味もなく日本語表示の日付にしてみた
さらに意味もなく六曜なんぞも表示される!ブラボー
以前の職場のせいか、結構こういうのが表示されるとうれしくなってしまう

M's folder: MT 和風日付表示プラグイン

二〇〇四年 五月 三十一日(月)

400blog忙しいときほど

[Blog記録]

年設置した読書日記は全然書けなくなってしまった・・・
結局そんなにいくつものものを管理するのは無理と判断
それと、最近ブログなるものが流行っているようで
まあ要するに新しい物好きってこと(笑)
どんなものになるかは見てのお楽しみですが、とりあえず設置してみた

二〇〇四年 五月 二十八日(金)

400blogMoblog・・・ その3

[Blog記録]

最後にもう一つ大きな山があった
MovableTypeの大きな面倒臭さの一つに「リビルド」がある
いろんな設定を変更したときに、必ず「りびるど」をしておかないと、表示に反映しない
さらに、面倒なことにMoblogを投稿しても、メインの柱に出ている写真が更新されるには
メインのページ自体が変更があったり、リビルドがかからないとダメなのだ

しかし、これを解決してくれる人がいる!
そう、この問題を解決してくれる人の多さがMovableTypeの一番のメリットだ(笑)

>Tarragon/Estragon: SSIでMoblog表示を更新させる
これで最新の表示をそのつど見に行ってくれるようになった
素晴らしい!ブラボー!

さらに↑のページに載っていた
blogDROID: エントリーのタイトル前にカテゴリ別画像を表示する
これもちょーしこいて設定する
ここら辺りから、ちょーしこいてカスタマイズのオニになっていったような気がする・・・(-_-;)

400blogMoblog・・・ その2

[Blog記録]

携帯からメールでエントリーできるようになったMoblog
スタイルはとりあえず3カラムのときにもお世話になったHINAGATAさんのところからいただくことに。

これはまあ特に問題なくクリア・・・したと思っていた。

次に、Now.htmlを作成する。
moblog template samples [dh's memoranda]

<MTEntries lastn="3">
<div class="photobody">
<div class="phototitle">
<$MTEntryTitle$>
</div>
<a href="<$MTEntryLink$>">
<$MTEntryBody$>
<div class="photodate">
<MTDatej><$MTDatejYear kanji="1"$>年
<$MTDatejMonth kanji="2"$>月
<$MTDatejDay kanji="2"$>日(<$MTDatejYoubi$>)
<$MTDatejSyuku$>
</div>
</div>
</MTEntries>

これで最新エントリを拾って、これを本体のブログの柱に表示させるようにする。

<$MTInclude file="../x/mob/now.html" $>


メインのお頭的日常の右の柱に写真を表示させることに成功
さらに、写真の大きさを120×160のサイズにそろえ、題名や日付もスタイルシートで設定する。

.sidebar .photo img {
background-color: #ffffff;
border: 1px solid #999;
padding:5px;
position: relative;
width: 150px;
height: 200px;
margin: 1em 0.5em 1em 0.2em;
}

.sidebar .phototitle {
font-size: 1.2em;
font-weight: bold;
text-align: left;
padding: 0.5em 0em 0em 0em;
font-family: verdana, Arial, Helvetica, sans-serif;
border-top: 1px dotted #000000;
}

.sidebar .photodate {
font-size: 0.9em;
text-align: right;
padding: 0em 2em 0.5em 0em;
}

さて、テストを兼ねて写真をいくつか投稿して、お頭的日常の柱に写真が載った♪
さらにこれをクリックするとMoblogに飛んで・・・あれ??
なんでだろうか・・・写真が何枚か投稿してあるはずなのに、最新一枚しか表示されない
スタイルシートやテンプレートを確認するけど、特に問題がないはず
まだ全然いじっていないはずなのに・・・わからない

後でつらつら考えるに、携帯から投稿した場合、スタイルシートで写真の表示サイズを設定している
んで、普通に画像をアップロードするときには、表示用にサムネイル画像を作るようになっている
どうもHINAGATAさんのテンプレは、写真本体とサムネイルの画像が両方必要で、
携帯から投稿するとそのサムネイルが作られないのが原因じゃないのかな~と
結局HINAGATAさんのテンプレートを使うことは諦めて、HTRATAさんの他のテンプレートを採用
こちらは問題なく写真が表示されるが、原寸なのででかい・・・(^^;
まあスタイルシートで設定して、大きさ指定すればいいけどね

あ~メインの設置よりもずっと面倒だったわ(~_~;)

追記:2005.11
これは後に、トップページのサムネイルは写真を縮小して表示するように設定しなおしました。あと、ALLPHOTOのページも。このときには思いつかなかったんだねー。

400blogMoblog・・・ その1

[Blog記録]

blogという言葉もWeblogという言葉もよくわからないのにもう一つ出てきたMoblog

これはMobile+Weblog=Moblogということらしい
要するにモバイル端末から投稿するWeblogを指すらしい
私の場合はカメラ付き携帯を愛用していて、今までも結構日記に貼り付けていた
今回も同じように使おうと思ったんだけど、どうも写真ファイルをアップするのが面倒
今まで使っていた日記CGIのほうが簡単だった・・・
で、直接携帯から投稿する方法があるようなので、その設定もしてみた

dh's memoranda

ここはなんでも、Weblog神のサイトらしい(笑)
こちらに載っているサービスを使うと、携帯メールでWeblogに直接写真を投稿できる
でも、やはり日常使っているものにそのままポストするのは危険らしいので(よーわからんが)
もう一つWeblogを作って、Moblog専用とする

400blogスタイルシートの深い森 その2

[Blog記録]

なんとかスタイルシートの設定もする
そのときお世話になったのが
Mariのいろえんぴつ
HP用のカラーの組み合わせがたくさん出ているサイト
私、本当に色センスとかないのよね~
こういうサイトさんがあるととても助かる
今回はなんとなくみどりの組み合わせを採用することにした

ついでに、背景に画像を入れて、スタイルシートの設定で動かないようにした
今は縦じまだからわかりにくいんだけど、後ろの壁紙は動いていない
本当はこういうのって写真とかで設定すると生きるんだろうな~と思いつつも
なんとなく無駄に設定(笑)
お遊びと実験なんだから、いいでしょ

400blogスタイルシートの深い森 その1

[Blog記録]

3カラムという形式が成功したお頭的日常
しかし、その次には「スタイルシート」という更なる試練が待ち受けていた

そもそもスタイルシートとはなんぞや?
詳しくは↓
とほほのスタイルシート入門(基礎知識)
要するに、HPの見栄えを良くするために作るレイアウトのルールブックのようなものらしい
これがまた、デフォルトではかっちょわるいんだよ・・・
色もないし、フォントもダサいと思う
まあ私のセンスがどうかっていうとアレですが(笑)
それを自分好みに作り変えていけばいいんだけど、その設定が膨大にあるのよね、これが
そのルールがナニを設定しているのかがわからない
そんなときに見つけたサイトがここ
TRIGGERS / blognews: スタイルシートガイド
これをみれば、なにがナニを指定しているかがわかる優れもの
それを見ながらせっせと色や大きさを設定する・・・けど、膨大な量なんだよね(涙)

400blogカスタマイズのオニ・・・その1

[Blog記録]

なんだかだんだんと燃えてきたカスタマイズ
そうだった、私こういうとこ思いっきりオタクなので、いじらずにはいられない~
ってことで、色々探してはごそごそなおし・・・を繰り返す
オタクの血が騒ぐ~~~っ(-。-)y-゜゜゜

Sugar Tit: Category Archives をタイトルで一覧表示
これで月間表示やカテゴリーごとのページが巨大ファイルにならずにすむ
それでもあかんほどに増えてきたたら、プラグインで対応すべし

と思っていたけど、それよりももしかしたらこっちがいいかも
bird.dip.jp: Category Archive のカスタマイズ

追記:今はこの記事は参考にならない。バージョンが違うからタグが変かも。2005.11

二〇〇四年 五月 二十七日(木)

400blogBlog 事始 その2

[Blog記録]

設置したのはいいけど、とっても殺風景・・・
デフォルトのスタイルシートがそもそも殺風景なのだ
どうしたらいいのかわからないけど、とりあえず最初にBlogを作ろうと思ってあれこれ探したときに
ARTIFACT ―人工事実―
このページで勉強したので、さらにまた色々探す

あちこちみるとどうもメインの記事の両脇にリンクや写真を飾ることができるらしいとわかる
しかし、デフォルトデザインでは2つのパートにしか分かれていない
これを3つに分けるためには全体的にテンプレートを書き直す必要があるようだ
しかーし!なぜかリンク切れを起こしていて、その説明があるところにたどり着かない
なんとかたどり着いたのがココ
iNTERNET magazine -はじめてのCSSでblog自分流デザイン 2xUP新作テンプレートダウンロードページ-
HINAGATAさんという方が作ったテンプレートが公開されている
すばらしい、ありがとう
なんとか3カラム化は成功した

追記:2005.11
HINAGATAさんは今はここです。

400blogBlog事始 その1

[Blog記録]

Blogを始めてひと月足らず
まあ色々やってみたさ
どうやって今の「お頭的日常・ブログバージョン」ができたか、覚書を書いておこう
万が一なにかあったときに、復活させるの大変だからな~

このBlogは「Movable Type」というソフトを使っている
今までの日記はCGIで書かれたものを使っていたが、それとはまたちと違うらしい
しかももともと英語圏のものなので、日本語化させるパッチを当てないといけない
一度国産のツールを使ってみたが、どうもしっくりこず、挑戦してみることに

とりあえずあれこれやってみるために下調べをしていると、なんとHPのサーバー「XREA.COM」に
XREA SUPPORT BOARD - Movable Typeの設置方法について」と書かれたコーナーが!
なーんと、簡単にソフトを設置するためのパッチが用意されていたのだ
うーん、親切すぎる
あれこれやってみたがるオタクの血が騒ぐけど、まあここはそれに頼っておこう
設置完了。感謝感激

とは言っても、実はここから長いカスタマイズの道が続くのであった・・・

 1  |  2  |  3  |  4  | All pages