Cách làm cho Blog trong suốt toàn tập[Update]

Vấn đề làm Blog
trong suốt có rất nhiều thắc mắc,vì vậy mình sẽ chỉnh sửa bài này chi
tiết hơn cho các bạn tham khảo
1.Làm trong suốt Black Box,phần trên cùng của
Blog.
-Phần này không cần thiết lắm.Nhưng ai thích làm
thì sử dụng code dưới nhé.
Code:

#blog_masshead .rc{background:transparent;}
#blog_masshead .rc div{background:transparent;} #blog_masshead
.rc_bd{background:transparent;} #blog_masshead
.rc_bc{background:transparent;} #blog_masshead
.rc_ft{background:transparent;} #blog_masshead .rc_ft
div{background:transparent;} #blog_masshead .bd{background:transparent;}
#blog_masshead{background:transparent}

2.Chỉ làm trong suốt Module bài viết ở chính
giữa.
-Nhấn "Thiết
kế" rồi kéo xuống phía dưới tới Module
bài viết,nhấn "Sửa"
Nó hiện ra một cái bảng như sau:

Cách làm cho Blog trong suốt toàn tập[Update] Cauhinh

Tại đây nếu bạn muốn module bài viết trong suốt
thì bạn cần xoá cái màu nền(theo mũi tên-xoá cái mã #E93131 đi)
(Nếu bạn muốn nó mờ mờ thì kéo thanh trong suốt đến vị trí thích hợp,tuy
nhiên có một vấn đề là nếu bạn làm như vậy thì màu chữ và ảnh trong
entry sẽ bị mờ theo,trông không được rõ nữa
cách khắc phục là tạo một ảnh nền trong suốt chèn vào module này.Sẽ được
hướng dẫn trong phần nâng cao)
-Bạn cũng có thể xoá (để trống) ô màu nền này

Kết quả: Nền bài viết ở giữa sẽ trong suốt
3.Làm trong suốt thêm Module (Module chính là
module phụ)
a,Nền Module
Nhấn vào thiết kế,chọn mục Theme,chọn chế độ tự sửa,nó sẽ hiện ra cái bảng sau:

Cách làm cho Blog trong suốt toàn tập[Update] Setting

Mô-đun chính vị tríem vòng tròn chú thích trong
hình)
Tiêu đề màu (vị trí 1 trong hình) :Là
nền của tiêu đề module chính
Chữ màu (vị trí 2 trong hình): Là màu nền của module chính
Mô-đun phụ
-Tiêu đề màu2: Là màu nền của tiêu đề (vị trí 3)
-Chữ màu: Màu nền của Mô đun (vị trí 4)
Như vậy muốn nền và tiêu đề của module phụ và module chính trong suốt
bạn chị cần xoá màu tại 4 vị trí như trong hình.
(Thực tế thì bạn nên giữ lại màu của tieu đề module chính và module phụ
sẽ đẹp hơn)
Cách 2: Sử dụng code:
Code:

.col-150 .rc_bd .rc_bc .bd
{background:transparent;}
.col-600 .rc_bd .rc_bc .bd {background:transparent;}
.row-920 .rc_bd .rc_bc .bd {background:transparent;}

Nếu muốn chỉ làm trong suốt một số Module
nào đó, bạn tham khảo thêmBài Viết Nàynhé !

b,Tiêu đề module
Code:

.col-150 .rc_bd .rc_bc .hd .titlebar .hd,.col-150
.rc_bd .rc_bc .hd .titlebar{background:transparent;}
.col-600 .rc_bd .rc_bc .hd .titlebar .hd,.col-600 .rc_bd .rc_bc .hd
.titlebar{background:transparent;}
.row-920 .rc_bd .rc_bc .hd .titlebar .hd,.row-920 .rc_bd .rc_bc .hd
.titlebar{background:transparent;}

Kết quả: Nền bài viết trong
suốt,nền module và tiêu đề module trong suốt,viền của module thì có màu
trắng
Chú ý: Nếu cách set màu nền
trống nếu các bạn gặp lỗi thì xem thêm bài này nhé:
Khắc phục lỗi khi
làm trong suốt Blog
4.Làm trong suốt thêm viền Module:
Có 2 cách: Vì cái viền của module thực chất là ảnh,ta có thể thay bằng
ảnh trong suốt,hoặc xoá cái viền này đi
3.1 Thay bằng ảnh trong suốt
3.2 Xoá viền Module
Quote:
/* No Border cho cac module*/
#friend-list .rc div, #friendlist_module .rc div, .rc div,.col-150 .rc
div {background:transparent ;}
#friend-list .rc, #friendlist_module .rc, .rc,.col-150 .rc
{background:transparent ;}
#friend-list .rc_bd div.rc_bc, #friendlist_module .rc_bd div.rc_bc,
.rc_bd div.rc_bc,.col-150 .rc_bd {background:transparent ;}
#friend-list .rc_bd, #friendlist_module .rc_bd, .rc_bd,.col-150 .rc_bd
div.rc_bc {background:transparent ;}
#friend-list .rc_ft div, #friendlist_module .rc_ft div, .rc_ft div,
.col-150 .rc_ft div {background:transparent ;}
#friend-list .rc_ft, #friendlist_module .rc_ft, .rc_ft, .col-150 .rc_ft
{background:transparent ;}
/* Ket Thuc*/

