Tùy chỉnh Block Quote cho bài viết trên Blogger

"Block quote" là một đoạn text thường dùng để làm nổi bật các trích dẫn từ các nguồn khác, hoặc để gây chú ý vào một phần nội dung nào đó của bài viết.

Tuy nhiên đối với các blog mới tạo và không có tuỳ chỉnh riêng thì phần block quote này chỉ hơi thụt vào trong so với thân bài viết, ngoài ra không có gì khác biệt. Trong bài viết này tôi sẽ hướng dẫn các bạn cách để tuỳ chỉnh block quote của riêng mình.

Bước 1: Thêm tuỳ chỉnh block quote vào template của blogger
Các bạn mở Template >> Edit HTML và tìm đến dòng code:

]]></b:skin>

Sau đó thêm vào đoạn code sau ngay trước nó:

.post blockquote {
border-style:solid;
border-color:#066bc7;
border-width:2px;
padding:10px;
background:#F0FFF0;
max-height:200px;
oveflow:auto;
}

Bước 2: Tuỳ chỉnh Block Quote theo ý muốn
1. border-style: định dạng kiểu khung bên ngoài cho quote
Có các kiểu sau để lựa chọn: dotted, dashed, solid, double, groove, ridge, inset, outset.
Có thể tuỳ chỉnh cho cạnh trái, phải, trên, dưới cho khung thay vì áp dụng cho cả khung như sau.

border-left-style:solid;

2. border-color: màu của khung
Để biết mã hexa của một màu nào đó bạn có thể vào phần Template >> Customize >> Advanced và xem các tuỳ chỉnh màu cho blogger.
Hoặc có thể vào đường link sau đây: Color Picker

3. border-width: độ dày của đường viền
4. padding: khoảng cách giữa khung và văn bản
5. background: màu nền của phần block quote