Xem thủ thuật tại www.thuthuatblog.com

Xem thủ thuật blog tại Thủ thuật blog

Đăng ký blog vào công cụ tìm kiếm tiếng Việt của Yahoo!

Gần đây trên trang quản lý thống kê của blog này ở StatCounter lượt truy cập đến từ công cụ tìm kiếm Yahoo! tiếng Việt (vn.search.yahoo.com) ngày một thường xuyên hơn. Với số lượng người dùng các dịch vụ blog, chat và mail của Yahoo! đứng đầu Việt Nam, blog tiếng Việt của bạn không thể bỏ qua “miếng bánh ngon” đem lại lượng truy cập hấp dẫn.


Để dễ dàng tìm thấy các bài viết của mình bạn nên đăng ký địa chỉ blog và địa chỉ feed của blog vào công cụ. Cách thức tương tự như đưa vào công cụ tìm kiếm Yahoo! tiếng Anh trước đây. Khác chăng bạn truy cập bằng một địa chỉ khác và ngôn ngữ đã được Việt hóa.

Truy cập tại đây, một cửa sổ hiện ra và bấm Đăng ký miễn phí trang của bạn, bạn có thể được yêu đăng nhập tài khoản Yahoo! (nếu chưa đăng nhập Yahoo! Mail, 360,…) và khai báo các URL theo yêu cầu.

Với Blogger chúng ta có thể dùng http://yourblog.blogspot.com/rss.xmlhttp://yourblog.blogspot.com/atom.xml để nhập vào URL của feed (Thay yourblog bằng tên blog của bạn).

Đăng ký xong bạn chỉ việc đợi Yahoo! cập nhật và kiếm traffic cho blog.

Hình chụp lượng truy cập ThuThuatBlog.com đến từ công cụ tìm kiếm Yahoo! tiếng Việt.


Cách đặt code quảng cáo của Chợ Điện Tử vào template Blogger

Trước đây chương trình quảng cáo của Chợ Điện Tử cung cấp hai loại code JavaScript và flash cho các webmaster và blogger tùy ý sử dụng cho trang của họ. Tuy nhiên loại code JavaScript không thể hiển thị đúng trên Blogger mặt dù nền blog này hỗ trợ khá đầy đủ JavaScript.

Kể từ phiên bản cập nhật gần đây, Chợ Điện Tử đã giới hạn chỉ cho các website có tên miền riêng, thứ hạng dưới 1 triệu trên Alexa tham gia hệ thống này. Các Blogger (BlogSpot) có tên miền riêng dù có đáp ứng đủ điều kiện trên cũng đành ngậm ngùi.

Sau thời gian tìm hiểu, tôi đã phát hiện ra một cách hợp lý đặt code Chợ Điện Tử vào template của Blogger. Đây là cách mà nhiều người sử dụng để đặt Google AdSense code vào blog. Đó là chuyển các ký tự đặc biệt thành mã HTML. Cách này không dùng được trong trường hợp bạn đặt trực tiếp trên layout thông qua tiện ích HTML/JavaScript.

Sau đây là các bước:

