Bảng mã màu hệ Hecxa

- Click vào màu muốn chọn rồi xem mã bên dưới .

- Khi muốn tạo một màu mới bạn nhập mã màu mình chọn vào ô đầu tiên ( ô mã màu ) rồi nhấn
Precisely sẽ hiển thị màu bạn chọn bên dưới .




Nguồn : http://kieuphong1109.googlepages.com/mamau.html

>> more...

Chèn hình đại diện (avatar) vào trong phần Comment của Blogger

Hôm nay rảnh rỗi đi "dạo weblog " thấy trang boyprodx.blogspot.com có thủ thuật này hay hay nên post lên cho mọi người cùng tham khảo ( không biết có quá cũ không nhỉ ? vì lâu quá rồi tôi không đụng tới thủ thuật blog nữa)

Như các bạn đã biết, các blog 360 của Yahoo, WordPress đều có chế độ hiển thị hình đại diện (avatar) của mỗi người khi comment trên blog. Tuy nhiên, cho đến nay thì Blogger vẫn chưa có tính năng đó. Vậy phải làm sao để thêm được tính năng này ? Bài viết hôm nay sẽ giúp cho các bạn đấy



Đầu tiên, để mình trưng bày tác phẩm của thủ thuật này cho các bạn xem qua nhé

Hình đại diện được lấy từ ảnh trong Blogger Profile , chính vì thế mà chỉ có những blogger đã đăng nhập, đồng thời có hình trong Blogger Profile thì khi comment mới xuất hiện được avatar. Đối với các trường hợp còn lại thì sẽ xuất hiện hình này

Các bạn thấy thủ thuật này như thế nào ? Rất tuyệt đúng không. Nào , chúng ta cùng thực hiện nhé :

Đầu tiên, các bạn đăng nhập vào Blogger > Layout > Edit HTML > Bật Mở rộng mẫu tiện ích (nhớ backup lại template nhé)

Tìm thẻ </head> và thêm đoạn code dưới đây vào ngay trước thẻ </head> nhé

<script src='http://boyprodx.googlepages.com/blogger_comment_photos.js' type='text/javascript'/> <script type='text/javascript'> //<![CDATA[ addLoadEvent(function(){showCommentPhotos('commentphoto','comment-author', 1);}); //]]> </script>

Bây giờ các bạn hãy tìm đoạn code này nhé

<dl id='comments-block'> <b:loop values='data:post.comments' var='comment'> <dt class='comment-author' expr:id='&quot;comment-&quot; + data:comment.id'> <a expr:name='data:comment.anchorName'/> <b:if cond='data:comment.author == data:post.author'> <a expr:href='data:blog.homepageUrl'> <data:comment.author/></a><b:else/> <b:if cond='data:comment.authorUrl'> <a expr:href='data:comment.authorUrl'><data:comment.author/></a> <b:else/> <data:comment.author/> </b:if></b:if> <data:commentPostedByMsg/> </dt> <b:if cond='data:comment.author == data:post.author'> <dd class='blog-author-comment'> <p><data:comment.body/></p> </dd> <b:else/> <dd class='comment-body'> <b:if cond='data:comment.isDeleted'> <span class='deleted-comment'><data:comment.body/></span> <b:else/> <p><data:comment.body/></p> </b:if> </dd> </b:if> <dd class='comment-footer'> <span class='comment-timestamp'> <a expr:href='&quot;#comment-&quot; + data:comment.id' title='comment permalink'> <data:comment.timestamp/> </a> <b:include data='comment' name='commentDeleteIcon'/> </span> </dd> </b:loop> </dl>

Thay thế toàn bộ đoạn code trên bằng đoạn code dưới đây

<dl id='comments-block'> <b:loop values='data:post.comments' var='comment'> <dt class='comment-author' expr:id='"comment-" + data:comment.id'> <a expr:name='"comment-" + data:comment.id'/> <b:if cond='data:comment.authorUrl'> <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a> <b:else/> <data:comment.author/> </b:if> <data:commentPostedByMsg/> </dt> <dd class='comment-body'> <div class='commentphoto' style='float:left;margin:5px;'/> <b:if cond='data:comment.isDeleted'> <span class='deleted-comment'><data:comment.body/></span> <b:else/> <p><data:comment.body/></p> </b:if> </dd> <dd class='comment-footer'> <span class='comment-timestamp'> <a expr:href='"#comment-" + data:comment.id' title='comment permalink'> <data:comment.timestamp/> </a> <b:include data='comment' name='commentDeleteIcon'/> </span> </dd> <div style='clear:both;'/> </b:loop> </dl>

Lưu lại template và xem kết quả.

Theo:boyprodx.blogspot.com

>> more...

Google Blogger hỗ trợ sao lưu, phục hồi dữ liệu

Mới đây, Google đã giới thiệu một trong những tính năng được mong đợi nhất của nền tảng blog Blogger trứ danh của mình đó là khả năng import và export. Nói cách khác, người dùng Blogger đã có thể sao lưu và phục hồi nguyên trạng blog của mình với một vài thao tác đơn giản.

Từ đây, việc chăm lo cho đứa con tinh thần của người dùng trên nền tảng này đã trở nên đơn giản hơn trước rất nhiều. Khác với những blog sử dụng hosting, tên miền, cơ sở dữ liệu riêng, các nền tảng cộng đồng như Wordpress.com, Blogger vv...có thể dễ dàng sử dụng, nhưng người dùng không thể sao lưu phục hồi cơ sở dữ liệu của mình. Điều này làm không ít blogger đã mạnh tay khước từ thuỷ chung với các nền tảng công cộng và xây dựng những trang nhật kí riêng dựa hoàn toàn vào chi phí cá nhân.

Với sự nâng cấp chắc chắn sẽ được cộng đồng vui mừng chào đón này, Google cho thấy Blogger vẫn sẽ là thị trường quảng cáo đáng kể và nhật kí cá nhân trên mạng vẫn sẽ là trào lưu chưa thể thui chột trong nay mai. Với sự nâng cấp đáng kể này, người dùng sẽ có thêm động lực để quyết định trung thành với Blogger, vốn ban đầu không thuộc sở hữu Goolge.

Chỉ cần vài thao tác đơn giản để bảo vệ "blog yêu"

Nguy cơ bị xoá sạch blog của người dùng đã được loại bỏ, người dùng có thể nhập nhiều blog làm một. Ngoài ra, theo giới thiệu từ một số trang blog, trong tương lai, người dùng còn hi vọng sở dữ liệu từ Blogger có thể được "tái chế" trên những tền tảng thay thế khác như Wordpress, Typepad, LiveJournal vv...

Để thực hiện việc nhập-xuất cơ sở dữ liệu, chỉ cần vào Blog Tools--> Setting | Basic tab và chọn Import and Export.

Trong khi Google luôn được coi là nhà cung cấp thường xuyên nâng cấp các dịch vụ của mình thì có thể nói, lần nâng cấp Blogger lần này mới thực sự là sự kiện đáng ghi nhớ gần đây của hãng.

*** Như vậy người dùng Blogger sẽ có thể backup dữ liệu của mình lên một Host khác để cho an toàn và cải thiện tốc độ truy xuất khi có nhu cầu . Theo tôi Google sẽ từng bước khắc phục nhược điểm của mình để vươn lên dẫn đầu trong các nhà cung cấp DV Blog . (kieuphong)

Theo:thongtincongnghe.com

>> more...

Chèn tiện ích "Top of Page" cố định trên màn hình trong khi di chuyển cho blogspot

Dùng tiện ích Top of Page không thể thiếu trong mỗi một blog hay website, nó giúp cho khách ghé thăm có thể tiết kiệm thời gian, lướt blog (website) nhanh chóng !
Hôm nay tôi sẽ giới thiệu với các bạn một cách có thể chèn tiện ích Top of Page sao cho nó luôn luôn xuất hiện cố định tại một góc bên phải-dưới của màn hình, giúp cho khách ghé thăm thuận tiện trong thao tác di chuyển.

Theo tác rất đơn giản, bạn chỉ cần thực hiện theo các bước sau:

1.Đâu tiên bạn hãy Download file javascript sau: topbottom .

2.Upload lên host của bạn. Cũng như AnhVõ giới thiệu, bạn nên upload lên googlepages của mình nó sẽ tồn tại mãi mãi.

3.Tạo đoạn code:
<div id="footer-wrapper"><script language="JavaScript" src="Đường link tới file topbottom.js" type="text/javascript"><br /></script><script language="JavaScript" type="text/javascript"> cot("Đường link tới ảnh đại diện để người được click vào")</script></div>

Còn nếu như bạn lười, bạn có thể lấy luôn đoạn code của tôi:
<div id="footer-wrapper"><script language="JavaScript" src="http://tonguyencuongbio52hue.googlepages.com/topbottom.js" type="text/javascript"><br /></script><script language="JavaScript" type="text/javascript"> cot("http://tonguyencuongbio52hue.googlepages.com/top.gif")</script></div>
Tiếp theo có 2 trường hợp xảy ra:

-Bạn dùng template classic thì bạn chèn đoạn code dưới :

<!-- Footer -->

-Bạn dùng template layout thì bạn chèn đoạn code dưới:

<!-- end content-wrapper -->

Bạn có thể tham khảo thêm cách chèn khác tại bài Chèn tiện ích "Top of Page", Top of Post"
Vậy là xong rồi đó !
Bạn có thể xem trước kết quả để xem nó như thế nào tại blog của tôi: http://sinhhoc.org

Tô Cương

>> more...

Chèn Icon nhỏ trước tiêu đề bài đăng

Theo mẫu mặc định thì thanh tiêu đề bài đăng trên Blog của bạn là một dòng chữ đơn thuần và bạn có thể thay đổi màu sắc của nó trong "Chỉnh sửa HTML", "kiểu chữ và màu". Với nhiều bạn thì như vậy là quá đủ , nhưng cũng có nhiều bạn muốn chèn thêm 1 icon nhỏ phía trước để trang trí , tạo ấn tượng cho bài viết đối với người đọc.

* Cách chèn :...

+ Trước tiên thì bạn phải chọn cho mình một hình ảnh (gif , png ....),flash hoặc bất cứ thứ gì bạn muốn chèn . Nhưng lưu ý là bạn nên chọn kích thước nhỏ ( nhỏ hơn 16.16 px) cho phù hợp với thanh tiêu đề và có gí trị thẩm mỹ .
+ Khi đã có ảnh rồi thì bạn up lên đâu đó để lấy link ( Tôi thường up lên googlepages ) và "chèn ảnh" theo cú pháp sau:

<img boder="0" width="11" height="11" src='http://kieuphong1109.googlepages.com/ngoisao1.png'/>

+ Đăng nhập vào Blogger.com -> Trình bày ( Template layout) -> chỉnh sửa HTML -> Mở rộng Mẫu Tiện ích.
- Kéo thanh trượt xuống và tìm dòng :( Nên dùng tổ hợp phím Ctrl+F để tìm )

<b:if cond='data:post.url'> <a expr:href='data:post.url'>Vị Trí Chèn <data:post.title/></a>

- Chèn hình ảnh ( hoặc cái bạn muốn chèn ) như VD hình bên dưới :

<b:if cond='data:post.url'> <a expr:href='data:post.url'><img boder="0" width="11" height="11" src='http://kieuphong1109.googlepages.com/ngoisao1.png'/> <data:post.title/></a>

* Thay đổi: http://kieuphong1109.googlepages.com/ngoisao1.png bằng link dẫn tới hình ảnh của bạn và các giá trị : boder="0" width="11" height="11" sao cho phù hợp . -> Save temp lại ( Lưu Mẫu ). Đến đây là xong rồi đấy . chúc bạn thành công !

* Lưu ý : bạn nên để 1 khoảng trống giữa hình ảnh và tiêu đề như thế này : ngoisao1.png/> <data:post.title/>
* Hướng dẫn này chỉ dành cho Blogspot

kieuphong

>> more...

Chèn hình ảnh , khung ảnh chuyển động vào Blog

Liên kết bloggers

Để trang web, Blog của bạn thêm phần sinh động bạn nên chèn thêm hình ảnh , khung ảnh , chữ chuyển động …trang trí cho Blog yêu !!!

1 . Chèn hình ảnh vào widget , bài viết trên Blog

* . Sử dụng tag <img/>
: Muốn chèn hình ảnh lên widget hoặc bài viết bạn sử dụng đoạn mã sau

