显示标签为“〝¦Blood→教程℡”的博文。显示所有博文
显示标签为“〝¦Blood→教程℡”的博文。显示所有博文

{ 教程 } 制作个人状态



登入博客 → 信息中心 → 设计 → 页面元素 → 添加小工具 → HTML/Javascript

HTML/Javascript 里添加以下代码
<fieldset style="moz-border-radius: 4px; border-radius: 4px;border: 3px solid #000000;"><legend><img src="图片网址" /></legend>状态内容<div class="separator" style="clear: both; text-align: right;">By 【你的名字】</div></fieldset>
青色字体 = 框框线条的厚度
红色字体 = 框框线条的类型,可以自行美化框框
粉色字体 = 框框线条颜色的颜色代码
蓝色字体 = 框框上“血の状态”的图片
橙色字体 = 状态内容,比如“我吃饱了噢~”“晚安~”等等
紫色字体 = 右下角的By【你的名字】

框框线条类型 

以下是本人制作的状态素材
 


如果想要更多状态素材的话,可以到本站的《素材》个人状态或者到其他的素材博客/网址去找噢~

此教程转载至泪划痕

{ 教程 } 制作个人博客链接

博客链接 = 博客与博客之间的友情链接

如图:
登入博客 → 信息中心 → 设计 → 页面元素 → 添加小工具 → HTML/Javascript

HTML/Javascript 里paste 以下代码:
<center>
<img border="0" alt="sticker" src="图片网址"/></center>

<center><textarea id="code" name="code"><center><a href="博客网址" target="_blank"><img src="图片网址"/></a></center></textarea></center>
图片网址 = 放你制作的个人链接Logo
博客网址 = 放你的博客网址

保存后,就完成了。

此教程转载至泪划痕

{ 教程 } 能移动的标题

如图:
信息中心 → 设计 → 添加小工具 → HTML /JAVASCRIPT

Copy以下的代码paste到HTML /JAVASCRIPT
<script type="text/javascript">
//Created by Title bar Maker (http://www.bosiljak.hr/titlemaker)
function tb1_makeArray(n){
this.length = n;
return this.length;
}

tb1_messages = new tb1_makeArray(1);
tb1_messages[0] = "你要输入的文字";
tb1_bln = 0;
tb1_rptType = 'infinite';
tb1_rptNbr = 5;
tb1_speed = 350;
tb1_counter=1;
tb1_timer = null;
tb1_last = 1;
tb1_st='';
tb1_currMsg = 0;
function tb1_scrolltitle(){
if (tb1_last > tb1_messages[tb1_currMsg].length){
if (tb1_st.length == 0){
tb1_last=1;
if (tb1_currMsg == tb1_messages.length-1){
if ((tb1_rptType == 'finite') && (tb1_counter==tb1_rptNbr)){
clearTimeout(tb1_timer);
return;
}
tb1_counter++;
tb1_currMsg=0;
}
else{
tb1_currMsg++;
}
}
else{
tb1_st=tb1_st.substring(1,tb1_st.length);
}
}
else{
tb1_st = tb1_messages[tb1_currMsg].substring(0, tb1_last);
for (var i=0; i<=(tb1_bln+tb1_messages[tb1_currMsg].length-tb1_last); i++)
tb1_st="_"+tb1_st;
tb1_last++;
}
document.title = tb1_st;
tb1_timer = setTimeout("tb1_scrolltitle()", tb1_speed);
}
tb1_scrolltitle();
</script>
红色字体 = 输入你的标题
保存后就完成了。

此教程转载至泪划痕

{ 教程 } 如何寻找 Cbox ID

步骤1
http://www.cbox.ws
点击以上链接登入Cbox官网 → 如下图所示的红框 点击 Publish
步骤2
CTRL+F找 &amp;sec=main

例子:

Copy &amp;sec=main 前面蓝色HighLight 部分

蓝色HighLight 部分 = 你的Cbox ID
然后把你的Cbox ID paste去你Cbox背景代码里面指定的你的Cbox ID

例子:
粉色HightLight = 你的Cbox ID
保存后就完成了。

此教程转载至泪划痕

{ 教程 } 为聊天室添加背景

如图:
Cbox 使用者的代码

登入博客 → 信息中心 → 设计 → 页面元素 → 添加小工具 → HTML/Javascript

