Sử dụng Text Widget để trang trí blog WordPress

Một điểm rất hay của WordPress.com là nó cho phép người dùng thêm/xóa các Widget bằng cách kéo/thả để trang trí cho blog của mình. Bài viết sau đây tôi sẽ hướng dẫn các bạn sử dụng Text Widget để tổ điểm cho WordPress, ví dụ như khung My Profile và Friend List mà bạn thây trên blog tôi.

Text Widget là gì?

Như mọi Widget khác, Text Widget thêm những phần nội dung mới vào Sidebar của bạn. Điểm khác biệt của Text Widget là nó không có một chức năng cụ thể mà nó phụ thuộc vào quyết định của bạn và nó không có giới hạn cho số lần xuất hiện trên Sidebar.

Text Widget đơn giản là một khung soạn thảo cùng với tiêu đề. Nội dung sau khi soạn thảo sẽ xuất hiện trên Sidebar.

Cách sử dụng Text Widget

Sau khi vào Dashboard của bạn, hãy mở tab Design lên. Ở tab Design, nhấn vào link Widget để hiển thị toàn bộ danh sách các Widget đang có.

Tìm trong danh sách Widget có tên là Text rồi nhấn nút Add để thêm nó vào Sidebar.

Sau khi thêm, bạn có thể kéo thả vị trí cho phù hợp với ý thích của mình. Nhấn vào nút Edit để thay đổi nội dung.

Một khung lớn hơn sẽ xuất hiện bao gồm một text input và một text box. Text Input để nhập tiêu đề, ví dụ như My Profile, Friend List. Trong khi Text Box sẽ nhập nội dung mình muốn vào.

Sau khi hoàn thành, nhấn nút Change tại Text Widget rồi Save Change để WordPress lưu lại các thay đổi và hoàn thành.

My Profile – Thông tin cá nhân

Text Input: My Profile

Text box: Chép đoạn code này vào

<p align=”center”><img src=”http://img181.imageshack.us/img181/7962/459arb8.jpg“></p>
Nguyễn Vũ Phương Anh<br>
Age: 20<br>
Location: Hồ Chí Minh<br>
Work: Báo Thanh Niên, Cyworld
University: Ngoại Ngữ &amp; Tin Học<br><br>

Những chỗ gạch dưới là những chỗ bạn phải thay đổi. Ví dụ, link hình đầu tiên bạn phải đổi thành link hình của bạn. Các phần còn lại thì tùy ý thích.

Friends List – Danh sách bạn

Text Input: Friends List

Text box: Chép đoạn code này vào

<table width=”100%” border=”0″>

<!– Begin List –>

<tr>
<td width=”50%”><a href=”http://trantri.wordpress.com (1a)“><img src=”http://a.wordpress.com/avatar/mrkythien96.jpg?1208410852 (1b)“></a></td>
<td width=”50%”><a href=”http://chaulkt6m.wordpress.com (2a)“><img src=”http://a.wordpress.com/avatar/chaulkt6m96.jpg?1208410852 (2b)“></a></td>
</tr>
<tr>
<td align=”center”><b>Trần Trí (1c)</b></td>
<td align=”center”><b>ChAuLkT Le (2c)</b></td>
</tr>

<!– End List –>

[blah… blah]

</table>

Những chỗ gạch dưới là những chỗ bạn phải thay đổi. Ở đây, danh sách được chưa làm 2 cột trong một bảng. Mỗi hàng sẽ chưa 2 người. Có thể tách ra làm 3 thành phần như ví dụ trên:

  • a: Đường dẫn đến blog của người bạn muốn thêm vào
  • b: Đường dẫn đến avatar của người bạn muốn thêm vào. Ở đây mrkythien hay chaulkt6m là tên tài khoản, bạn có thể hỏi người bạn của mình để thêm vào. Còn 96 là 96 pixcel, kích thước thumbnail của avatar.
  • c: Tên của người bạn muốn thêm vào.

Code HTML trên là demo sẵn 2 người. Nếu bạn muốn thêm vào nữa thì cứ copy đoạn code trong tag Beign List & End List rồi Paste vào chỗ [blah… blah], sau đó sửa đổi thông tin lại cho phù hợp.

Dĩ nhiên, đây là một cách làm thủ công, chỉ mang tính mô phỏng là chính. Bạn cũng có thể add thành link trong Blogroll, tuy nhiên tôi nghĩ làm kiểu này sẽ trực quan và đặc biệt hơn.

Trả lời

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Đăng xuất /  Thay đổi )

Google photo

Bạn đang bình luận bằng tài khoản Google Đăng xuất /  Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Đăng xuất /  Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Đăng xuất /  Thay đổi )

Connecting to %s

%d bloggers like this: