Hướng dẫn tạo khung chứa mã code cho blogspot

Chào các bạn hôm nay mình sẽ hướng dẫn cho các bạn mới chơi blog, đặc biệt là các bạn làm blog chia sẽ thủ thuật có liên quan đến mã code, sau đây mình xin hướng dẫn các bạn cách thêm khung chứa code cho bài viết trên blogger

Nếu bạn đang sở hữu một trang blog hay website có bài viết chia sẻ về các thủ thuật liên quan đến việc phải chèn mã code, Khi bạn hướng dẫn một thủ thuật nào đó có chia sẻ mã code để người khác coppy thì mã code đó bạn nên đặt trong khung để người đọc dễ dàng nhìn thấy, phân biệt và coppy. Để tạo khung chứa mã code ta làm thế nào? thì các bạn làm theo như sau:

Đầu tiên các vào Mẫu/ Chỉnh sửa HTML, sau đó bạn tìm thẻ ]]></b:skin> (mẹo nhấn tổ hợp phím Ctrl + F dán ]]></b:skin> rồi Enter).

Dán đoạn code dưới đây trước thẻ ]]></b:skin>

Code:

*khung chua code*/ pre.code { display: block; font: 1em 'Courier New', Fixed, monospace; font-size: 100%; color: #666666; background: #fff ; overflow: auto; text-align: left; border: 1px solid #99cc66; padding: 0px 20px 0 30px; margin: 1em 0 1em 0; line-height: 17px; max-height:300px}


color: #666666 là màu chữ trong khung
background: #fff là màu nền của khung
border: 1px solid #99cc66; là độ rộng đường viền (1px) và màu đường viền (#99cc66)
max-height:300px là chiều cao tối đa.

Sử dụng khi viết bài:
Khi viết bài đến lúc bạn muốn đặt code thì bạn chuyển sang chế độ soạn HTML sau đó dán đoạn code sau vào:



 
class="code">
Đặt code vào đây