个性化blog的方法集锦

1、为你的 Blog 添加“天气预报”功能。    

在“选项”->“配置”的“静态新闻/声明”中加入下面的语句就可以了： 

今日天气

2、
给blog增加flash精美时钟

时钟申请：http://www.butabon.com/

刻度时钟：

其中的http://www.butabon.com/Clock/clock_038.swf是时钟的flash地址，可以在IE中预览，其中的038可以替换成000-039之间或者051-059之间的任何一个数字(全看个人喜好，呵呵)

数字时钟：

第一种风格：

其中的http://www.butabon.com/Clock/digiwide019.swf同样是时钟的flash地址，可以在IE中预览，其中的019可以替换成000-019之间之间的任何一个数字(同样全看个人喜好，呵呵)

第二种风格：

其中的http://www.butabon.com/Clock/digital_019.swf同样是时钟的flash地址，可以在IE中预览，其中的019可以替换成000-019之间之间的任何一个你可以在IE中可以成功预览的数字(请自己测试)。

3、给BLOG加一个控制菜单展开和收缩的按扭 

在看文章的时候BLOG的菜单栏实在的太碍眼，我于是加了个按扭用来控制菜单的显示和隐藏。这可以用javascript来实现，但是CSDN BLOG是不允许在配置中直接加入javascript的，但是我们可以将javascript加入到一张图片onload事件里执行。看我的就是加到计数计的图片代码里了，效果看左上角。程序代码如下：

var div=document.createElement(‘span’);
document.body.insertAdjacentElement(‘beforeEnd’,div);
div.style.cssText=’position:absolute;display:block;top:42;left:2;width:90;height:20;color:green;background:yellow;border:2 outset;cursor:hand;’;
div.innerText='<<收回菜单';
div.onclick=function()
{
var isHide=(rightmenu.style.display==’none’);
rightmenu.style.display=isHide?’block’:’none’;
div.innerText=isHide?'<>’;
}

4、对BLOG皮肤的具体修改