Bước 1. Đăng nhập trang quản lý tài khoản của bạn trên Chợ Điện Tử (http://ads.chodientu.vn) và tạo widget quảng cáo mới sau đó lấy code.

Bước 2. Chép tất cả đoạn code lấy được trên vào khung ở trang này, nhấn CONVERT AD CODE, và bấm HIGHTLIGHT ALL để chép hết đoạn mã chuyển đổi được.

Bước 3. Đăng nhập Blogger, chọn thẻ Layout (Trình bày) | Edit HTML (Chỉnh sửa HTML), đánh dấu chọn Expand Widget Templates (Mở rộng tiện ích mẫu). Trước khi tiếp tục chúng ta tải mẫu hiện tại về máy tính thông qua link Download Full Template (Tải mẫu đầy đủ) đề phòng thao tác sai có thể phục hồi mẫu sau này.

Dán đoạn mã chuyển đổi trên vào các vị trí mình muốn và lưu lại:

a. Phía dưới tiêu đề bài đăng:

Xin tham khảo hướng dẫn tương tự cách chèn đánh giá bài viết ngay sau tiêu đề.

b. Phía cuối bài đăng:

Xin tham khảo hướng dẫn tương tự cách chèn một đoạn văn bản cuối bài đăng.

c. Cách đặt vào HTML/JavaScript (dùng trên sidebar và vị trí khác):

Đăng nhập vào Blogger, chọn Layout (Trình bày) -> Edit HTML (Chỉnh sửa HTML), bây giờ hãy lưu ý các thành phần trang tương ứng trên sidebar (hoặc vị trí khác) sẽ được điều khiển bởi các đoạn code tương ứng. Để dễ hiểu tôi lấy ví dụ sidebar bên trái của template có hai thành phần trang (Label và HTML/JavaScript, tương ứng với id=’Label1′ và id=’HTML1′):

      <div id='left-col'>
<b:section class='sidebar' id='left-sidebar' preferred='yes'>
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
<b:widget id='HTML1' locked='false' title='Quà tặng từ TTO' type='HTML'/>
</b:section>
</div>

Chúng ta sẽ đặt code quảng cáo trên thành phần HTML/JavaScript nên copy toàn bộ id=’HTML1′ dán ngay vị trí muốn hiển thị:

      <div id='left-col'>
<b:section class='sidebar' id='left-sidebar' preferred='yes'>
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
<b:widget id='HTML1' locked='false' title='Quà tặng từ TTO' type='HTML'/>
<b:widget id='HTML1' locked='false' title='Quà tặng từ TTO' type='HTML'/>
</b:section>
</div>

Và thay đổi id=’HTML1′ -> id=’HTML2′ (mỗi id là duy nhất, nên thay đổi sao cho không trùng với id khác), title=’Quà tặng từ TTO’ -> title=’Quảng cáo’ (Bạn phải đặt title, nếu HTML/JavaScript này không có tên sẽ không thể hiển thị) như sau và lưu lại như sau:

      <div id='left-col'>
<b:section class='sidebar' id='left-sidebar' preferred='yes'>
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
<b:widget id='HTML1' locked='false' title='Quà tặng từ TTO' type='HTML'/>
<b:widget id='HTML2' locked='false' title='Quảng cáo' type='HTML'/>
</b:section>
</div>

Lưu xong chúng ta check Expand Widget Templates (Mở rộng tiện ích mẫu) và tìm id=’HTML2′ (Dùng Ctrl + F) và dán code như dưới đây:

<b:widget id='HTML2' locked='false' title='Quảng cáo' 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'>
Dán code Chợ Điện Tử đã convert theo hướng dẫn trên vào đây!
<data:content/>
</div>

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

Chúng ta có thể sử dụng bất kỳ id=’HTMLNo’ nào trong HTML của template để làm chèn code như trên và kéo thả thay đổi vị trí trên layout.

Nếu bạn có blog hoặc website đáp ứng yêu cầu như đã nói ở phần đầu có thể xem hướng dẫn tham gia và kiếm tiền.

Chúc bạn kiếm được nhiều tiền khao mình một chầu cà phê nhé!

Đặt code trong khung trên bài viết của Blogger

Theo yêu cầu của anh Thắng, tôi viết hướng dẫn này chia sẻ một trong những cách đơn giản nhưng không kém chuyên nghiệp để đặt code nằm trên khung trong bài đăng của Blogger. Với cách làm này đoạn mã hiển thị sẽ trông dễ nhìn hơn và người đọc dễ sao chép khi muốn sử dụng.

CSS điều khiển thuộc tính khung hiện code:

Để hiển thị code bạn cần đặt chúng giữa hai thẻ mở <pre> và đóng </pre> trong bài viết của mình. Muốn đẹp hơn bạn có thể thêm khung bằng cách sử dụng các thuộc tính về màu chữ, màu nền, font chữ, đường viền, kích thước rộng và cao, thanh trượt, cách viền … bằng cách thêm code CSS vào thẻ mở, ví dụ: <pre style=”color: #333333; background: #999999; width: 100%; height: 50px; overflow: auto; padding: 10px;”>.

Một cách chuyên nghiệp hơn chúng ta sẽ tạo ra một class mới và đặt chúng vào CSS của template (đặt vào bất kỳ vị trí nào giữa hai thẻ <b:skin><![CDATA[/*]]></b:skin> ). Việc làm này sẽ giúp bạn sử dụng khung hiển thị code thống nhất ở tất cả các bài viết có dùng khung và dễ chỉnh sửa thuộc tính khi muốn thay đổi. Ví dụ ở đây tôi tạo ra lớp pre-formatting có CSS như sau:

.pre-formatting{
color: #333333;
background: #999999;
border: 2px solid #999999;
overflow: auto;
font-family: "Tahoma", Tahoma;
padding: 10px;
}

Đương nhiên trong template nên bạn có thể sử dụng các biến lấy giá trị cho từng thuộc tính đã được định nghĩa trước đó. Ví dụ:

.pre-formatting{
color: $textcolor;
background: $bgcolor;
border: 2px solid $bordercolor;
overflow: auto;
font: $headerfont;
padding: 10px;
}

Cách sử dụng:

Để code xuất hiện mang thuộc tính của CSS đã lưu trước đó chúng ta sẽ sử dụng chế độ HTML để soạn bài và đặt code như sau:

<pre style="height: 100px;" class="pre-formatting">Code</pre>

Câu hỏi đặt ra ở đây là chúng ta đã dùng class pre-formatting, vậy tại sao phải thêm CSS điều khiển height (chiều cao của khung), có dư thừa chăng? Câu trả lời phụ thuộc vào đoạn code mà bạn dùng. Nếu đoạn code đó ngắn bạn chọn giá trị chiều cao khung nhỏ và ngược lại, không nhất thiết phải thêm vào CSS của template vì chúng ta không biết trước đoạn code mỗi lần dùng. Không dư thừa chút nào!

Cũng xin lưu ý bạn phải chuyển đổi các ký tự đặc biệt thành mã HTML (ví dụ: < thành &#38lt;> thành &#38gt;) trước khi đặt giữa hai thẻ trên. Và mách nhỏ hãy lưu đoạn code đó vào Post Template (Mẫu đăng bài) trong Settings (Cài đặt) | Formatting (Đang định dạng) để không cần phải gõ mỗi lần dùng.

CẬP NHẬT:

Tôi vừa biết thêm một cách chuyên nghiệp hơn và đơn giản hơn vì không phải ước lượng height cho đoạn code bạn dùng.

Bạn cũng thêm một đoạn CSS điều khiển hiển thị code như trên nhưng để chúng đi kèm thẻ pre hoặc code:

pre, code{
color: $textcolor;
background: $bgcolor;
border: 2px solid $bordercolor;
overflow: auto;
font: $headerfont;
padding: 10px;
}

Khi sử dụng trong post chúng ta sẽ đặt code theo một trong hai cách:

<pre>
... code ...
</pre>

Hoặc:

<code>
... code ...
</code>

Với cách này người ta có thể dùng hình ảnh đánh số thứ tự làm nền để đoạn code hiển thị trông đẹp hơn. Bạn có thể chép đoạn code sau mà tôi đang dùng cho template của mình.

pre, code {
display:block;
font: 1em 'Courier New', Fixed, monospace;
font-size : 100%;
color: #666666;
background : #fff url(http://img178.imageshack.us/img178/1307/prepb3.jpg) no-repeat left top;
overflow : auto;
text-align:left;
border : 1px solid #99cc66;
padding : 0px 20px 0 30px;
margin:1em 0 1em 0;
line-height:17px;
}

Một số biểu tượng đặc biệt hiện trạng thái online của Yahoo! Messenger

Không cần làm VIP trên Yahoo! bạn vẫn có thể sử dụng một số biểu tượng đặc biệt của Yahoo! Messenger để hiện trạng thái online của mình trên blog hoặc website.

Hãy chép lại đoạn mã sau và sửa đổi theo hướng dẫn dưới.

<a href="ymsgr:sendIM?Yahoo!ID"><img border="0" src="http://presence.msg.yahoo.com/online?u=Yahoo!ID&m=g&t=ImageNo&l=us">

Trong đó thay thế các chữ màu đỏ:

  • Yahoo!ID: Nickname của bạn (Hoặc địa chỉ email nếu bạn sử dụng dạng nickname@ymail.com, nickname@rocketmail.com). Ví dụ: dv2n hoặc dv2n@ymail.com
  • ImageNo: Số thứ tự biểu tượng mà bạn định dùng tương ứng với các hình sau:
ImageNo: 6
ImageNo: 7
ImageNo: 8
ImageNo: 9
ImageNo:10
ImageNo: 11
ImageNo: 12
ImageNo: 13
ImageNo: 14
ImageNo: 15
ImageNo: 16

Đây đoạn mã hiển thị trạng thái online của tôi và sử dụng hình 16:

<a href="ymsgr:sendIM?dv2n"><img border="0" src="http://presence.msg.yahoo.com/online?u=dv2n&m=g&t=16&l=us">

Tôi đã kiểm tra thử một Yahoo! ID bình thường vẫn sử dụng được các biểu tượng trên, không nhất thiết phải là Power User (dv2n là nick Power User). Bạn có thể xem thêm hướng dẫn cách đưa biểu tượng hiển thị trạng thái online qua Yahoo! MessengerSkype lên blog hoặc website của mình.

Làm thế nào để sử dụng khung nhận xét của Blogger?

Gần đây Blogger cập nhật nhiều tính năng mới hấp dẫn. Một trong số đó là hệ thống comment mới với khung nhập nội dung nằm ngay sau bài viết. Đây chính là tính năng được chờ đợi nhất vì ưu thế quen thuộc mà người dùng thường thấy trên các nền blog Yahoo! 360, WordPress,…

Để sự dụng tính năng này bạn phải đăng nhập blog của mình theo địa chỉ http://draft.blogger.com và chọn Embedded below post (Bài đăng dưới đây đã được nhúng) tương ứng với Comment Form Placement (Vị trí mẫu nhận xét) ở mục Comments (Nhận xét) của thẻ Settings (Cài đặt). Và nhấn xem blog để kiểm tra khung có xuất hiện hay không.

Với một blog mới vừa được tạo, tùy mẫu có thể đoạn mã quản lý xuất hiện của khung nhận xét đã được thêm trước đó. Trong trường hợp không có hay muốn sử dụng cho mẫu hiện tại bạn cần nhấn phần Expand Widget Templates (Mở rộng mẫu tiện ích) tìm đoạn code sau:

      <p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</p>

Và thay thế bằng:

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>

</p>

Lưu lại, xem blog bạn sẽ thấy xuất hiện như sau:

Để chỉnh sửa định dạng đoạn văn bản ghi dưới Post a comment(Đăng một nhận xét) trong trường hợp có sử dụng Comment Form Message (Thư thông báo Mẫu Nhận xét) bạn chỉ cần tìm đoạn mã:

   <p><data:blogCommentMessage/></p>

Và thêm một đoạn CSS điều khiển định dạng (Ví dụ tôi thêm vào canh đều văn bản và kiểu chữ nghiêng như hình trên):

<p style='text-align: justify; font-style: italic;'><data:blogCommentMessage/></p> 

Nếu gặp vấn đề bạn có thể đăng một nhận xét ngay dưới bài viết này để chúng ta cùng nhau tháo gỡ. Chúc thành công!

BỔ SUNG:

Nếu khung nhận xét vẫn không xuất hiện trên trang của của bài viết cụ thể (trong trường hợp bạn đã chọn chế độ cho phép comment) hãy bổ sung thêm đoạn code màu đỏ theo vị trí của dưới đây:

<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comments'/>
<b:include data='post' name='comment-form'/>
</b:if>
<b:if cond='data:post.includeAd'>
<data:adEnd/>
<data:adCode/>
<data:adStart/>
</b:if>

Tên miền cho Blogger miễn phí: BlogSpotvn.com

Tin vui cho các bạn Blogger (BlogSpot.com) là tôi vừa đăng ký tên miền BLOGSPOTVN.COM và cung cấp tên miền con (subdomain) của tên miền này miễn phí cho các bạn làm blog ở Blogger. Dùng tên miền riêng sẽ giúp blog không bị ngăn khi người dùng internet của VNPT xem blog.

Tên miền con của tên miền moohay.com vẫn dùng bình thường và nếu bạn có ý định đổi sang địa chỉ này vui lòng thông báo để tôi tạo trang chuyển đổi đến địa chỉ mới của bạn.

Bước 1. ĐĂNG KÝ:

Nhấn vào đây và để lại thông tin theo mẫu (Chép và sửa lại cho phù hợp với các thông tin của bạn):

  • Tên blog: Tên blog của bạn
  • URL: Địa chỉ blog
  • URL dự định: http://têncủabạn.blogspotvn.com
  • Yahoo! Messenger ID: Nickname của Yahoo! Messenger (Dùng để nhắn cho bạn khi đã cài xong, nhớ cho nhé!). Bạn cũng có thể xem thông báo đia chỉ đã kích hoạt trong chat box tại trang www.blogspotvn.com

Ví dụ:

Bước 2. CÀI ĐẶT ĐỊA CHỈ ĐĂNG KÝ TRÊN CHO BLOG:

Tên miền đã đăng ký và kích hoạt xong vẫn chưa thể sử dụng được nếu bạn không thay đổi địa chỉ blog của mình thành địa chỉ mới này.Tóm tắt các thay đổi: Đăng nhập Blogger.com, chọn Settings (Cài đặt) | Publishing (Đang công bố), nhấn Custom Domain (Tên miền tùy chỉnh) -> nhấn Switch to advanced settings (Chuyển sang cài đặt nâng cao) và gõ tên miền đã đăng ký và lưu lại.

Có hai cách gõ:

(1) Nếu bạn dự định sẽ dùng tên miền của mình dạng không có www hãy gõ địa chỉ không có www. Ví dụ: abc.blogspotvn.com. Nhập xong lưu lại và làm giống như hình dưới. Địa chỉ blog của bạn sẽ là http://abc.blogspotvn.com.

(2) Nếu bạn dự định sẽ dùng tên miền của mình dạng có www hãy gõ địa chỉ có www. Ví dụ: http://www.abc.blogspotvn.com. Nhập xong lưu lại và làm giống như hình dưới. Địa chỉ blog của bạn sẽ là http://www.abc.blogspotvn.com.

Nhớ cài theo đúng hướng dẫn của hình cả hai địa chỉ có hoặc không có www đều truy cập được vào blog của bạn. Các địa chỉ đã cài không giống như hướng dẫn có thể bổ sung để hợp lý hơn.

Tôi xin lỗi lúc trước bỏ qua phần này. Hãy xem thêm một hướng dẫn khác.

Nhiều khi tôi không có thời gian update địa chỉ đã đăng ký vào danh sách bên dưới nên bạn đã đăng ký rồi cứ kiểm tra địa chỉ của mình trên trình duyệt web. Nếu mở địa chỉ hiện nội dung: Server Not Found, Error 404 chứng tỏ link đã sử dụng được, tới đây chỉ cần khai báo như trên. Hoặc bạn cũng có thể xem thông báo trong shoutbox tại trang www.blogspotvn.com hoặc bên dưới:


Lưu ý:

Địa chỉ đã đăng ký và được kích hoạt nên sớm đưa vào sử dụng.

DANH SÁCH TÊN MIỀN CON ĐÃ ĐĂNG KÝ:(Cập nhật lúc 18h30 ngày 24/07/2008)

  1. http://chungtalaa1.blogspotvn.com/
  2. http://hoanganhphi.blogspotvn.com
  3. http://haotuyet.blogspotvn.com
  4. http://nmtitsoft.blogspotvn.com
  5. http://thattinhbuon.blogspotvn.com
  6. http://duyk2.blogspotvn.com
  7. http://thegioiinternet.blogspotvn.com
  8. http://dailyslab.blogspotvn.com
  9. http://juujigun.blogspotvn.com
  10. http://unitapviet.blogspotvn.com
  11. http://viettan.blogspotvn.com
  12. http://ttb.blogspotvn.com
  13. http://thanhthieuthicangiuoc.blogspotvn.com
  14. http://vnchip.blogspotvn.com/
  15. http://htdl.blogspotvn.com
  16. http://pjnny_bkjem.blogspotvn.com
  17. http://vnsearch.blogspotvn.com
  18. http://vnngoogle.blogspotvn.com
  19. http://sukidayo.blogspotvn.com
  20. http://cbcy.blogspotvn.com
  21. http://lanlimitless.blogspotvn.com
  22. http://nhatrangtourist.blogspotvn.com
  23. http://2a13.blogspotvn.com
  24. http://anhchangkungfu.blogspotvn.com
  25. http://bloghoatau.blogspotvn.com
  26. http://pro126.blogspotvn.com
  27. http://thulinhminhchi.blogspotvn.com
  28. http://xahoi.blogspotvn.com
  29. http://languagesstudy.blogspotvn.com
  30. http://lehalong.blogspotvn.com
  31. http://chungmatdo.blogspotvn.com
  32. http://nmh.misinglovingyou.blogspotvn.com
  33. http://hvhoai.blogspotvn.com
  34. http://j0hnbl4ck.blogspotvn.com
  35. http://sorryembaby.blogspotvn.com
  36. http://voc.blogspotvn.com
  37. http://vinhtran.blogspotvn.com
  38. http://matden.blogspotvn.com
  39. http://tommynt.blogspotvn.com
  40. http://umbala.blogspotvn.com
  41. http://ytetantap.blogspotvn.com
  42. http://bancuahoai.blogspotvn.com
  43. http://dutoan.blogspotvn.com
  44. http://shjn8x.blogspotvn.com
  45. http://adam.blogspotvn.com
  46. http://eva.blogspotvn.com
  47. http://sanofi-ebooksmedicine.bllogspotvn.com
  48. http://thuthuat.blogspotvn.com
  49. http://saobacdaunhoem.blogspotvn.com
  50. http://tungtoan.blogspotvn.com
  51. http://doandinhbinh.blogspotvn.com
  52. http://conquydo07.blogspotvn.com
  53. http://btku.blogspotvn.com
  54. http://cuocdoivandep.blogspotvn.com
  55. http://subinlongan.blogspotvn.com
  56. http://bboyky.blogspotvn.com
  57. http://soft.blogspotvn.com
  58. http://lethang_archi.blogspotvn.com
  59. http://bill.blogspotvn.com
  60. http://tatthiet.blogspotvn.com
  61. http://amokachi.blogspotvn.com
  62. http://momo.blogspotvn.com
  63. http://phunghia.blogspotvn.com/
  64. http://timetorevenge2008.blogspotvn.com
  65. http://khungtroingayxua.blogspotvn.com/
  66. http://chuongduong.blogspotvn.com
  67. http://center-entertainments.blogspotvn.com
  68. http://luongvietdung.blogspotvn.com
  69. http://soft911.blogspotvn.com
  70. http://MinhQuang.blogspotvn.com
  71. http://juliecole.blogspotvn.com
  72. <!–

  73. –>

CẬP NHẬT:

Bạn có thể tự đăng ký một hòm thư có phần mở rộng @blogspotvn.com đi kèm với tên miền của mình thông qua dịch vụ Windows Live. Hãy nhấn Sign up để đăng ký.

Truy xuất hòm thư theo một trong ba địa chỉ sau:

http://mail.live.com
http://mail.blogspotvn.com
http://email.blogspotvn.com