在 HTML/Javascript 里添加以下代码:
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div id="cbox-dl-0306" style="padding-top: 20px;padding-left: 22px; width: 263px; height: 470px; background: url(聊天室背景的图片网址) no-repeat scroll left top transparent;" align="left" position: relative;>
<div><iframe src="你的Cbox ID&amp;sec=main" marginheight="2" marginwidth="2" allowtransparency="yes" name="cboxmain" style="border: 0px solid;" id="cboxmain" width="215" frameborder="0" height="243" scrolling="auto"></iframe></div><div><iframe src="你的Cbox ID&amp;sec=form" marginheight="2" marginwidth="2" allowtransparency="yes" name="cboxform" style="border-width: 0px; border-style: none solid solid; border-color: -moz-use-text-color;" id="cboxform" width="215" frameborder="0" height="75" scrolling="no"></iframe></div></div><!-- END CBOX -->
红色字体 = 放上你喜欢的聊天室背景的图片网址
橙色字体 = 放上你的Cbox ID,如何寻找 Cbox ID

Shoutmix 使用者的代码

登入博客 → 信息中心 → 设计 → 页面元素 → 添加小工具 → HTML/Javascript

在 HTML/Javascript 里添加以下代码:
<!-- Begin ShoutMix - http://www.shoutmix.com -->
<div id="shoutmix-dl-0306" style="padding-top: 25px;padding-left: 23px; width: 263px; height: 473px; background: url(聊天室背景的图片网址) no-repeat scroll left top transparent;" align="left" position: relative;>
<iframe src="http://www.shoutmix.com/?你登录Shoutmix的Shoutbox ID" width="82%" height="330" frameborder="0" scrolling="auto"></iframe></div>
红色字体 = 放上你喜欢的聊天室背景的图片网址 
橙色字体 = 放上你登陆Shoutmix的Shoutbox ID

以下是本人自制的聊天室背景:
图片网址:
http://2.bp.blogspot.com/-CCjVcQ3TFew/TtyunZB-DeI/AAAAAAAAAkA/0ejQXnxeofY/s1600/chat2.png
图片网址:
http://1.bp.blogspot.com/-ga_IUwlghRw/Ttyuo1K_7-I/AAAAAAAAAkI/tX9sdo3kCI8/s1600/chat.gif
如果想要更多聊天室背景的话,可以到本站的Blog Material或者到其他的素材博客/网址去找噢~

此教程转载至泪划痕

{ 教程 } 添加“Like My Blog”的Facebook按钮

如图:
信息中心 → 设计 → 添加小工具 → HTML/Javascript
<iframe src="http://www.facebook.com/plugins/like.php?href=博客网址&layout=standard&show_faces=true&width=225&action=like&font=arial&colorscheme=light&height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:350px; height:80px;" allowtransparency="true"></iframe></div>
红色字体 = 你的博客网址 (如:http://xketsuruix.blogspot.com )

此教程转载至泪划痕

{ 教程 } 为博客帖子添加Facebook赞

如图:
信息中心 → 设计 → 修改HTML → 【扩展窗口小部件模板】打勾

CTRL+F找<div class='post-header-line-1'/>

Copy以下的代码Paste在 <div class='post-header-line-1'/>下面
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
例子:
预览是否成功了后,就可保存模板了。

此教程转载至泪划痕

{ 教程 } 将主页,较新,较旧帖子换成图片

如图:
信息中心 → 设计 → 修改HTML → 【扩展窗口小部件模板】打勾

更换主页,CTRL+F 找 <data:homeMsg/>
<data:homeMsg/> 换成 <img src='图片网址'/> 
更换较新的帖子,CTRL+F找<data:newerPageTitle/>
<data:newerPageTitle/> 换成 <img src='图片网址'/> 
更换较旧的帖子,CTRL+F找 <data:olderPageTitle/>
<data:olderPageTitle/> 换成 <img src='图片网址'/>
红色字体 = 图片的网址

以下是一些可用的素材:
{主页}图片网址:
 http://i1140.photobucket.com/albums/n562/duleihere/th_b_18.gif
{较新}图片网址:
http://sorahana.ciao.jp/material/arrow/bbssetichigo-p2.gif
{较旧}图片网址:
http://sorahana.ciao.jp/material/arrow/bbssetichigo-p.gif
如果想要更多主页,较新,较旧素材的话,可以到本站的Blog Material或者到其他的素材博客/网址去找噢~

此教程转载至泪划痕

{ 教程 } 将博客顶图调去中间

如图:
登入博客 → 信息中心 → 设计 → 修改HTML

CTRL+F 找 /* Header

/* Header
----------------------------------------------- */ 
下面放以下代码:
#header {
margin: 0px 0px 0px 300px;
padding: 0px 0px 0px 0px;
text-align: center;
}
红色字体就是顶图位置数目越大图片越向右边

