How my blog is custom-defined

The first step, open the settings, everything in the settings, let us from start to finish, from left to right step-by-step.

1. Avatar

This avatar is not an account picture, is the title there to put pictures when the avatar

Step: Upload your favorite avatar in the album (This is more convenient), open photo Album--and find the picture you want right---Copy the picture address, put in the double quotation marks above, copy the above code in the settings of the title box.

This is my code.

2, Sidebar (in the following blog sidebar announcement inside)

1) Visitor Source Map

Enter your blog's home address on the http://www.clustrmaps.com/website and copy the generated code into the announcement box

This is my code.

<a href= "http://www.clustrmaps.com/map/cnblogs.com/zhien-aa/" title= "Visitor map for cnblogs.com/zhien-aa/" > </a>

2) Visitor Volume

First of all to register on the http://www.amazingcounters.com/index.php website, and then choose a style you like to generate code, copy and paste in the announcement box is OK, this is my Code

You are &nbsp;<a href= "http://www.amazingcounters.com/" ></a>&nbsp; guest </ Div>

3) Dynamic Clock

In this URL to find your favorite type http://www.blogclock.cn/, click the preview there is code, similarly, put the code on the Bulletin board

This is the code of my heart-shaped diamond clock.

<embed width= "height=" align= "middle" wmode= "Transparent" quality= "High" src= "http://images.cnblogs.com/ cnblogs_com/csharp/clock.swf "pluginspage=" http://www.macromedia.com/go/getflashplayer "type=" application/ X-shockwave-flash ">

4) Background music

Log in to http://www.xiami.com/widget/imulti?spm=0.0.0.0.WqiEC9 at this URL, then search for your favorite music and add the selected songs. Here you can customize the color, width and height, select the HTML code to copy in the Bulletin bar box.

This is my code.

<embed src= "http://www.blogclock.cn/swf/S100003bc4baf25-c.swf" width= "165px" height= "150px" type= "application/ X-shockwave-flash "quality=" high "wmode=" Transparent "></embed><embed src=" Http://www.xiami.com/widget /200931831_3443891,2085861,1769872629,1770808806,_165_210_4db653_009609_1/multiplayer.swf "Type=" application/ X-shockwave-flash "width=" 165 "height=" wmode= "opaque" ></embed>

3) Skin Background

Slide up to the page custom CSS code box, first put the disabled template on the default css√,

The base code is a copy of the http://www.cnblogs.com/libaoheng/archive/2012/03/19/2406836.html from this blogger.

Here are some changes to my code, if you want my style can be copied directly in the box

