Tùy chỉnh blogspot template
Friday, June 26, 2009
Template mà bạn chọn có thể bao gồm 2, 3 hay 4 cột nhưng về cơ bản nó thường bao gồm các thành phần sau đây. Mình lấy ví dụ template mình đang dùng.
Để tiến hành chỉnh sửa bạn vào Layout, Edit HTML. Tùy vào template mà việc bố trí code có thể khác nhau đôi chút nhưng bản chất của chúng đều giống nhau. Khi thay đổi bất cứ thành phần nào bạn có thể dùng nút Preview để xem trước, nếu hài lòng thì tiến hành lưu lại. Bạn cũng nên sao lưu template trước khi tiến hành bất cứ sự thay đổi nào mà bạn không chắc chắn nó có ảnh hướng xấu tới template hay không bằng cách chọn Download full template.
- Thay đổi font chữ, cỡ chữ, màu chữ, màu nền.
<variable name="bodybgcolor" description="body background color"Để chỉnh sửa bạn thay đổi các giá trị phù hợp vào phần value
type="color" default="#ffbbe8" value="#ffffff">
<variable name="textcolor" description="text color"
type="color" default="#191919" value="#000000">
<variable name="textfont" description="text font"
type="font"
default="normal normal 90% arial, sans-serif"
value="normal normal 80% arial, sans-serif">
Bạn nên sử dụng chương trình bắt màu để có được màu sắc thích hợp.
- Nếu blog của bạn không có thành phần trên thì các yếu tố font chữ, màu sắc sẽ được qui định ở bên dưới. Với mỗi thành phần như Header, Post, Sidebar... bạn có thể chỉnh sửa các yếu tố như:
font-family: times, serif;Tạo background bằng hình ảnh
font-size: 180%;
letter-spacing: .5px;
text-align:left;
color:#000000;
background-color: #ffffff;
text-transform: uppercase;
text-decoration: underline;
text-decoration: none;
border: 1px solid #fff;
background: url('link tới file ảnh') repeat-x;
- Thay đổi chiều rộng, chiều cao của các thành phần.
- Chỉnh sửa blockquote.
Code:
/* ----- BLOCKQUOTE ----- */
blockquote {
margin: 10px 0px 10px 15px;
padding: 10px 15px 10px 15px;
font: $quoteFont;
line-height: 1.6em;
color: $blockQuoteColor;
background: $blockquotebgColor;
border: 2px solid $blockquoteBorderColor;
}
- Chỉnh sửa các liên kết có sẵn trong template.
Như vậy là các bạn đã có thể tự mình điều chỉnh một số thành phần trong template. Bây giờ chúng ta sẽ tiến hành thêm các Gadget vào blog. Trong phần Layout chọn Page Elements, giao diện có dạng như sau:
Để thêm Gadget bạn chọn Add Gadget. Trong mục Basics có 19 Gadgets cho bạn chọn lựa, tuy nhiên chỉ nên chọn một số nhất định vì càng nhiều Gadget thì sẽ làm giảm tốc độ hiển thị của blog. Có lẽ thành phần HTML/JavaScript sẽ được sử dụng nhiều nhất sau này. Khi những Gadget sẵn có không đáp ứng được yêu cầu thì bạn sẽ phải sử dụng các đoạn HTML code hay JavaScript để đạt được mong muốn.