Trước khi tạo theme cho blog bạn phải biết một vài thuật ngữ thông dụng như hình đầu, hình cuối, hình nền bài viết ..., như vậy bạn mới hình dung ra được những gì mình sẽ làm và đặc biệt là kích thước của hình nền từng phần, bạn nên tìm một css để xem những hình ảnh này có kích thướng thường là bao nhiêu. Vì vậy nếu bạn chưa biết thì cứ tạo thử nghiệm, như vậy đỡ phải mắc công sức tìm kiếm hình ảnh rồi sửa đi sửa lại. Khi nào làm xong bản thử nghiệm rồi hãy tiến hành làm bản chính.
*1 tạo hình đầu cho blog mình có đoạn css sau
body.blog_my, body.blog_my_index, body.comment_listing, body.trackback_listing, body.blog_archives_folder, body.blog_archives_date, body.blog_archives_all, body.post_rte, body.post_doodle, body.guestbook, body.comment_list, body.subscribe_list, body.post_gb, body.profile_view, body.gallery,
body.photo_big, body.slideshow, body.photo_upload_pc, body.photo_upload_gallery{text-align:center;background:url(linh ảnh) center 0px no-repeat;}
*2 tạo hình nền cho blog của bạn
Css
body.blog_my, body.blog_my_index, body.comment_listing, body.trackback_listing, body.blog_archives_folder, body.blog_archives_date,
body.blog_archives_all, body.post_rte, body.post_doodle, body.guestbook, body.comment_list, body.subscribe_list,
body.post_gb, body.profile_view, body.gallery, body.photo_big, body.slideshow, body.photo_upload_pc, body.photo_upload_gallery
{background:#000000 url(linh hình) fixed;}
*3 tạo hình ở cuối trang cho blog của bạn
Css
#bd{background:transparent url(linh hình) no-repeat center bottom;}
*4 tạo hình đại diện khi đưa chuột vào bài viết (ảnh nhỏ, avata…>
Css
#article_list_module .rc_bd .rc_bc .bd ul li:hover{background:transparent url(linh hình) no-repeat bottom right;}
*5 tạo hình nền cho bài viết , cũa mình ở ngoài trang chính
Css
#article_list_module .bd:hover{background:url(linh hình) no-repeat fixed center;}
*6 tạo hình nền cho bài viết o trang phu khi đưa chộut váo
Css
#single_post #article_list_module .bd:hover {background:url(linh hình) no-repeat fixed center;}
*7 xoá các phần ko cần thiết và sửa lỗi
Sua loi banner{}
#blog_title .rc_bd .rc_bc .bd{background:transparent url(http://www.fileden.com/files/2009/8/23/2552127/Lu.png) top center;height:50px;}
Xoa khung tim kiem{}
#blogsearch{display:none;}
Xoa thanh search duoi{}
#ygmatop, #ygmalogo img, .blog_dummyselect, #ygma .blogsrch {display:none;}
Thanh menu{}
.yuimenubar {padding:0 240px;width:480px;}
.yuimenubar .hd i{background:url(linh hình vd http://img59.imageshack.us/img59/4481/toolbaru.png) no-repeat center;height:100px;width:485px;}
Nen thanh search phai{}
.ysearch {background:transparent url(linh hình vd:http://img714.imageshack.us/img714/8702/nensearch.png) no-repeat center;height:35px;}
.ysearch {border-style:none;}
#ygmatop, #ygmasrchfrm, #ygmasrchfrm fieldset, .yuimenubar .hd, .yuimenubarnav .yuimenubaritem, .yuimenubaritemlabel, #blogsearch form, #blogsearch .hd b, #blogsearch .hd u, #blogsearch .hd i{background:transparent;border-style:none;}
.yuimenubar{border-style:none;}
#ygmasrchfrm input, #blogsearch input{background:none;}
*8 chèn thêm 1 ảnh động vào dưói hình đại diện của mình làm đẹp co ô home
Css
#ysm_bottom{display:none;}
'#profile_highlight img{height:0;}
#profile_highlight .profile_photos{background:url(linh hình động) no-repeat center;height:350px;}
*9 chèn fax bứơm bay hay gì tuỳ ban vào coss dể khi đưa chuột ra ngoài xẽ hiễn thị
Css
#single_post #article_list_module .bd:hover {background:url(linh fax vd:http://img195.imageshack.us/img195/333/buombay.gif) no-repeat fixed center;}
#ysm_bottom{display:none;}
*10 chèn coss cho khung hồ xơ của bạn
Css
body.profile_view {background:#000000 url(linh hình) no-repeat fixed center;}
Chú ý:
Các bạn copy tất cả coss trên và thay linh hình tuỳ thích vào thì bạn đã tạo đựoc cái thems đơn giản ồi , nhìn cũng được
Huong dan lam theme blog theo duccanh89kg
No comments:
Post a Comment