5.Đến đây thì Blog gần như trong suốt
hoàn toàn,còn cái Blast ai muốn trong suốt nữa thì chèn code sau
Quote:
#blast .rc_bc .bd{background:transparent;}
#blast .rc_ft, #blast .rc_ft
div{background:transparent no-repeat left top;}
#blast .rc div {background:transparent ;}
#blast .rc{background:transparent
;}
#blast .rc_bd div.rc_bc {background:transparent ;}
#blast .rc_bd {background:transparent ;}
#blast .rc_ft {background:transparent ;}
#blast .rc_ft div {background:transparent ;}

Cách làm cho Blog trong suốt toàn tập[Update] Ketqua1

6.Lúc này Blog ta gần như trong suốt
hoàn toàn,vần còn một số vấn đề như sau:
-Viền Module Blog yêu thích không trong suốt
-Nền comments
(Sẽ được hướng dẫn trong phần hướng
dẫn nâng cao)
Update:
7.Làm trong suốt nền comments (khung bình luận
của bài viết)

Code

.cmt-mod-alist #comments-listing .extend-hd,
.cmt-mod-alist #comments-listing .extend-bd .alist-comment
{background:none;}
.alist-comment #comment_container *, .cmt-mod-alist #comments-listing ,
.cmt-mod-alist #comments-listing .alist-comment {background:none;}

8.Tổng số trang

Cách làm cho Blog trong suốt toàn tập[Update] 7

Ai muốn làm trong suốt cả phần này thì dùngCode:

Code:

.mod-alist-summary .pagination, .mod-alist-full
.pagination{background:transparent}
9.Trong suốt Module Tâm trạng

Code:

#mod_lifeline div.bd, #mod_lifeline div.rc_bc
{background:transparent!important;}
10.Phần xem thêm,module hình ảnh

Code:

#photo_highlight .ft {background:transparent}
11.Module tên Blog

Code:

#blog_title .bd{background:transparent}

Trên đây là toàn bộ hướng dẫn làm Blog trong
suốt,tuỳ theo nhu cầu của bạn,mà áp dụng từng bước một cách hợp lý
Ví dụ: Bạn muốn làm blog trong suốt hoàn toàn,nhưng muốn tiêu đề của các
module có màu đỏ,thì ở bước 2
mục nền tiêu đề module chính và phụ bạn để nó màu đỏ.
Bonus:
1.Theme một ảnh cố định đứng im khi kéo xuống (giống Blog mình)
Quote: BODY.blog_my {BACKGROUND:url(Địa chỉ ảnh) #000000
fixed;}
Thay cái địa chỉ ảnh bằng link
ảnh bạn lấy làm theme,kích thước chiều rộng nên là 1004px
2.Theme gồm 2 hình Top-Bottom giống 360Yahoo
Quote: /* Khu Vuc Top-Bottom Theme Code CSS*/
body{background:#225ce1;}
/* mau nen cua theme thay doi theo dung mau da thiet ke se lam tang tinh
my thuat cho theme */ #doc2, #doc{background:#225ce1 url(https://2img.net/h/i292.photobucket.com/albums/mm19/themesplus2000/blue-sky-top.jpg) no-repeat center top;}
/* mau nen cua theme va link hinh top-theme nay thay doi duoc*/
#bd{background:transparent url(https://2img.net/h/i292.photobucket.com/albums/mm19/themesplus2000/blue-sky-bot.jpg) no-repeat center bottom;}
/* mau nen cua theme va link hinh bottom-theme nay thay doi duoc*/
/* Luu y: mau nen cua 2 hang tren phai dong nhat mot ma mau voi nhau
theo mau nen cua code theme */
/* Ket Thuc Khu Vuc Top-Bottom Theme Code CSS*/

Thay 2 cái hình kia gồm Top và Bottom bằng
link ảnh của bạn
Thay mã màu bằng mã màu phù hợp với 2 hình (màu nền ở giữa)
Chú ý: Với những đoạn code có ảnh
đuôi .png,một số trình duyệt không hỗ trợ (IE6) vì vậy các bạn đừng thắc
mắc nha.

» Code chèn hình ảnh vào Blog ( Toàn Tập )
» Màu, Kiểu, Kích cỡ và căn chỉnh font chữ toàn blog (3 - Trang Bình Luận Nhanh)
» Một số Web logo và cách làm banner cho blog
» Chèn nhạc vào blog cách đơn giản nhất
» Làm theme ngẫu nhiên cho Blog Plus - Random Theme Blog Plus