Hướng dẫn ẩn tiêu đề của widget

Nghe mọi người phàn nàn về việc blogger bắt điền tiêu đề phần tên đề khi tạo mới 1 widget. Vấn đề này sẽ gặp1 chút rắc rối nho nhỏ cho 1 số bạn. Và việc khắc phục nó cũng đơn giản, ở đây mình sẽ giới thiệu 2 cách cho các bạn khắc phục.

A. Xóa tiêu đề cho 1 widget
- Với cách này các bạn phải xác định ID của widget, ví dụ như ta có id là HTML1
- Sau khi xác định được ID ta sẽ vào trong code template và tìm đọan code sau (các bạn nhớ nhấp chọn vào phần mở rộng mẫu tiện ích )

<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:includable>
</b:widget>

- và xóa đọan code này:

<h2 class='title'><data:title/></h2>

- như vậy ta đã xóa được title cho 1 widget.
B. Ẩn title cho nhiều widget :
- với cách 2 này ta sẽ dùng code CSS để can thiệp vào.
- Các bạn vào code template và chèn đọan code CSS bên dưới vào trước dòng code ]]></b:skin>

.widget h2.title {display:none;}

- save template lại.
- với cách này thì 1 số widget sẽ không bị ẩn tiêu đề như : widget Label, widget Archive… và đa số các widget này đều là các widget được blogger cung cấp. Ngòai ra thì đối với các widget HTML thì title của nó đều được ẩn.
- Sở dĩ có 1 số widget ko ẩn tiêu đề là do dòng code của title có hơi khác, như bên dưới :

<h2><data:title/></h2>

- do trong thẻ h2 của nó ko có chứa class=’title’ nên nó sẽ không được chọn và sẽ ko bị ẩn đi.
- và sẽ có 1 số bạn sẽ hỏi mình là tại sao ko dùng dòng code bên dưới để chọn tất cả các thẻ h2 chứa trong widget

.widget h2 {display:none;}

- nếu sử dụng dòng code này để ẩn tiêu đề thì phần tiêu đề của bài viết trong widget Blog1 (đây là widget chứa nội dung các bài viết của blog) cũng sẽ bị ẩn theo.
- Vì vậy nếu muốn ẩn các widget còn lại thì các bạn có 2 cách để làm :
a. Add thêm dòng class=’title’ vào thẻ h2 của các widget chưa bị ẩn
- ban đầu code là như thế này

<h2><data:title/></h2>

- và sau khi thêm sẽ như thế này

<h2 class='title'><data:title/></h2>

b. Xác định các widget chưa được ẩn title nằm ở đâu, với 1 số widget mà mình đã liệt kê thì đa số chúng thường nằm ở sidebar, và code để ẩn tiêu đề sẽ như bên dưới :

.sidebar .widget h2 {display:none;}

- với dòng code này thì tất cả các thẻ h2 trong các widget ở sidebar sẽ bị ẩn, và khi đó code chung sẽ là :

.widget h2.title {display:none;}
.sidebar .widget h2 {display:none;}

C. Ngòai ra nếu các bạn có thể dùng cách bên dưới :

.widget h2 {display:none;}
.widget#Blog1 h2 {display:block;}

- dòng code CSS đầu tiên là dùng để ẩn tất cả các thẻ h2 có trong các widget
- dòng code CSS thứ 2 là để hiển thị lại các thẻ h2 đã bị ẩn có trong widget Blog1, tức là widget chứa nội dung của blog.

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

Theo Mothuthuat