Tạo khung chứa code trong bài đăng blogspot

Táy máy mò cách làm khung chứa code cho blogspot, tìm được cách khá hay mà mẫu khung lại rất đẹp nên xin hướng dẫn lại các bạn như sau.

Hình minh họa

Thông thường, khi giới thiệu code, chúng ta hay đặt chúng ngay trên bài viết. Vì cùng nằm trên một nền nên nhiều khi trông rất lộn xộn. Vậy phải làm sao để phần giới thiệu ở nền blog chính thức, còn đoạn code ở trong một khung có nền tùy chỉnh?

Đầu tiên, các bạn hãy vào Trình bày (Layout) và chọn tab Chỉnh sửa HTML mà không cần bật Mở rộng mẫu tiện ích. Sau đó, hãy thêm đoạn code dưới đây ngay trên thẻ ]]></b:skin>

.codeview {

margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhk7A628rjdESVWsvvAyoYFfq7OrPl6E04soZD1ujC8u054BayDO38SlbZwaCzRGf1NV0yODUOXanE62dJEAfKdKOUL9l-jUKBGvdloD58ZZ6j8FLyowW8a7NswLt_NcyDZkv4egz4Z9GOj/s1600/site4it_framecodeview.gif) no-repeat right bottom;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}
.codeview li {
font-size : 13px;
line-height : 24px;
font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
color : #333333;
font-weight : normal;
margin : 0;
padding : 0;
}

Bạn có thể thay đổi phần chữ màu đỏ theo ý thích.

Vậy là các bạn đã tạo xong thuộc tính đặt code trong một khung độc đáo rồi đấy.

Từ giờ, bạn có thể thêm code vào bất cứ đâu trên bài viết với thủ thuật này.
Chú ý: Trước khi sử dụng thủ thuật này, bạn phải soạn thảo ở chế độ Hiển thị HTML (vào mục Tùy chọn => Chế độ soạn thảo rồi chọn Hiển thị HTML). Sau đó bạn bấm vào nút HTML ở góc trên-bên trái màn hình để chuyển sang chế độ soạn thảo HTML và dán thẻ sau vào vị trí cần chèn code:

<div class="codeview">
Điền code vào đây
</div>

Sau khi chèn thẻ này xong, bấm vào nút Viết (cạnh nút HTML) để trở về chế độ soạn thảo và thay dòng chữ "Điền code vào đây" bằng đoạn code mà bạn cần hiển thị trên bài viết. Vậy là xong rồi.

Chúc các bạn thành công!