例子:
预览是否成功了后,就可保存模板了。

此教程转载至泪划痕

{ 教程 } Scroll to Top 滚动到顶部

加强版的Back to Top

Scroll to Top就如下图红箭头所示,鼠标按Back to Top的图片,就会慢慢浮上去最后消失在顶部。

如图:
信息中心 → 设计 → 页面元素 → 添加小工具 → HTML/Javascript

在 HTML/Javascript 里添加以下代码:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">


var scrolltotop={
   setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
    controlHTML: '<img src="图片网址" style="filter:alpha(opacity=70); -moz-opacity:0.1;" />',
    controlattrs: {offsetx:0, offsety:0},
    anchorkeyword: '#top',
    state: {isvisible:false, shouldvisible:false},
    scrollup:function(){
        if (!this.cssfixedsupport)
            this.$control.css({opacity:0})
        var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
        if (typeof dest=="string" && jQuery('#'+dest).length==1)
            dest=jQuery('#'+dest).offset().top
        else
            dest=0
        this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
    },
    keepfixed:function(){
        var $window=jQuery(window)
        var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
        var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
        this.$control.css({left:controlx+'px', top:controly+'px'})
    },
    togglecontrol:function(){
        var scrolltop=jQuery(window).scrollTop()
        if (!this.cssfixedsupport)
            this.keepfixed()
        this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
        if (this.state.shouldvisible && !this.state.isvisible){
            this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
            this.state.isvisible=true
        }
        else if (this.state.shouldvisible==false && this.state.isvisible){
            this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
            this.state.isvisible=false
        }


    },
    init:function(){
        jQuery(document).ready(function($){
            var mainobj=scrolltotop
            var iebrws=document.all
            mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
            mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
            mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
                .css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
                .attr({title:'Back to Top'})
                .click(function(){mainobj.scrollup(); return false})
                .appendTo('body')
            if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='')
                mainobj.$control.css({width:mainobj.$control.width()})
            mainobj.togglecontrol()
            $('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
                mainobj.scrollup()
                return false
            })
            $(window).bind('scroll resize', function(e){
                mainobj.togglecontrol()
            })


        })


    }


}
scrolltotop.init()


</script>
蓝色字体就是鼠标指向TOP的时候出现的字眼,可自行更改 
红色字体就是TOP图片的网址,可自行更改

此教程转载至泪划痕

{ 教程 } Back to Top 回到顶部

Back to Top就是回到顶点。

如图:
信息中心 → 设计 → 添加小工具 → HTML/JavaScript

Copy以下的代码Paste到HTML/JavaScript
<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Back to Top"><img src="图片网址" /></a>
蓝色字体就是鼠标指向TOP的时候出现的字眼,如上图所示,可自行更改
红色字体就是TOP图片的网址,可自行更改

以下是本人自制的TOP图:

图片网址:
http://2.bp.blogspot.com/-GJXKqHW8bOg/TtuEs-MC1FI/AAAAAAAAAbo/tCnkdn3l3mM/s1600/up.png

图片网址:
http://4.bp.blogspot.com/-Jq0-3DzyngU/TtuUyN_dZoI/AAAAAAAAAbw/YkY8gfTrdfg/s1600/up%255B2%255D.gif

图片网址:
http://4.bp.blogspot.com/-4puTTqOyKf4/TtuU90WcHbI/AAAAAAAAAcA/_knQJy_HaoQ/s1600/up%255B3%255D.gif

图片网址:
http://1.bp.blogspot.com/-9CUVIiIH-Jo/TtuU2a4bXPI/AAAAAAAAAb4/o-QQ_s4WKx8/s1600/up%255B4%255D.gif
如果想要更多TOP/UP素材的话,可以到本站的Blog Material或者到其他的素材博客/网址去找噢~

此教程转载至泪划痕