/* Public *//* original Style blog:http://www.cnblogs.com/libaoheng/archive/2012/03/19/2406836.html */body {font-size:15px;    padding:0;    margin:0;    font-family: "Microsoft Ya Black", "Song Body", Arial; Background: #205424 url (' http://images.cnblogs.com/cnblogs_com/zhien-aa/859057/o_201404241510122297.jpg ')    No-repeat Top center fixed; min-width:1200px;}    #home {opacity:0.85;    Filter:alpha (opacity=95); box-shadow:0    0 10px #000;    margin:40px Auto;    width:1200px;    Background: #fff;    Overflow:auto; Border:solid 1px #fff;}    /* Paragraph */.postbody p,.postcon p {margin:7px 0; line-height:24px;} h1 {margin:0;}    h3 {font-size:15px; Font-weight:bold;}    /* Hyperlink */a {color: #464646; Text-decoration:none;} a:hover {text-decoration:underline;} a:visited,a:hover {color: #464646;}    UL {list-style:none;    margin:0; padding:0;} image {Border:none;} #header {padding:20px;}    /* Blog Title */#blogTitle, #blogTitle a {font-weight:bold; Color: #666;}    #blogTitle. title {margin-top:10px;    height:120px;    line-height:120px;    font-size:36px;    padding-left:120px; backgRound: #fff url (' http://img.kuai8.com/attaches/album/20140424/201404241510122297.jpg ') no-repeat;}. Headermaintitle {} #blogTitle, #blogTitle a:hover {text-decoration:none;}    /* Sub-title */.subtitle {padding-left:30px;    font-size:14px;    Color: #999;    Font-weight:normal; margin:10px 0;}    /* navigation bar */#navigator {font-size:16px;    height:48px;    Background: #55895B;    Text-align:center;    margin-top:20px; margin-bottom:20px;}    #navList Li {margin:0;    line-height:48px;    Display:inline-block; Float:left;} #navList li:hover {background: #6DA47D;} #navList Li a {padding:0    30px;    Text-decoration:none;    line-height:48px;    border:0;    Color: #fff;    Display:-moz-inline-box; Display:inline-block;}.    blogstats {height:48px;    Color: #fff; line-height:48px;} #main {padding:20px;} /* Left */#sideBarMain {padding:0    10px 0 0;    Background: #fff; margin:0    0 20px 0;    width:190px;    font-size:12px; line-height:22px;} #sideBarMain a {color: #666;} #leftcoNtentcontainer {color: #666;}. NewsItem {color: #666;}    /* Announcement */#profile_block {margin-top:0px;    line-height:24px; Text-align:left;}    /* Main Panel */#mainContent {margin-top:0px;    padding-top:0px;    padding-right:0px;    Background: #fff;    padding-bottom:0px;    Float:right;    width:960px; padding-left:0px;}    /* Daily Article List */.day {background: #fff;    padding:0; margin:0 0 20px 0;} /* Blog title */.posttitle A {color: #464646;}.    posttitle {padding-bottom:10px;    font-size:20px;    Font-weight:bold;    Color: #464646; Background:url (' Http://images.cnblogs.com/cnblogs_com/libaoheng/305804/o_br229512.link (en-us,msdn.10). gif ')    No-repeat 0 3px; padding-left:30px;}. daytitle {display:none;}    /* abstract */.c_b_p_desc {padding:10px;    line-height:24px; Color: #888;}. C_b_p_desc a {color: #888;}.    C_b_p_desc a:hover {text-decoration:none;    border-bottom-width:1px; border-bottom-style:dotted;}    /* Right picture */.desc_img {margin-left:10px;    Border:solid 1px #fff; Box-shadow:0 0 10px #aaa;} /* Post page */#topics. Post {background: #fff;}. Postcon {padding:10px 20px 0 20px;}. Postdesc {margin:0    30px;    margin-bottom:2px;    PADDING:8PX 0px;    font-size:12px;    Color: #aaa;    Background: #fff; Text-align:right;}. Postdesc a {color: #AAA;}. postbody {padding:0;}    /*google search Box */#google_q, #q {height:22px;    width:120px;    Border:solid 1px #ccc;    Box-shadow:inset 0 0 3px #ddd; border-radius:4px;}    /* Search button */.btn_my_zzk {font-family: ' Microsoft Yahei ';    Border:none;    height:26px;    width:60px;    padding:1px;    font-size:14px;    Cursor:pointer;    position:relative;    Vertical-align:middle;    Display:inline-block;    Background: #55895B;    border-radius:4px; Color: #fff;}. btn_my_zzk:hover {background: #6DA47D;}    /* Comment Button */#btn_comment_submit {border:none;    height:48px; width:120px;}    /* Comment button */.comment_btn {font-family: ' Microsoft Yahei ';    Border:none;    height:48px;    width:120px;    font-size:18px;    Cursor:pointer; Position:relative;    Vertical-align:middle;    Display:inline-block;    Background: #55895B; Color: #fff;} #btn_comment_submit: hover {background: #6DA47D;}    /* Comment title */.feedback_area_title {padding:10px;    font-size:24px;    Font-weight:bold;    Color: #55895B; Border-bottom:solid 6px #55895B;}.    feedbacklistsubtitle {font-size:12px; Color: #888;}. Feedbacklistsubtitle a {color: #888;}.    comment_quote {background: #FCFAAC;    padding:15px; border:1px solid #CCC;}    #commentform_title {color: #55895B;    Background-image:none;    Background-repeat:no-repeat;    margin-bottom:10px;    padding:10px 20px 10px 10px;    font-size:24px;    Font-weight:bold; Border-bottom:solid 6px #55895B;}    /* Comment Box */#comment_form {margin:10px 0; padding:0;}.    Commentform {margin:10px 0;    padding:10px 20px; Background: #fff;}    /* Comment input field */#tbCommentBody {font-family: ' MIcrosoft Yahei ';    margin-top:10px;    width:940px;    max-width:940px;    min-width:940px;    Background:white;Color: #333;    border:2px solid #fff;    Box-shadow:inset 0 0 8px #aaa;    padding:10px;    height:120px;    font-size:14px; min-height:120px;}    /* Comment entry */.feedbackitem {font-size:14px;    line-height:24px;    margin:10px 0;    padding:20px;    Background: #F2F2F2; box-shadow:0 0 5px #aaa;}. feedbacklistsubtitle {font-weight:normal;}    /* Category page */.entrylist {padding:10px 20px; Background: #fff;}.    Entrylistitem {margin:10px 0; padding:10px;}.    entrylistposttitle {font-size:18px;    Font-weight:bold; Background:url (' Http://images.cnblogs.com/cnblogs_com/libaoheng/305804/o_br229512.link (en-us,msdn.10). gif ')    No-repeat 0 3px; padding-left:30px;}. entrylistpostsummary {padding:10px;}.    Entrylistitempostdesc {font-size:12px;    Color: #999; padding-left:40px;}    /* Tail */#footer {font-size:12px;    margin:20px;    padding:12px;    Text-align:center;    Background: #55895B;    Color: #DDD; font-size:14px;} /* In the article picture */#cnblogs_post_body p img {margin:10px;} /* Top */.diggnum {font-size:28px;    Color: #FFFFFF; font-family: ' Microsoft Yahei ';} #div_digg. diggnum {line-height:100px;}.    diggit {float:left;    width:340px;    height:256px;    Background:url (' http://images.cnblogs.com/cnblogs_com/zhien-aa/859075/o_215836877z8yhb8xbfydgb.gif ') no-repeat; background-position:0    0;    Text-align:center; Cursor:pointer;}. Diggit:hover {background-position:-128px 0;}. Buryit {display:none;}. Diggword {display:none;}    /*green_channel*/#green_channel {text:align:right;    Background: #6DA47D;    padding-left:20px;    Font-weight:normal;    font-size:15px;    width:920px;    Border:none;    Color: #fff;    padding:20px; border-radius:4px;} /* Latest Reviews */#myposts.    postlist {font-size:14px;    line-height:24px;    margin:10px 0;    padding:20px;    Background: #F2F2F2; box-shadow:0 0 5px #aaa;} #myposts. PostTitl2 a {color: #6DA47D;}

If you don't like This background image, want their own pictures, put the picture uploaded to the album, like the above to find the address of the picture to copy the background image, the basic code inside the background image address for your own. as follows:

Body {
font-size:15px;
padding:0;
margin:0;
font-family: "Microsoft Ya Black", "Song Body", Arial;
Background: #205424 URL (' address of your background image ') no-repeat top center fixed;
min-width:1200px;
}

Well....... I do not know if you have noticed, open my blog essay on the right side will appear a small dance beginning, this is from Ching's blog , moving map address is also like Avatar address and background address,

The following is the code, in the above basic code, you may want to adjust the size.

. diggit {    float:left;    width:340px;    height:256px;    Background:url (' Your moving map address ') no-repeat;    background-position:0 0;    Text-align:center;    Cursor:pointer;}. Diggit:hover {    background-position:-128px 0;}. Buryit {    display:none;}. Diggword {    display:none;}

What's the problem can leave a message oh ~

How my blog is customized