13 lenh chuan can thiet khi code HTML cho Blogspot

13 lệnh chuẩn, cần thiết khi code HTML cho Blogspot

Written By Bình Giang on Thursday, December 19, 2013 | 1:12 AM

Ở bài này, TGB sẽ chia sẻ với các bạn về 13 lệnh thông dụng khi bạn code cho chức năng, giao diện của Blogspot. Bài viết này đã không còn ở cấp độ gói gọn trong bài đăng như ở 2 bài viết:

>>8 đoạn code cơ bản nhưng thông dụng trong Blogspot
>>10 đoạn code nâng cao khi viết bài trong Blogspot 

Và ở bài viết này code cũng không còn ở dạng "mì ăn liền" để bạn chỉ cần thay thế một số nội dung cho phù hợp. Mà ở đây, bạn cần phải có chút ít kiến thức về lập trình để có thể chỉnh sửa HTML của Blogspot sao cho phù hợp với yêu cầu của mình.

Lưu ý cuối cùng với bạn là bạn hãy backup template blogspot hiện tại của mình trước khi bắt tay vào chỉnh sửa code.

Bạn đã sẳn sàng học cách code hoàn chỉnh cho 1 trang Blogspot chưa?

1. Các loại đường viền | border: 1px #ccc solid;

 

2. Các kiểu định dạng chữ | text-decoration:none;

 

3. Thêm các định dạng link vào class

 

4. Tạo bóng đổ và bo tròn 4 góc viền

 

5. Các loại định dạng list | ... ul {list-style-type:none;}

 

/*Link hình thay cho list*/

 

6. Các vị trí đặt ảnh nền background | background: url(image) repeat ;

 

7. Code xem địa chỉ IP, thông tin của máy truy cập blog:

 

8. Cách mã hóa code:

Với ký tự < phải đổi thành &lt;
Với ký tự > phải đổi thành &gt;
Với ký tự & phải đổi thành &amp;
Với khoảng trắng phải đổi thành &nbsp;

Để post các chú thích kí tự trên lên blog được thì:

    &lt; phải đổi thành &amp;lt;
    &gt; phải đổi thành &amp;gt;
    &amp; phải đổi thành &amp;amp;

9. Các lệnh điều kiện <b:if cond= ... </b:if>

1. Điều kiện ở trang chủ:

 

2. Điều kiện ở trang bài viết:

 

3. Điều kiện ở trang chủ, trang nhãn

 

4. Điều kiện ở các trang lưu trữ

 

5. Điều kiện ở các trang tĩnh:

 

6. Điều kiện ở một trang riêng biệt nào đó

 

Nếu thay == thành != thì kết quả sẽ ngược lại - Nghĩa là sẽ loại trừ trang đặt điều kiện ra và lấy phần ngược lại (các trang còn lại)

Ví dụ: Điều kiện loại trừ trang bài viết

 

10. Thêm chữ ký hay ghi chú dưới mỗi bài viết (Đặt dưới dòng <data:post.body/>)

 

Nội_dung // Ghi chú nội dung của bạn, có thể dùng hình ảnh, màu chữ, canh lề,v.v..

11. Script chèn file .js vào blog

 

12. Script chèn trực tiếp nội dung file .js vào blog

 

13. Thêm nhanh khung hướng dẫn hay nội quy comment:

- Tìm đến thẻ <data:blogTeamBlogMessage/>
- Đôi khi có tên là <data:blogCommentMessage/>
- Thêm vào sau nó đoạn code sau:

 

    - Sau mỗi hàng phải thêm cặp thẻ <br></br> hoặc <br/> nếu muốn xuống dòng.
    - Có thể dùng các code trang trí cho khung như: hình ảnh, màu chữ, v.v..

Ví dụ: Code chèn nội dung hướng dẫn comment giống ở blog mình.

 

Share this article :

Read More

Tao khung chua code cho Blogspot

• ten san pham 

dat mua

Tạo khung chứa code cho Blogspot
Mỗi khi viết bài cần chèn code bạn chỉ cần coppy đoạn code đó sau đó Vào HTML bên góc trái phía trên sau đó bấm lại phần Viết để chèn mã code cần chèn nhé 

NỘI_DUNG_CODE

cols="59" // Bề rộng khung chứa code
 rows="18" // Số dòng trong khung chứa code
 wrap="on" // Trong một dòng, chữ dài quá khung sẽ hiện thanh trượt kéo ngang qua
 wrap="off" // Nhiều dòng chữ quá số dòng khung quy định sẽ hiện thanh trượt kéo xuống


[Tổng hợp code hay cho blog] - Code tạo khung chứa văn bản 

Các bạn copy đoạn code dưới đây và dán vào bài viết, thay đổi nội dung văn bản ở dòng chữ "Nhập nội dung ở đây", nếu cần các bạn thay đổi kích thước khung rows, cols (cao, dài)

Mẫu 1:

Demo:

Code chèn:

<textarea name="code" rows="3" cols="42" style="background: #000; color: #fff; border: 2px inset #ccc; line-height: 1.5em; padding: 0 7px; -moz-border-radius: 5px;"> Nhập nội dung ở đây 

Mẫu 2:

Demo:

Code chèn:

<textarea cols="42" name="code" rows="2" style="background: #A9F5A9; border: 2px #295F00 dashed; color: #295f00; line-height: 1.5em; padding: 5px;"> Noi dung can them vao</textarea>

Mẫu 3:

Demo:


Code chèn:

<form name="MyTextBoxForm">
<input name="button" onclick="javascript:this.form.MyTextBox.focus();this.form.MyTextBox.select();" type="button" value="Select all" />
<textarea cols="59" name="MyTextBox" rows="9" style="background: #eee; border: 1px #A0C4EA dashed; color: #464646;" wrap="on">NỘI_DUNG_CODE</textarea> 

Mẫu 4:

Demo:

NỘI DUNG

Code chèn:

<div style="border: 2px solid rgb(0, 0, 255); height: 110px; overflow: auto; width: 400px;">
<div style="text-align: center;">
</div>
NỘI DUNG</div>

Read More