<img src="http://kieuphong1109.googlepages.com/dung8.gif" border="0" height="176" width="350" />

- src : là nguồn gốc , đường link dẫn tới ảnh ( bạn chỉ việc thay những chữ màu đỏ bằng đường link dẫn tới ảnh bạn muốn chèn )
- boder : đường viền bao quanh ảnh ( Bạn có thể chọn giá trị bằng 0, 1, 2, 3…tùy thích )
- width : chiều rộng của ảnh
- height : chiều cao của ảnh

<div align=”right” ><img src="http://images7.dantri.com.vn/Uploaded/duykhanh/JHook001.jpg" border="0" height="176" width="350" /></div>

- Với đoạn mã như trên thì hình ảnh sẽ hiển thị phía bên phải widget ( bài đăng ) của bạn
- Nếu muốn nó nằm về phía bên trái thì bạn chỉ việc thay chữ “right” bằng “left “, và nếu muốn nó nằm giữa thì bạn thay bằng “center”
Đa số blog có giá trị mặc định là phía bên trái . nếu muốn nó nằm ở giữa bạn chỉ cần đặt hình ảnh vào giữa hai tag <center></center> cho nhanh .
- Có thể thêm liên kết cho ảnh băng cấu trúc sau
<div align=”right” >
<a href=”liên kết bạn muốn chèn”> <
img src="http://images7.dantri.com.vn/Uploaded/duykhanh/JHook001.jpg" border="0" height="176" width="350" />
</a>
</div>



2 . Tạo khung hình , chữ chạy với thẻ <marquee>


Mời bạn tham khảo đoạn mã sau .

<marquee onmouseover="this.stop();" onmouseout="this.start();" direction="up" hspace="5" height="200" width=”200” loop="-1" scrollamount="1" scrolldelay="30" > vị trí chèn</marquee>

- Muốn cho khung hình chạy bạn chỉ việc thay chữ vị trí chèn bằng hình ảnh ( như ở trên ) ,chữ , flash …hoặc bất cứ thứ gì bạn muốn
• Chú thích :
- direction="up" : hướng chuyển động . lên hoặc xuống, qua trái hoặc qua phải ( Bạn thay chữ "up" bằng "down" nếu muốn nó chạy từ trên xuống , "right" -> chạy qua phải , "left" -> chạy qua trái )
- height="200": chiều cao
- width=”200” : chiều rộng
- scrollamount="1" : Tốc độ ( Bạn chọn số lớn hơn thì tốc độ chạy càng nhanh)
- scrolldelay="30" : Số vòng chạy ( Bạn có thể chọn bằng bao nhiêu tùy thích . VD : bạn chọn =”1” thì nó sẽ chạy 1 vòng rồi dừng lại )
- onmouseover="this.stop();" onmouseout="this.start();" : Giá trị này cho phép người dùng rà chuột vào nó sẽ dừng lại

Để trang trí cho đẹp bạn có thể tạo khung bằng thẻ <table>

- VD : tôi chèn vào khung bằng đoạn mã sau

<table border="1" align="center" cellpadding="0" cellspacing="1" width="150"> <tbody><tr> <td bgcolor="#000000" height="20" width="100%"><div align="center">Liên kết bloggers</div></td></tr> <tr> <td align="center" bgcolor="#41627e"><marquee onmouseout="this.start()" direction="up" behavior="scroll" scrollamount="1" scrolldelay="20" height="80" onmouseover="this.stop()" align="center"> <a target="_blank" href="http://online.metavn.com/"><img alt="metavn Online" src="http://freecodeweb.googlepages.com/M1.gif" title="metavn Online" height="60" width="130" /></a> <a target="_blank" href="http://delgro.blogspot.com/"><img alt="DELGRO" src="http://buidung269.googlepages.com/Link.gif" border="0" height="60" width="130" /></a> <a href="http://sideduck.blogspot.com/" target="_blank" title="Free download Photoshop resources"><img src="http://sideduck.googlepages.com/130x60.gif" border="0" height="60" width="130" /></a> </marquee></td></tr></tbody></table>

*** Bạn có thể coppy , sử dụng đoạn code trên và thay đổi lại những thông số màu xanh cho phù hợp

