注:もしかしたら別のBlogでは
もっとややこしいかもしれません。
1.「
nagura.js」 「
nagura_icon.jpg」 「
nagura_back.jpg」をBlogにアップロードしてみて
どのフォルダにアップロードされたか覚えておく。
seesaaでは標準で/image/フォルダにアップされるようなのでこれを覚えておく。
2.今回は名倉ボタンを左サイドバーに追加してみます。
seesaa Blogの「デザイン - コンテンツ」から、新しいコンテンツを追加します。
「種類:自由形式」「配置:左サイドバー」を選び、「コンテンツの追加」をクリック!
3.以下の文を自由入力欄に書く
(青色のメッセージ部分は自由に書き換えてください)
<script type="text/javascript" language="JavaScript" src="./image/nagura.js"></script>
<div id="nagura" style="position:absolute; left:-360px; top:-80px;">
<table background="./image/nagura_back.jpg" width="360" height="80" border="0" cellpadding="6" cellspacing="0">
<tr><td width="60"></td>
<td width="300"><span style="font-size:16px; color:#FFFFFF; font-family:'HG丸ゴシックM-PRO'; line-height:100%;">
船長!ここにメッセージが<br>4行くらいまで書けますぜ!
</span></td>
</tr></table></div>
<a onclick="Nagura()" style="cursor:pointer;"><img src="./image/nagura_icon.jpg" title="名倉の一言"></a>
3.そして、赤色になっている所をさっき覚えておいた「画像がアップロードされるフォルダ」に書き換える。
(ここでは既にimageフォルダに書き換えてあります。)
4.(゚д゚)ウマー(設置例)
1.jsファイルはアップロードできないので、imageだけ「
nagura_back.jpg(
名倉背景)」 「
nagura_icon.jpg(
名倉アイコン)」をBlogにアップロードしてみて
アップロードされたファイルのパスを調べてメモしておく
(勝手に http://image.blog.livedoor.jp/nagura7/imgs/0/e/0ec10b90.jpg みたいなファイル名に書き換えられる)
2.「デザインを変更する」ボタン(左下にあります)を押して、一番右下の「カスタマイズ」を開きます。
そして、デザインの設定から「トップページ」を選びます。
真ん中らへんの「<!--プラグインA(左)ここから-->」を探して、そこの「<$PluginList_A$>」の次の行に
以下の太字部分を全部書き込みます。
(今回は左サイドバーに追加してみました。他の場所に追加したい場合は各自工夫してください。)
<script language="JavaScript">
<!--
//waittime
//画面中央で静止する時間(ms)
//初期設定では2500、つまり2.5秒静止にしてあります。
var waittime=2500;
var a,xPos,yPos,winx,winy,xx;
function Nagura(){
a=0;
if(window.opera){
winx=document.body.clientWidth;
winy=document.body.clientHeight;
nagura.style.left=parseInt(winx);
yPos=(winy/2)-40+document.body.scrollTop;
nagura.style.top=parseInt(yPos);
}
else if(document.all){
winx=document.body.clientWidth;
winy=document.body.clientHeight;
nagura.style.left=parseInt(winx);
yPos=(winy/2)-40+document.body.scrollTop;
nagura.style.top=parseInt(yPos);
nagura.style.filter="alpha(opacity=0)";
nagura.filters.alpha.opacity=100;
}
else if(document.getElementById){
winx=window.innerWidth;
winy=window.innerHeight;
document.getElementById("nagura").style.left=winx-200+'px';
xPos=winx;
yPos=(winy/2)-40+self.pageYOffset;
document.getElementById("nagura").style.top=yPos+'px';
document.getElementById("nagura").style.MozOpacity=1;
}
else if(document.layers){
winx=window.innerWidth;
winy=window.innerHeight;
document.nagura.left=winx;
yPos=(winy/2)-40+self.pageYOffset;
document.nagura.top=yPos;
document.nagura.style.MozOpacity=100;
}
xx=((winx/2)+180)/20;
StartMove();
}
function StartMove(){
if (a<19){
if(document.all){
xPos=nagura.style.left;
nagura.style.left=parseInt(xPos)-xx;
}
else if(document.getElementById){
document.getElementById("nagura").style.left=xPos-xx+'px';
xPos=xPos-xx;
}
else if(document.layers){
xPos=document.nagura.left;
document.nagura.left=xPos-xx;
}
setTimeout('StartMove()',15);
a++
}
else{
a=0;
setTimeout('MoveOut()',waittime);
}
}
function MoveOut(){
if (a<22){
if(window.opera){
xPos=nagura.style.left;
nagura.style.left=parseInt(xPos)-xx;
}
else if(document.all){
xPos=nagura.style.left;
nagura.style.left=parseInt(xPos)-xx;
nagura.style.filter="alpha(opacity=0)";
nagura.filters.alpha.opacity=100-(5*a);
}
else if(document.getElementById){
document.getElementById("nagura").style.left=xPos-xx+'px';
document.getElementById("nagura").style.MozOpacity=(100-(5*a))/100;
xPos=xPos-xx;
}
else if(document.layers){
xPos=document.nagura.left;
document.nagura.left=xPos-xx;
document.nagura.style.MozOpacity=100-(5*a);
}
setTimeout('MoveOut()',15);
a++
}
}
//-->
</script>
<div id="nagura" style="position:absolute; left:-360px; top:-80px;">
<table background="http://image.blog.livedoor.jp/nagura7/imgs/0/e/0ec10b90.jpg" width="360" height="80" border="0" cellpadding="6" cellspacing="0">
<tr><td width="60"></td>
<td width="300"><span style="font-size:16px; color:#FFFFFF; font-family:'HG丸ゴシックM-PRO'; line-height:100%;">
船長!ここにメッセージが<br>4行くらいまで書けますぜ!
</span></td>
</tr></table></div>
<a onclick="Nagura()" style="cursor:pointer;"><img src="http://image.blog.livedoor.jp/nagura7/imgs/5/3/5375f512.jpg title="名倉の一言"></a>
3.そして、
赤文字部分を最初にメモしておいた「名倉の背景」のURLに、
緑文字部分を「名倉のアイコン」のURLにそれぞれ置き換えます。
また、
青文字部分は好きなようにメッセージを書いてください。
4.
(゚д゚)ウマー(設置例)