Khi thiết kế blog, để tạo
nên sự bắt mắt cho blog của mình, các blogger thường nghĩ đến giải pháp
thay đổi hình nền cho một số thành phần blog ví dụ như thay hình nền cho
header, footer, hình nền cho bài viết, comments... Cũng chính vì nghĩ
đến vấn đề này mà hôm nay mình mới viết 1 bài chia sẻ về cách thay đổi
hình nền - màu nền cho từng thành phần trong blog.
Đoạn code thay đổi nền thường có 1 trong 4 dạng như sau:
background: $(content.background); <! để màu như vậy thì có thể vào trình thiết kế mẫu để chỉnh màu>
background: url(link-ảnh);
background: #xxxxxx; <! #xxxxxx là đoạn mã màu, #fff là màu trắng, #000 là màu đen...>
background: transparent; <! nền trong suốt>
Công việc của bạn là cần một hình nền blog có độ phân giải đủ lớn, bạn có thể search trên google với từ khóa "backgroun blogger" hoặc "background blogspot".
Sau khi có hình nền rồi thì các bạn vào "Mẫu" chọn "Chỉnh sửa HTML" chọn "Tiếp tục" rồi đánh dấu check vào ô "Mở rộng mẫu tiện ích" > bấm tổ hợp phím "Crtl + F" tìm từ khóa " body{background "
Nó trông giống thế này
body{background: #E9F0F3 url(link hình ảnh)
Bạn cần thay đổi cái link ảnh màu đỏ bằng link ảnh mình thích là ok Uh, bạn phải úp hình nền blog lên rồi lấy link để thay thế link màu đỏ đó nữa. Bạn có thể úp ảnh nền của bạn lên upanh.com hoặc trực tiếp lên bài đănt trong blog của bạn, khi up lên blog nó sẽ có 2 link ảnh, bạn copy link ảnh đầu tiên.
Chèn 1 trong 4 đoạn code trên vào trước dấu } của thành phần đó là được.
Chú ý là nếu trong thành phần nào có background:...; rồi thì xóa nó đi rồi mới chèn background của mình vào.
Nền toàn blog
body {
...
}
Bài viết...
}
.post-outer {
...
}
Comments...
}
.comments-content{
...
}
Phần bao ngoài bài viết...
}
.main-outer {
...
}
Header...
}
.header-outer {
...
}
Footer...
}
.footer-outer {
...
}
...
}
Ngoài ra bạn có thể dùng cách sau như hình mô tả:
Bạn chọn cài đặt: Mẫu==> Tùy chỉnh
Không có nhận xét nào:
Đăng nhận xét