Và nó sẽ hiển thị như hình bên dưới.

Liên kết bloggers

Liên kết bloggers

Liên kết bloggers

Liên kết bloggers

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

kieuphong

>> more...

Thêm công cụ tìm kiếm cho Blog

Như các bạn đã biết , mỗi trang web hay blog đều có công cụ Search để người đọc có thể dễ dàng tìm kiếm thông tin . Trang của bạn chưa có hộp tìm kiếm ? ..Xin mời tham khảo môt số mẫu sau ....

1. Hộp tìm kiếm đơn giản ( tham khảo từ thuthuatblog )

<p align="left"> <form id="searchthis" action="LIÊN KẾT/search" style="display:inline;" method="get"> <strong>Tìm kiếm<br/></strong> <input id="b-query" maxlength="100" name="q" size="20" type="text"/> <input id="b-searchbtn" value="Search" type="submit"/> </form></p>

- Bạn chỉ việc coppy đọan mã trên rồi paste vào 1 widget ( trình bày -> thêm phần tử trang -> HTML/javascript ) và thay đổi những chữ màu đỏ cho phù hợp với trang của bạn

* LIÊN KẾT : thay chữ "LIÊN KẾT" bằng địa chỉ blog của bạn (VD: http://kieuphong.blogspot.com)
* Tìm kiếm : Bạn có thể thay chữ này bằng chữ Search hoặc chữ khác tùy thích . Nếu không thích nó hiển thị thì bạn có thể xóa nó đi cũng được .
* 100 : Ðây là số kí tự tối da . Bạn có thể thay đổi cho nó lớn thêm hoặc nhỏ đi tùy thích , nhưng thường là ban nên chọn con số 100 là vừa.
*20 : số kí tự hiển thị ( chiều dài của hộp ) . Bạn có thể thay đổi cho nó tăng lên hoặc giảm đi cho phù hợp với chiều ngang widget .
* Search : Có thể thay chữ này bằng chữ "tìm kiếm " hoặc chữ khác tùy thích .
- Bây giờ thì lưu thay đổi lại ....và bạn đã có một hộp tìm kiếm rất gọn và đơn giản .

2. Hộp tìm kiếm lấy từ Google Adsense.

Những bạn nào chưa đăng kí được Google Adsense mà vẫn muốn sử dụng công cụ Search của nó thì tham khảo đọan mã này.



<!-- SiteSearch Google -->
<form action="http://www.google.com.vn/custom" target="_top" method="get">
<table border="0" bgcolor="#ffffff">
<tr><td nowrap="nowrap" valign="top" height="32" align="left">
<a href="http://www.google.com/">
<img border="0" alt="Google" src="http://www.google.com/logos/Logo_25wht.gif" align="middle"/></a>
<br/>
<input value="kieuphong.com" name="domains" type="hidden"/>
<label for="sbi" style="display: none">Nhập các thuật ngữ tìm kiếm của bạn</label>
<input maxlength="255" id="sbi" value="" name="q" size="28" type="text"/>
<label for="sbb" style="display: none">Nộp mẫu đơn tìm kiếm</label>
<input id="sbb" value="Tìm kiếm" name="sa" type="submit"/>
</td></tr>
<tr>
<td nowrap="nowrap">
<table>
<tr>
<td>
<input id="ss0" value="" name="sitesearch" type="radio"/>
<label for="ss0" title="Tìm Kiếm trên Web"><font color="#000000" size="-1">Web</font></label></td>
<td>
<input id="ss1" checked value="kieuphong.com" name="sitesearch" type="radio"/>
<label for="ss1" title="Tìm kiếm kieuphong.com"><font color="#000000" size="-1">kieuphong.com</font></label></td>
</tr>
</table>
<input value="pub-6532491234052803" name="client" type="hidden"/>
<input value="1" name="forid" type="hidden"/>
<input value="ISO-8859-1" name="ie" type="hidden"/>
<input value="ISO-8859-1" name="oe" type="hidden"/>
<input value="active" name="safe" type="hidden"/>
<input value="GALT:#008000;GL:1;DIV:#336699;VLC:663399;AH:center;BGC:FFFFFF;LBGC:336699;ALC:0000FF;LC:0000FF;T:000000;GFNT:0000FF;GIMP:0000FF;FORID:1" name="cof" type="hidden"/>
<input value="vi" name="hl" type="hidden"/>
</td></tr></table>
</form>
<!-- SiteSearch Google -->



*** Bạn chỉ việc thay những chữ kieuphong.com bằng địa chỉ blog của bạn và thay số 28 "size=28" bằng 1 con số nào đó cho vừa với widget trên trang của bạn là được .

*** Bạn cũng có thể vào trang này đăng nhập bằng tài khoản Gmail.......và tự tạo cho mình một Custom Search Engine

3. Nếu bạn vẫn chưa hài lòng với 2 hộp tìm kiếm trên thì có thể vào trang này
và dùng tài khoản Gmail của mình để đăng nhập .Ở trang Google Gadgets này có rất nhiều công cụ cho bạn chọn như hộp tìm kiếm , G Talk, cá cảnh , đồng hồ ....... để trang trí cho Blog yêu của bạn .

kieuphong

>> more...

Hình nền cho từng thành phần của blog (blogspot)

Theo mẫu mặc định Blog của bạn bao gồm 4 thành phần chính: header (đầu: chứa tên, miêu tả blog, main (chính: hiển thị bài viết), sidebar (thành phần bên của trang, nằm bên trái hoặc phải hay cả hai), footer (thành phần dưới cùng).

Muốn thay đổi hình nền cho từng thành phần bạn cần làm theo những bước sau ( Bạn nào chưa biết cách chèn thì xem lại bài này )

A. Thành phần Header

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

B. Thành phần Main

#main-wrapper {
width: 410px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

C. Thành phần Sidebar

#sidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

D. Thành phần Footer

#footer {
width:660px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}

Như bạn đã biết cách chèn hình nền cho blog, đoạn mã liên kết đến hình:

background-image:url(http://www.vidu.com/hinh.jpg);

Trong đó http://www.vidu.com/hinh.jpg là liên kết đến hình nền. Như vậy muốn chèn vào header, bạn sẽ chèn như sau:

#header-wrapper {
width:660px;
background-image:url(http://www.vidu.com/hinh.jpg);
margin:0 auto 10px;
border:1px solid $bordercolor;
}

Cách chèn tương tự cho các thành phần khác.

Kích thước hình nền cho từng thành phần

Tùy theo width của mỗi thành phần. Các tối ưu nhất hình nền cho từng thành phần có chiều ngang bằng với width của mỗi thành phần. Chiều dọc càng nhỏ càng tốt.

Ví dụ thành phần main và sidebar sẽ kéo dài hoặc thu hẹp chiều dọc theo nội dung bài viết hay số lượng widget được thêm vào, điều này chúng ta không thể kiểm soát được, vì vậy sử dụng ảnh có chiều ngang bằng width của mỗi thành phần, chiều dọc nhỏ để tự động lặp lại theo độ dài hiển thị. Theo các con số như ví dụ trên, chúng ta sẽ thiết kế hình nền với chiều ngang 410px cho main và 220px cho sidebar. Một tấm ảnh vừa phải có kích thước 410 x 10 là tương đối hợp lý. Cần thêm vào đoạn mã sau để hình nền lặp lại theo chiều dọc:

background-repeat: repeat-y;

Để hình nền này nằm vị trí cân đối, bạn có thể thêm vào:

background-position: center center;

Lưu ý thêm, bạn có thể định nghĩa màu nền cho toàn bộ blog của mình sao cho tương phản và làm nổi bậc các thành phần. Có hai cách để làm việc này.

Cách 1. Bạn chọn Font and Colors (Màu và chữ) trên Template, chọn màu cho background

Cách 2. Vào Edit HTML, bạn kéo thanh trược để tìm:

body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

Trong đó background:$bgcolor; định màu nền thay đổi theo lựa chọn của bạn ở cách trên. Hãy lấy mã màu thập lục và chèn thẳng. Ví dụ, màu trắng như sau:

background:#ffffff;

Theo thuthuatblog

>> more...

Tạo chatbox cho bog của bạn.

Ðể giao luu với bạn bè, những người xem blog của bạn một cách nhanh nhất là sử dụng hộp Chat ngay trên giao diện chính Blog của bạn .( Người xem blog của bạn sẽ không tốn nhiều thời gian để viết comment)....

Cách tạo Chatbox.

Ðể làm công việc này cũng có rất nhiều trang web hỗ trợ trực tuyến cho bạn như Meebo , Cbox.ws , Shoutmix.com....? Ở đây tôi chỉ giới thiệu với các bạn trang Cbox.ws , những trang còn lại cách lfm cũng tương tự.

- Click vào link này để liên kết đến Cbox.ws
- Click Sign up , điền đầy đủ thông tin trên form đăng kí -> chọn một mẫu mà bạn thích -> tùy chỉnh chiều rộng, ngang sao cho phù hợp với nơi bạn muốn đặt nó .
- get your code : Coppy đoạn code này và paste vào 1 widget hoặc bài đăng .( Trình bày -> thêm phần tử trang -> HTML/java ....đối với blogspot)

*** Nếu sau này bạn muốn đặt nó vào chỗ khác thì bạn có thể tự sửa đoạn code này cho phù hợp ( Tìm đến dòng width="..." height="..." để thay đổi chiều rộng, cao của Chatbox)

*** Nếu bạn muốn tùy chỉnh thêm ( Thêm hình ảnh , biểu tượng vui ....) ?
- Ðăng nhập vào Cbox.ws bằng tài khoản bạn đã tạo.

1. My Account:

Tại đây cho phép bạn thay đổi email, passowrd, ngôn ngữ của giao diện chatbox...

2. Cbox Options:

Bạn có thể thay đổi các thông số của chatbox như chiều rộng, cao,... Thông thường bạn chỉ thay chiều rộng, chiều cao, những thứ còn lại hãy để mặc định.

3. Color & Fonts:

Nơi chỉnh màu và Font chữ cho chatbox, account free chỉ có 2 tab là Presets và Simple Edit. Hãy sử dụng tab Presets để chọn các mẫu có sẵn hơn là phải dùng Simple Edit để chỉnh sửa từng thành phần một. Nếu bạn không biết về mã màu thì lại càng rắc rối.

4. Smiles:

Tab hiệu chỉnh, thêm bớt các biểu tượng vui. Tab Preset Smilies khôi phục các mặt cười có sẵn, Customize Smilies để thêm bớt các mặt cười , hình ảnh tùy chọn.

* Customize Smilies: thêm hình ảnh vào Cbox .

Giả sử bạn thích 1 ảnh có đường link :
http://kieuphong1109.googlepages.com/download1.gif
và muốn cho nó vào Cbox của bạn ?

Coppy đường link dẫn tới hình ảnh rồi paste vào list link ( có thể thay thế link mặt cười cũng được)
Bạn có thể nhấn nút x để xóa một smile mà bạn không thích , nếu muốn thêm một smile hoặc hình ảnh khác nữa thì bấm New Row. Khi dã ưng ý rồi thì nhấn Save để lưu cài đặt.

5 . messenge

Tab này cho phép bạn xóa tin nhắn mình không thích trên hộp chat và xem IP của người đã gửi tin nhắn cho bạn .
Chúc bạn vui vẻ và thành công

- kieuphong-

>> more...

Tạo FavIcon - Biểu tượng trước địa chỉ

Khi duyệt web bạn thường thấy 1 icon nhỏ nằn trước địa chỉ của trang web đó ? Đó là 1 FavIcon của trang web .
Theo mặt định của Blogger.com, trước địa chỉ blog của bạn luôn có biểu tượng màu cam hình bai trùm hình chữ B. Vậy làm thế nào chúng ta thay đổi nó bằng cái của chúng ta.

***Nếu bạn đang dùng trình duyệt Firefox hoặc IE7 bạn có thể thấy được biểu tượng Favicon

Trước hết bạn cần có một hình ảnh thông thường để convert sang hình ảnh với phần mở rộng là .ico. Bạn có thể dùng các chương trình đồ họa như Microsoft Paint (Stat->Programs->Accessories->Paint), Adobe Photoshop hay bất cứ chương trình nào khác để thiết kế cho mình một cái.

Ngoài ra còn rất nhiều trang web hỗ trợ trực tuyến cho công việc này .Ở đây tôi chỉ giới thiệu với các bạn 1 trang thôi ( đủ xài là được rồi không cần nhiều đâu )

http://www.htmlkit.com/services/favicon/ có thể giúp bạn mà bạn không cần cài đặt gì.

Đầu tiên, bạn mở trang đó lên, click nút Browse để tìm đến file hình ảnh lưu trên máy. Bấm nút Generate FavIcon.ico để thực hiện. Trang kết quả hiện ra như bên dưới.



Click vào Test in Browser để xem trước. Nếu bạn ứng ý thì click Download FavIcon đề download về máy.

Bạn sẽ nhận được file hình ảnh có phần mở rộng .ico.

Bây giờ thì làm sao để bạn tìm được nơi lưu trữ file này. Rất tiếc các công cụ chia sẻ ảnh không hỗ trợ hình ảnh có phần mở rộng như vậy.

Có một giải pháp là bạn dùng Google Page Creator. Đây là một trong những lý do mà tôi đã khuyên bạn đăng ký Google Account trước khi tạo blog. Hãy kích hoạt chức năng này của Google nếu nó yêu cầu. Sau đó bạn upload file ảnh lúc nãy lên đây. Xong, bạn click phải vào file đã upload tìm liên kết đến file FavIcon có dạng như: http://tentaikhoan.googlepages.com/ttcb_favicon.ico


Nơi upload favicon trên Google Page Creator


Bạn chép (nhớ sửa lại liênkếnđếnfileFavIcon)

<link rel="shortcut icon" href="liênkếnđếnfileFavIcon"/>

Rồi paste đoạn mã này vào giữa hai tag <head> .... </head> ở Edit HTML (Template->Edit HTML). Save lại để hoàn tất. Chúc bạn thành công!

*** Khi bạn đã có tài khoản Google rồi thì chỉ cần đăng nhập -> mở thêm một trình duyệt web rồi gõ địa chỉ googlepages.com vào rồi Enter. nó sẽ tự tìm đến page cảu bạn .

Theo thuthuatblog

>> more...

Thống kê số người viếng thăm và đang online trên blog của bạn

có rất nhiều trang web hỗ trợ cho bạn công việc này . Nhưng theo kinh nghiệm sử dụng tôi chỉ giới thiệu với các bạn 1 trang rất được các webmaster cũng như những blogger tin dùng .......

TRang web tôi muốn nói đến là www.histats.com .trang này có rất nhiều mẫu đẹp cho bạn chọn và thống kê rất chính xác.
- bạn click vào đây để liên kết tới histats.com
- Bạn có thấy dòng chữ này không "Register now!!!"??
- Điền địa chỉ blog (web ) của bạn vào đấy rồi nhấn register
Sẽ có một form hiện ra . Bạn điền đầy đủ thông tin vào ( nhớ là phải điền đầy đủ đấy nhé - thiếu 1 chi tiết là nó không chịu đâu )
- Đánh dấu kiểm vào dòng "I have read and agreePublisher Agreement Terms " rồi nhấn continue.
- Một dãy những kiểu bảng thống kê hiện ra . Bạn chọn cho mình một kiểu tùy thích.( chọn mẫu nào thì đánh dấu kiểm vào cái đó ) sau đó nhấn continue
- Nó sẽ hiện ra một bảng tùy chỉnh ( nếu bạn không thích chỉnh thêm thì nhấn continue để tiếp tục) Bạn có thể tùy chỉnh cách hiển thị tổng số người ghé thăm, tổng số trang trong ngày ,số người đang online, ....
- Tiếp tục nhấn continue và chờ trong ít phút
- khi có một bảng mã java "Javascriipt counter code" hiện ra , bạn coppy và paste vào nơi bạn muốn để bảng thống kê trên trang của bạn ( Thêm 1 phần tử trang -> HTML/Javas..- đối với blogspot)

*** nếu bạn muốn cho nó nằm giữa widget thì đặt đoạn code ấy vào giữa hai thẻ <center> và </center>


VD bảng thống kê của tôi :






Nếu bạn không thích thống kê bằng Histats tôi sẽ bổ xung , giới thiệu với các bạn vài trang nữa có giao diện rất đẹp . mời các bạn đón xem .

- kieuphong -

>> more...