我所选择的皮肤模式是AnotherEon001。以下是具体的自定义的CSS： 
.headermaintitle{font-family:隶书;font-size:1cm;color:#000000;align:center}
.BlogStats{color:black;}
p.date span 
{
 background-color : #e7e7e7;
}
.post
{
 border: 1px solid #CCCCCC;
 border-bottom-width: 2px;
 border-right-width: 2px;
 padding: 4px;
 margin-bottom: 28px;
 background-color: #dadada;
}
.post h2
{
 font-size: 14px;
 margin: 0px;
 margin-bottom: 4px;
 font-family:楷体_gb2312;
}
.post a
{
 color: #ff5500;
}
.post .postfoot
{
 margin: 0px;
 margin-top: 14px;
 color: #aa6666;
 border-top: 1px solid #DDDDDD;
 font-size: 0.8em;
 background-color: #c8c8c8;
}
#top 
{
 background-color : #ffffff;
 height: 75px;
 vertical-align: middle; 
 background-image:url(http://blog.gaodaima.com/images/blog_csdn_net/peterdoo/18050/o_yu.jpg-600);
 background-repeat:no-repeat;
 filter:alpha(opacity=80);
}
#sub
{
 text-align: right;
 background-color:#BBd4D9;
 color: #CCCCCC;
 font-size: 0.8em;
 padding: 4px;
}
#LeftCell
{
 width: 200px;
 vertical-align: top;
 background-color:#BBC3D9;
 filter:alpha(opacity=100,finishopacity=0,style=1);
}
.MainCell
{
 border-left: 1px solid #DDDDDD;
 border-bottom: 1px solid #DDDDDD;
 padding: 10px;
 background-color:#e7e7e7;
 vertical-align: top;
}

背景图片是上传到相册中的图片。

对左边的菜单区没有使用背景图片，只是使用filter:alpha(opacity=100,finishopacity=0,style=1);产生了过渡效果的背景色。其实没什么技术含量！

 

5、BLOG中显示你的MSN和QQ的状态

将以下代码粘贴到BLOG管理配置中’静态新闻’文本框中就可以了，保存页面，重新看看你的首页 

MSN状态：

    
        align=”absmiddle” border=”0″ ALT=”MSN Online Status Indicator”
    onerror=”this.onerror=null;this.src=’http://snind.gotdns.com:8080/image/msnunknown.gif&#8217;;”>

    更多可去http://snind.gotdns.com:8080

QQ状态：

     

    更多可去http://qqol.3322.org/

 

6、为你的Blog打造个性日历控件 
日历控件是dotnet自带的控件之一，功能强大，在很多项目开发中都有用到，对于blog系统来说更是必不可少。纵是好玉也仍需雕琢，为了使它更美观实用，我们还需要对它进行二次开发。

第一步是外观设置，这个根据你的需要，只需对它的相关属性做一些调整即可。下图是我调整后的界面，属性设置如下：        DayHeaderStyle-BackColor=”#5e715e” OtherMonthDayStyle-ForeColor=”#cccccc” DayNameFormat=”Full”
        runat=”server” TitleStyle-ForeColor=”#ffffff” NextPrevStyle-ForeColor=”#ffffff” CellSpacing=”1″
        WeekendDayStyle-BackColor=”#eeeeee” DayHeaderStyle-ForeColor=”#ffffff” SelectionMode=”None”
        TodayDayStyle-BorderColor=”#5e715e” TodayDayStyle-BorderWidth=”1″ TodayDayStyle-Font-Bold=”true”
        TodayDayStyle-ForeColor=”#5e715e”>

第二步是对内部功能的调整，这个工作主要集中在以下两个事件的处理上。

PreRender：当服务器控件将要呈现给其包含的Page对象时发生。

DayRender：当为Calendar控件在控件层次结构中创建每一天时发生。

先定义三个整型变量和整型数组
  private int[] arrCurrentDays,arrPreDays,arrNextDays;   //三个变量分别是当前月，前一月，和下一个月
  private int intCurrentMonth,intPreMonth,intNextMonth;  //三个整型数组存放相对月份写有blog的日期
  protected System.Web.UI.WebControls.Calendar Calendar1;  //这个就是我们的日历控件了

     2. 下面我将分别给出这两个事件的源码，并在下面解释它实现的功能，如果你看不明白，可以先看下面的说明

PreRender
  private void Calendar1_PreRender(object sender, System.EventArgs e)
  {
   Thread threadCurrent = Thread.CurrentThread; 
   CultureInfo ciNew = (CultureInfo)threadCurrent.CurrentCulture.Clone(); 
   ciNew.DateTimeFormat.DayNames = new string[]{“日”,”一”,”二”,”三”,”四”,”五”,”六”}; 
   ciNew.DateTimeFormat.FirstDayOfWeek = DayOfWeek.Sunday; 
   threadCurrent.CurrentCulture = ciNew;
  }

以上代码改变了星期名称的显示。你只需改变字符数组的值就能改名称显示。

DayRender
private void Calendar1_DayRender(object sender, System.Web.UI.WebControls.DayRenderEventArgs e)
  {
     //该控件在创建每一天时发生。

     CalendarDay d = ((DayRenderEventArgs)e).Day;
     TableCell c = ((DayRenderEventArgs)e).Cell;

     // 初始化当前月有Blog的日期数组
     if( intPreMonth == 0 )
     {
         intPreMonth = d.Date.Month;  // 注意：日历控件初始化时我们得到的第一个月并不是当前月，而是前一个月的月份
         intCurrentMonth = intPreMonth+1;
　　  if (intCurrentMonth>12)
              intCurrentMonth=1 ;
         intNextMonth = intCurrentMonth+1;
         if (intNextMonth >12)
              intNextMonth =1;
         arrPreDays = getArrayDay(d.Date.Year,intPreMonth); //得到前一个月有blog的日期数组
         arrCurrentDays = getArrayDay(d.Date.Year,intCurrentMonth) ;//得到当月有blog的日期数组
         arrNextDays = getArrayDay(d.Date.Year,intNextMonth) ;//得到下个月有blog的日期数组
   }

   int j=0;
if( d.Date.Month.Equals(intPreMonth) )
   {
      while( ! arrPreDays[j].Equals(0) )
      {
           if(d.Date.Day.Equals(arrPreDays[j]))
           {
                c.Controls.来源gaodaimacom搞#代%码网Clear();
                c.Controls.Add(new LiteralControl(”       d.Date.Month+”&day=”+d.Date.Day+”>”+d.Date.Day+””));
           }
           j++;
      }
   }
   else if( d.Date.Month.Equals(intCurrentMonth) )
   {
       while( ! arrCurrentDays[j].Equals(0) )
      {
            if(d.Date.Day.Equals(arrCurrentDays[j]))
            {
                 c.Controls.Clear();
                 c.Controls.Add(new LiteralControl(”       d.Date.Month+”&day=”+d.Date.Day+”>”+d.Date.Day+””));
             }
             j++;
       }
   }
   else if( d.Date.Month.Equals(intNextMonth) )
   {
        while( ! arrNextDays[j].Equals(0) )
        {
              if(d.Date.Day.Equals(arrNextDays[j]))
              {
                    c.Controls.Clear();
                    c.Controls.Add(new LiteralControl(”       d.Date.Month+”&day=”+d.Date.Day+”>”+d.Date.Day+””)); 
              }
               j++;
          }
    }
}

日期控件一个页面能显示三个月份的日期，当前月是完整的，前一月和下一月有部分日期。DayRender事件会初始化具体日期的显示方式，在这里我们要对有blog内容的日期加上超级链接。于是我们需要在初始化时得到三个数组，数组里分别存放连续三个月的写有blog的日期。然后依次与当前日期比较，相同则加上链接。

在使用DayRender事件时，你一定不要忘了它是在每个日期初始化时执行一次，这就意味着初始化一次日历控件这个事件就要执行42次，所以要尽可能的简化操作，更不要不加判断的进行重复的数据库操作，我刚开始时没注意，在该事件里写了两个读库语句，结果严重影响性能。

下面这个方法是我用来获得日期数组的。
// 得到该月有blog的日期数组
  private int[] getArrayDay(int intYear,int intMonth)
  {
       int[] intArray = new int[31];
       //从数据库里选取符合要求的记录，将日期存入数组
       string strSql = “select content_time from content where year(content_time)=”+intYear+
    ” and month(content_time)=”+intMonth;
   dr = SqlHandle.GetDr(strSql);
   while(dr.Read())
   {
        if( i==0 )
       {
             intArray[i] = dr.GetDateTime(0).Day;
             i++;
        }
        else if( dr.GetDateTime(0).Day != intArray[i-1] )
        {
             intArray[i] = dr.GetDateTime(0).Day;
             i++;
         }
   }
   dr.Close();
    return intArray;
  }

 

7、 公告和计数器代码：

代码填写在静态新闻/声明中，目前代码如下：（其中为在http://www.laoan.com/counters/申请的免费计数器，注意将下面的kvw3000改为你自己申请的帐号）

个人简介

网名：天山雪飞

QQ：15878778

MSN：[email protected]

来自：河南
 

——————————-

访问量：


——————————-

8、.跟随鼠标的萤火虫 

以下是代码，无须修改

<div id="yyd0"
style=”position:absolute; left:10px; top:50px; width:3px; height:3px; z-index:1; background-color: #19636c; layer-background-color: #19636c; border: 1px none #000000; clip: rect(0 3 3 0)”>