Tìm kiếm
Đăng Nhập
Keywords
Latest topics
Social bookmarking
Bookmark and share the address of DIỄN ĐÀN TRƯỜNG THPT TÔN ĐỨC THẮNG on your social bookmarking website
Bookmark and share the address of DIỄN ĐÀN TRƯỜNG THPT TÔN ĐỨC THẮNG on your social bookmarking website
Affiliates
Thống Kê
Hiện có 1 người đang truy cập Diễn Đàn, gồm: 0 Thành viên, 0 Thành viên ẩn danh và 1 Khách viếng thăm Không
Số người truy cập cùng lúc nhiều nhất là 17 người, vào ngày Sat Apr 13, 2024 10:54 am
feeds
Affiliates
Thiết kế theme dành cho blog plus
Trang 1 trong tổng số 1 trang
Thiết kế theme dành cho blog plus
by tau_baygiay Tue Dec 07, 2010 7:09 pm
Trước hết, xin trình bày về thao tác cơ bản up theme: click vào thang ngang trên cùng mục:
“Thiết kế”-->“Theme”--> “Tự chỉnh sửa thiết kế-->và xuất hiện 1 khung thiết lập:
1> BACKGROUND CHO TOÀN BỘ BLOG:
Blog Plus khác so với Yahoo 360 cũ ở chỗ:
theme không up trực tiếp từ PC.
a. Đối với theme nền cố định, 1 hình duy nhất: Sau khi đã tìm được theme với kích thước ưng ý, blogger sẽ up theme nền lên 1 số
website: www.mediafire.com,
http://www.flickr.com/, http://my.opera.com/
(blog Opera của bạn), photobucket.com/…
(Plus cho phép theme có thể là ảnh nền động)
Việc đơn giản là các bạn lấy link ảnh trực tiếp tới theme đó, sau đó nhấp vào “Thiết kế”-->“Theme”-->
“Tự chỉnh sửa thiết kế-->paste vào ô “Ảnh nền”
(ô thứ 3 từ trên xuống –“Ảnh nền”). Background là màu nền sẵn có của tòan bộ Blog trước khi có theme mới, nếu bạn chọn background đen (#000000)
thì nên set chữ màu trắng (#FFFFFF – hoặc để trống ô màu
chữ) và ngược lại.
b. Theme nền gồm top và bottom (giống Blog 360):
Không copy link vào ô “Ảnh nền”, mà copy đọan code dưới đây vào “Thiết kế”-->“Theme”--> “Tự chỉnh sửa thiết kế
-->ô “CSS” (nơi chèn code CSS, ở phía dưới ):link file ảnh : Link tới ảnh top , bottom bạn đã up lên mạng
/* Code làm top và bottom như blog 360*/
Mã:
- Code:
#blast A, #blast A:hover{
COLOR: #;
}
body{
background:/*Màu background*/;}
#doc2, #doc{
background:/*Màu background*/
url(link file ảnh của top theme ) no-repeat center top;}
#bd{
background:transparent
url(link file ảnh của bottom theme ) no-repeat center bottom;}
Nền theme sẽ khác (a.) 1 chút, nó nằm cố định và không set
liền tiếp nhau:
Copy đọan code dưới đây và ô “CSS”:
(link ảnh nền: chèn link ảnh nền mà bạn đã up lên web)
Mã:
- Code:
/* hình nền cho toàn blog */
BODY.blog_my
{
BACKGROUND:url(link ảnh nền) no-repeat #ffffff fixed
center;background-color:6FAC72;
}
1 phần nằm ở khiếu thẩm mỹ của mỗi bạn :Màu nền module phụ và nền của tiêu đề các module phụ (phần nằm 2 bên, trong các ô dàn bên cạnh: tùy vào cách bạn chọn dàn trang) lẫn nền module và nền tiêu đề các module chính (phần ở giữa) : Vẫn sẽ là 1 màu background
đơn điệu.
Tùy theo theme chèn vào, các bạn chỉnh sửa lại 1 số màu sắc và phân định rõ phần nào sẽ set màu, phần nào để trong suốt (trước khi nhảy vào làm trong suốt nền hoàn toàn).
Bạn có thể hiệu chỉnh riêng Module : “Thiết kế”-->“Bài viết mới”: chỉnh độ mờ nhạt, nền màu phù hợp với chữ viết.
2> BACKGROUND CHUNG CHO CÁC MODULE:
(Chèn code vào khung "CSS")
a. Module chính (phần module ở giữa):
** Màu nền Module chính: Chèn đoạn code dưới đây vào ô “CSS”:
+ Ảnh nền là trong suốt:
Mã:
- Code:
.col-600 .rc_bd .rc_bc .bd {background:transparent;}
+ Ảnh nền là 1 background bất kỳ (Thay link ảnh nền bằg URl tới ảnh)
- Code:
.col-600 .rc_bd .rc_bc .bd {background:transparent
url(Link ảnh nền);}
+ Ảnh nền trong suốt:
Mã:
- Code:
.col-600 .rc_bd .rc_bc .hd .titlebar .hd,.col-600 .rc_bd
.rc_bc .hd .titlebar{background:transparent;}
Mã:
- Code:
.col-600 .rc_bd .rc_bc .hd .titlebar .hd,.col-600
.rc_bd .rc_bc .hd .titlebar{background:transparent
url(Link ảnh tiêu đề);}
** Màu nền Module phụ: Chèn đoạn code dưới đây vào ô “CSS”:
+ Ảnh nền trong suốt:
Mã:
- Code:
.col-150 .rc_bd .rc_bc .bd {background:transparent;}
bằg URl tới ảnh):
Mã:
- Code:
.col-150 .rc_bd .rc_bc .bd {background:transparent
url(Link ảnh nền);}
+ Ảnh nền trong suốt:
Mã:
- Code:
.col-150 .rc_bd .rc_bc .hd .titlebar .hd,
.col-150 .rc_bd .rc_bc .hd .titlebar
{background:transparent;}+ Ảnh nền là 1 background bất kỳ (Thay link ảnh nền bằg URl tới ảnh):
- Code:
.col-150 .rc_bd .rc_bc .hd .titlebar .hd,
.col-150 .rc_bd .rc_bc .hd .titlebar
{background:transparent url(Link ảnh tiêu đề);}
Module tự tạo sẽ có số hiệu từ 10001-10010. Tuỳ Module số bao nhiêu mà blogger sẽ thay “X” này bằng số thích hợp. (Nhấn vào "Thiết kế" sẽ biết module đó là số bao nhiêu)
Mã:
- Code:
#user_mod_1000X .rc_bd .rc_bc .hd
.titlebar .hd{background:transparent;}
#user_mod_1000X .rc_bd
.rc_bc .bd {background:transparent;}
**Notes: nếu muốn làm trong suốt nền các module tòan bộ cần fải để code màu thành transparent, và chọn hình nền trong suốt!
a. Ảnh nền theme của phần blog:Nếu để ảnh tràn toàn blog nên đặt là fixed như sau:
Mã:
- Code:
BODY.blog_my {BACKGROUND:
url(link hình) #000000 fixed;}
Mã:
- Code:
BODY.guestbook {BACKGROUND:
url(link hình) #000000 fixed;}
(Có thể thay bằng ảnh động, bạn nhớ kích thước của ảnh ko nên lớn quá 30 pixels):
Mã:
- Code:
#statistic .bd {background:#FFFFFF url(link hình);}
(Nên dùng ảnh màu thật nhạt, ảnh tĩnh đuôi jpg nếu ko sẽ
che hết chữ):
Mã:
- Code:
#comment_new .bd {background:#FFFFFF
url(link hình);}
Mã:
- Code:
#folder .bd {background:#FFFFFF url(link hình);}e. Ảnh nền của phần lịch (cố định kích cỡ):
- Code:
#calendar .bd {background:#FFFFFF url( link hình);}f. Ảnh nền của trang Profiles:
- Code:
BODY.profile_view {BACKGROUND:
url (link hình) #000000 fixed;}g. Ảnh nền trong mỗi Entry:
- Code:
.mod-alist-full .main-bd{background:#FFFFFF
url(link hình)}
Mã:
- Code:
.mod-alist-full .main-hd{background:#FFFFFF
url(link hình)}
(Riêng phần này: Chèn code trực tiếp vào module đó)
( Link hình link tới 1 trang khác)
Mã:
- Code:
[url=http://thpttonducthang.forumvi.net/Trang link tới]
[img]link hình[/img]
[/url](Link hình không link tới trang khác)
- Code:
[img]Link hình[/img]
Mã:
- Code:
#mod_lifeline .rc_bd .rc_bc .bd {background:
url(link hình) left top;}
Lưu ý: Tất các code này đều chèn trực tiếp vào :"Thiết kế"--> "Theme"--> "Tự chỉnh sửa theme"--> Khung "CSS"
a. Canh phải tiêu đề:
Mã:
- Code:
/* canh phải tiêu đề module */
.hd .titlebar .hd h2{
text-align:right;}
VD:
Mã:
- Code:
background:transparent url(link hình)
no-repeat XY;text-align:{left/right/center};
Mã:
- Code:
background:transparent url(link hình) no-repeat 5px top;
b. Thêm icon cho mỗi module: vị trí phía bên trái:
/* icon các module */
Mã:
- Code:
/* bảng thống kê */
#statistic h2{
background:transparent
url([url=http://hanamibuu.com/thongke.png]http://hanamibuu.com/thongke.png[/url]) no-repeat left top;}
- Code:
/* Bài mới đăng */
#article_new h2{
background:transparent
url([url=http://hanamibuu.com/baimoi.png]http://hanamibuu.com/baimoi.png[/url]) no-repeat left top;}
- Code:
/* Ảnh trong blog */
#photo_highlight h2{
background:transparent
url([url=http://hanamibuu.com/photo.png]http://hanamibuu.com/photo.png[/url]) no-repeat left top;}
.mod-comment-new .titlebar .hd h2{
background:transparent
url([url=http://hanamibuu.com/coment.png]http://hanamibuu.com/coment.png[/url]) no-repeat left top;}
- Code:
/* Thư mục riêng */
#folder h2{
background:transparent
url([url=http://hanamibuu.com/folder.png]http://hanamibuu.com/folder.png[/url]) no-repeat left top;}
- Code:
/* Cập nhật ngày */
#update_date h2{
background:transparent
url([url=http://hanamibuu.com/capnhat.png]http://hanamibuu.com/capnhat.png[/url]) no-repeat left top;}
- Code:
/* RSS */
#rss_output .bd a{
height:25px;background:transparent
url([url=http://hanamibuu.com/rss.png]http://hanamibuu.com/rss.png[/url]) no-repeat left top;}
- Code:
/* Tìm kiếm */
#search_module h2{
background:transparent
url([url=http://hanamibuu.com/timkiem.png]http://hanamibuu.com/timkiem.png[/url]) no-repeat left top;}
- Code:
/* Bình luận mới nhất */
#comment_new .bd ul li {background:transparent
url(link ảnh) no-repeat left top;}
- Code:
/* Thư mục riêng */
#folder .bd ul li {background:transparent
url(link ảnh) no-repeat left top;}
c. Thay đổi con trỏ trên blog theo ý mình:
Mã:
- Code:
body{cursor: x;}
a:hover{cursor: y;}
/* Đoạn code này làm cho hình trái tim xuất hiện khi chuột rê vào các link trên toàn blog*/
Mã:
- Code:
a:hover
{text-decoration:none;
color:#D570EE;
text-decoration:none;
font-weight:bold;
background-image:url(link ảnh);}
tau_baygiay- Tổng số bài gửi : 31
Points : 103
Reputation : 18
Join date : 05/12/2010
Trang 1 trong tổng số 1 trang
Permissions in this forum:
Bạn không có quyền trả lời bài viết|
|
|
» TRIỂN LÃM DU HỌC HOA KỲ - CÁC TRƯỜNG CAO ĐẲNG CỘNG ĐỒNG
» @@@@@@@
» geny@@
» công ty phúc lộc điền cần tuyên nhân viên gọi điện thoại làm bán thời gian
» công ty phúc lộc điền cần tuyên nhân viên gọi điện thoại làm bán thời gian
» Góp ý cho admin
» Greeting
» Cách học ngữ pháp nhanh và thu được kết quả tốt