Một style nữa cho labels

Bài viết này mình sẽ hướng dẫn đổi style cho Label(Nhãn) thay vì sử dụng giao diện đơn giản mặc định của blogspot. Trước đây mình cũng giới thiệu một thủ thuật tương tự, nếu muốn tìm hiểu bạn có thể tham khảo tại đây

Tạo và cài đặt thiết lập cho Label(Nhãn)

Bước 1: Thêm tiện ích Label(Nhãn) - Nếu blog bạn đã có tiện ích này rồi thì bỏ qua bước này
Bước 2: Thiết lập tiện ích như hướng dẫn bên dưới

Thay đổi style cho Label

Bước 1: Vào Blogger > Mẫu >Chỉnh sửa HTML
Bước 2: Chèn code bên dưới vào trước thẻ ]]></b:skin>

.label-size a{float:left;margin:0 1px 1px 0;background-color:#f5f5f5;color:#0f83a0;padding:5px 7px;font-size:12px;padding: 5px; border: solid 1px #C6C6C6;margin:0 2px 6px 0;}
.label-size a:hover{background-color:#0f83a0;color:#f5f5f5}
Bước 3: Lưu lại template
7 Comments
Comments

7 comments

17/1/13
Cái Tags Cloud nó nhiều quá, mình muốn nó rút lại có con lăn như của Huy thì làm sao được! ;((
18/1/13
Xác định ID của widget Label đó. Ví dụ là Label1. Vào template ta tìm Label1 và nhìn sẽ thấy đoạn code tương tự
<b:widget id='Label1' locked='false' title='Mục' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
[co="red"]<div style='max-height:225px; overflow:auto;'>[/co]
<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
<b:if cond='data:display == &quot;list&quot;'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop values='data:labels' var='label'>
<span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span class='label-count' dir='ltr'>(<data:label.count/>)</span>
</b:if>
</span>
</b:loop>
</b:if>
<b:include name='quickedit'/>[co="red"]</div>[/co]
</div>
</b:includable>
</b:widget>

2 đoạn được tô màu đỏ là code cần phải chèn vào để thêm thuộc tính cố định chiều cao cho widget. Tương tự những widget khác bạn cũng có thể làm như vậy :>)
18/1/13
Thank Huy minh lam duoc zui nhe!
18/1/13
"Trúc" mừng nhé :))
18/1/13
:d, a`, bac' chi? minh` bo? cai' con lan o cuoi label voi nha! (o)
18/1/13
Bỏ max-width:300px đi bác :d
Chào bạn mình muốn hỏi trong trường hợp 1 blog có hai người là chủ nếu bỏ đi 1 người thì làm cách nào ?Bạn giúp mình với nhé !Cảm ơn bạn rất nhiều .https://lh3.googleusercontent.com/-duNoMAb1RS4/T2WEWrOfR8I/AAAAAAAACZ0/ObgHf-PmTuE/s36/03.gif

Cảm ơn bạn đã ghé thăm Troll VL !
» Tạm thời ngăn không cho comment với chế độ ẩn danh vì có một số bạn không có thành ý cố tình spam. Mong các bạn thông cảm!
» Bạn nên viết bằng Tiếng Việt có dấu để mọi người dễ đọc, dễ bình luận
» Để liên hệ,góp ý và đóng góp bài viết bạn click vào đây
Sử dụng các thẻ sau cho comments
» Chèn nội dung vào blockquote <b rel="quote">Nội dung blockquote</b>
» Chèn nội dung vào note <em rel="note">Nội dung note</em>
» Chèn code vào khung pre <i rel="pre">Nội dung code</i>
» Chèn hình ảnh <i rel="image">Link hình ảnh</i>
» Chèn video từ youtube [youtube]link video[/youtube]
» Chèn link <i rel="anchor">Link</i>

Insert Emoticons
:cuoi
:hihi
:thank
:haha
:meu
:cry
:oaoa
1cuoi
:D
@@
:p
:o
:vi
:ko
:ca
:why
:xin
:lanh
:im
:aoi
:ado
:mda
:tat
0:khoa
a:ab
k:ac
q:ad
w:ae
e:af
l:ag
g:ah
8:ai
9:aj
9:ag
:9a
*Phải có khoảng trống trước các code mới hiển thị mặt cười


Mã Hóa Code Tạo và xem trước comments Cancel Reply
-->