Hiển thị đoạn mã trong bài đăng Blogger

Posted by chiasedamme on Thursday, October 14, 2010

Đối với các bạn sử dụng Blogger đặc biệt trong trường hợp muốn giới thiệu các đoạn mã (code) để cùng chia sẻ với cộng đồng Blogger, việc hiển thị các đoạn mã là điều khó khăn, đôi khi không thể đối với người mới dùng (newbie) Blogger.
Trường hợp muốn hiển thị mã HTML trong các bài đăng thì phải sử dụng các ký tự XHTML để thay thế:

""
&&
<&lt;
>&gt;


Trường hợp bạn muốn trình bày các đoạn mã phức tạp trong các bài đăng, bạn nên theo các bước sau đây:
Bước 1: Đăng nhập vào tài khoản Blogger đến phần Bố cục (Layout) trong Bảng điều khiến. Sau đó đến phần Chỉnh sửa HTML (Edit HTML).
Bước 2: Thêm đoạn mã CSS bên dưới trên phần ]]></b:skin> (ấn tổ hợp phím Ctrl + F để tìm cho nhanh).

.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9;
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ể tùy chỉnh các thông số trong đoạn mã trên theo ý thích của mình.
Bước 3: Mỗi khi bạn tạo bài đăng mới có trình bày các đoạn mã (CSS, Scripts, HTML, …) thì chỉ cần đặt đoạn mã đó trong phần div như sau:

<div class="codeview">
Chèn đoạn mã bạn muốn hiển thị
</div>

{ 0 comments... read them below or add one }

Post a Comment