Home » All posts

HÌNH NỀN HOA LÁ CHO TOÀN BLOG

Người đăng: Unknown on Thứ Năm, 28 tháng 7, 2011

Dưới đây là một số mẫu hình nền áp dụng cho toàn blog có chủ đề "hình nền hoa lá", ứng với mỗi mẫu là code phía dưới, bạn chỉ cần đăng nhập vào blog > chọn thiết kế > thêm HTML/Javacript rồi dán code tương ứng phía dưới vào, bấm Lưu lại là xong.

Bạn bấm chuột trái vào hình để xem chế độ toàn màn hình trước khi lựa chọn cho mình một mẫu vừa ý để áp dụng vào Blog.


Mẫu 1:



Mẫu 2:



Mẫu 3:



Mẫu 4:



Mẫu 5:



Mẫu 6:



Mẫu 7:




Mẫu 8:



Mẫu 9:



Mẫu 10:



More about →
vào lúc 01:48 { Add nhận xét }
Nhãn: ,

Tạo khung nội quy nhận xét đóng tự động

Người đăng: Unknown


Như các bạn có thể thấy ở phần nhận xét theo các bài viết trên Thủ thuật Blogger có khung nội quy nhận xét khá lạ so với các blogspot khác, nếu để ý, sau 2 phút bạn sẽ thấy khung nội quy nhận xét này tự động đóng và biến mất. Với tính năng này, blogspot của bạn sẽ trở nên lạ hơn, gây trí tò mò hơn đối với người đọc. Lấy giả thuyết tính trung bình để đọc một bài viết trên blogspot của bạn phải mất 1,5 phút thì bạn có thể cài đặt sau 2 phút thì khung nội quy nhận xét sẽ biến mất, tức là người đọc có 30 giây để lướt qua nội quy nhận xét nếu có ý định để lại nhận xét. Và điều thật bất ngờ là sau khi nhận xét được xuất bản thì khung nội quy nhận xét bổng dưng biến mất mà không có sự tác động nào.

Xin bật mí một chút, ý tưởng tạo khung nội quy nhận xét này có định dạng CSS từ trang đăng nhập Blogger, mình chỉ linh hoạt áp dụng và tạo thêm hiệu ứng đóng tự động cho nó.

Để cài đặt khung nội quy nhận xét như vậy, bạn hãy thực hiện như sau:

Bước 1. Đăng nhập Blogger, vào Settings (Cài đặt) >> Comments (Nhận xét) kéo xuống mục Comment Form Message rồi dán vào đó đoạn văn bản nội quy nhận xét, sau đó nhấn SAVE SETTINGS để lưu cài đặt.

Bước 2. Vào Design (Thiết kế) >> Edit HTML (Chỉnh sửa HTLM), chọn Expand Widget Templates (Mở rộng mẫu tiện ích).

Tìm đến đoạn code:
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
Rồi đặt trước nó bằng đoạn code bên dưới.
<style>
#comrule {padding:5px 0;width:550px}
.comrule-container{padding:5px;background:#fff;border:1px solid darkgray}
.comrule-header{padding:5px 10px;background:#a2bf89;white-space:nowrap;color:#fff}
.comrule-body{width:580px;padding:5px 10px;background:#cddebe}
.comrule-body a{color:#036300}
.comrule-close{float:right;margin-right:-5px}
.comrule-text{text-align:justify;font-size:14px;line-height:19px;font-weight:normal;text-case:sentence;color:#069}
</style>
<script type='text/javascript'>
function closediv() {
document.getElementById(&quot;comrule&quot;).style.display=&quot;none&quot;;
}
setTimeout(closediv, 120000);
</script>

<div id='comrule'>
<div class='comrule-container'>
<table cellpadding='0' cellspacing='0'><tr><td class='comrule-header'><b>Nội quy!</b></td>
<td class='comrule-body'><a class='comrule-close' href='#' onclick='closediv()'><img alt='Đóng lại' src='http://www.blogger.com/img/close.png'/></a>
<span class='comrule-text'><data:blogCommentMessage/></span></td></tr></table>
</div>
</div>
Trong đoạn code trên bạn có thể thấy dòng <data:blogCommentMessage/> chính là phần nội quy nhận xét. Số 120000 tượng trưng cho 2 phút (1 phút = 60000 mili giây) đóng tự động khung nội quy nhận xét, bạn có thể đổi con số theo ý thích. Ngoài ra có thể tùy biến CSS cho phù hợp với tông màu trên blogspot của bạn.

Xong rồi bạn hãy lưu Template là được.
More about →
vào lúc 01:16 { Add nhận xét }
Nhãn:

Sử dụng thẻ meta mô tả theo chuẩn Google SEO 2010

Người đăng: Unknown on Thứ Tư, 27 tháng 7, 2011

Bất kỳ một website hay webblog nào cũng cần phần mô tả, đó là phần tóm tắt được xác định cho mỗi trang. Nó cực kỳ quan trong theo chuẩn Google SEO 2010.



Thẻ meta mô tả của trang cung cấp cho Google và các công cụ tìm kiếm khác bản tóm tắt nội dung trang (1). Trong khi tiêu đề trang có thể là một vài từ hoặc cụm từ, thẻ meta mô tả của trang có thể là một hoặc hai câu hoặc một đoạn ngắn. Công cụ Quản trị Trang web của Google cung cấp phần phân tích nội dung hữu ích sẽ cho bạn biết về bất kỳ thẻ meta mô tả nào hoặc quá ngắn, quá dài hoặc trùng lặp quá nhiều lần (thông tin tương tự cũng được hiển thị cho các thẻ <title>). Giống như thẻ <title>, thẻ meta mô tả được đặt trong thẻ <head> của tài liệu HTML của bạn.


(1) Phần đầu của thẻ meta mô tả cho trang web của chúng tôi, cung cấp tổng quan ngắn gọn về các dịch vụ của trang web

Tầm quan trọng của các thẻ meta mô tả như thế nào?

Các thẻ meta mô tả rất quan trọng vì Google có thể sử dụng chúng làm các đoạn trích cho trang của bạn. Hãy lưu ý rằng chúng tôi nói rằng "có thể" bởi vì Google có thể chọn sử dụng phần tương ứng của văn bản hiển thị trên trang của bạn nếu nó khớp với truy vấn của người dùng. Hoặc, Google có thể sử dụng mô tả của trang web của bạn trong Dự án Thư mục Mở (ODP) nếu trang web của bạn có trong danh sách đó (tìm hiểu cách ngăn các công cụ tìm kiếm hiển thị dữ liệu ODP). Thêm các thẻ meta mô tả vào mỗi trang web của bạn luôn luôn là biện pháp tốt trong trường hợp Google không thể tìm thấy
lựa chọn văn bản tốt để sử dụng trong đoạn trích. Blog Trung tâm Quản trị Trang web có bài đăng giàu thông tin về cải tiến các đoạn trích bằng các thẻ meta mô tả tốt hơn.

Các đoạn trích xuất hiện bên dưới tiêu đề của trang và phía trên URL của trang trong kết quả tìm kiếm.

Các từ trong đoạn trích được in đậm khi chúng xuất hiện trong truy vấn của người dùng (2). Điều này giúp người dùng biết liệu nội dung trên trang có khớp với những gì mà người đó đang tìm kiếm hay không. Dưới đây là ví dụ khác (3), đây là hiển thị đoạn trích từ thẻ meta mô tả ở trang sâu hơn (lý tưởng là trang này có thẻ meta mô tả duy nhất của riêng mình) chứa bài viết.


(2) Người dùng thực hiện truy vấn [baseball cards]. Trang chủ của chúng tôi xuất hiện dưới dạng kết quả, với một phần thẻ meta mô tả của nó được sử dụng làm đoạn trích



(3) Người dùng thực hiện truy vấn [rarest baseball cards]. Một trong số các trang sâu hơn của chúng tôi, với thẻ meta mô tả duy nhất của mình được sử dụng làm đoạn trích, xuất hiện dưới dạng kết quả

Biện pháp tốt cho các thẻ meta mô tả

1. Tóm tắt một cách chính xác nội dung của trang: Viết mô tả vừa cung cấp thông tin vừa thu hút người dùng nếu họ nhìn thấy thẻ meta mô tả của bạn dưới dạng đoạn trích trong kết quả tìm kiếm. Bạn cần tránh:
  • Viết thẻ meta mô tả không liên quan đến nội dung trên trang

  • Sử dụng các mô tả chung chung như "Đây là một trang web" hoặc "Trang về thẻ bóng chày"

  • Chỉ điền các từ khoá vào mô tả

  • Sao chép và dán toàn bộ nội dung của tài liệu vào thẻ meta mô tả

2. Sử dụng các mô tả duy nhất cho mỗi trang: Mỗi trang có một thẻ meta mô tả khác nhau giúp cả người dùng và Google, đặc biệt là trong các tìm kiếm mà người dùng có thể đưa lên nhiều trang trên tên miền của bạn (ví dụ: các tìm kiếm sử dụng cấu trúc Trang web: toán tử). Nếu trang web của bạn có hàng nghìn hoặc thậm chí hàng triệu trang, các thẻ meta mô tả được tạo thủ công có lẽ không thể khả thi. Trong trường hợp này, bạn có thể tạo tự động các thẻ meta mô tả dựa trên nội dung của mỗi trang. Bạn cần tránh:
  • Sử dụng thẻ meta mô tả cho tất cả các trang trên trang web của bạn hoặc cho số lượng trang lớn

Với kiến thức cơ bản về thẻ meta mô tả như vậy, Thủ thuật Blogger sẽ cùng bạn thực hành trên blogspot. Trong Template, Thủ thuật Blogger đặt code bên dưới vào sau dòng <b:include data='blog' name='all-head-content'/>.
<!-- Meta Tags SEO Full Pack by http://www.thuthuatblogger.info for Bloggers -->
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='Thủ thuật Blogger lưu trữ tài nguyên và mẹo thiết kế blog trên nền tảng blogspot.' name='description'/>
<meta content='Thủ thuật Blogger, Blogger tips, tricks, hacks, tutorials, Blogger, blogspot, Bloggerism, template, CSS, Javascript, HTML, jQuery, Mootools, Scriptaculous, SEO' name='keywords'/>
<meta content='index,follow' name='robots'/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' name='Description'/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<meta expr:content='data:blog.pageName' name='Description'/>
<b:else/>
<meta expr:content='data:blog.pageName' name='Description'/>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
</b:if>
</b:if>
Đoạn text được đánh dấu màu đỏ chính là phần mô tả. Bạn nên thay bằng một đoạn văn bản ngắn tóm tắt nội dung chủ đề trọng tâm của blogspot của bạn. Đoạn mô tả có thể là một hoặc hai câu văn, không nên là một chuỗi các từ khóa, không nên dài quá 140 ký tự.



Đoạn text được đánh dấu màu xanh là phần từ khóa. Bạn thay chuỗi các từ khóa liên quan đến chủ đề trên blogspot của bạn. Lưu ý Google không sử dụng thẻ meta từ khóa (keyword tag) để xếp hạng pagerank nên ở đây chỉ cần đặt thẻ meta từ khóa cho trang chủ là được. Gói code ở trên giúp tạo tính duy nhất cho thẻ meta mô tả ở các kiểu trang gồm trang chủ, trang item, trang tĩnh, trang nhãn và trang lưu trữ.

Riêng dòng <meta content='noindex, nofollow' name='robots'/> giúp khai báo cho Google biết bạn không muốn đánh chỉ mục các trang nhãn và trang lưu trữ để giúp tránh lặp nội dung góp phần cho trang web của bạn mau có sitelinks.

Vậy kết hợp thẻ tiêu đề và thẻ meta mô tả với nhau, chúng ta vận dụng vào blogspot như thế này:
<b:include data='blog' name='all-head-content'/>
<!-- Meta Tags SEO Full Pack by http://www.thuthuatblogger.info for Bloggers -->
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='Thủ thuật Blogger lưu trữ tài nguyên và mẹo thiết kế blog trên nền tảng blogspot.' name='description'/>
<meta content='Thủ thuật Blogger, Blogger tips, tricks, hacks, tutorials, Blogger, blogspot, Bloggerism, template, CSS, Javascript, HTML, jQuery, Mootools, Scriptaculous, SEO' name='keywords'/>
<meta content='index,follow' name='robots'/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' name='Description'/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<meta expr:content='data:blog.pageName' name='Description'/>
<b:else/>
<meta expr:content='data:blog.pageName' name='Description'/>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
</b:if>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>
<b:skin><![CDATA[/*
Đoạn code này cần được đặt sau thẻ <head> trong Template.
More about →
vào lúc 08:54 { Add nhận xét }
Nhãn:

Về việc khai trương trang tin Thuthuatblogger.info

Người đăng: Unknown

Căn cứ vào nhu cầu phát triển trong thời gian tới, sau một thời gian sử dụng tên miền tùy chỉnh miễn phí (Bloggerism.tk), quản trị blog Huynh-nhat-ha.blogspot.com đã quyết định sử dụng tên miền mới tại Thuthuatblogger.info để đảm bảo việc cung cấp thông suốt thông tin về thiết kế blog trên nền tảng Blogger/Blogspot.

Hiện nay, Ban Quản trị Thuthuatblogger.info đang hoàn thiện công tác cập nhật dữ liệu giai đoạn 1 và xuất bản trên các công cụ tìm kiếm. Theo kế hoạch, trang tin Thuthuatblogger.info sẽ chính thức khai trương vào lúc 08 giờ ngày 28/7/2011. Sau đó, Ban Quản trị sẽ tiếp tục cập nhật dữ liệu giai đoạn 2 để nội dung thông tin đầy đủ và hoàn thiện hơn.

Ban Quản trị Thuthuatblogger.info thông báo để quý bạn bè và bạn đọc gần xa biết, đến dự khai trương và thuận tiện trong việc khai thác thông tin tại Thuthuatblogger.info.

Do thời gian thiết kế, xây dựng và cập nhật cơ sở dữ liệu rất hạn chế (trong vòng 1 - 2 ngày) nên trang tin Thuthuatblogger.info sẽ không tránh khỏi thiếu sót. Rất mong nhận được ý kiến đóng góp để Thuthuatblogger.info tiếp tục hoàn thiện nội dung thông tin và các dịch vụ nhằm phục vụ độc giả ngày càng tốt hơn.

Mọi ý kiến đóng góp xin liên hệ với Ban Quản trị Thuthuatblogger.info theo số điện thoại: 0909841270, Email: webmaster@thuthuatblogger.info hoặc bloggerismwebmaster@gmail.com.

Xin trân trọng cảm ơn!

Thay mặt Ban Quản trị Thuthuatblogger.info
Huỳnh Nhật Hà
More about →
vào lúc 01:50 { Add nhận xét }
Nhãn:

HÌNH NỀN TIHIÊN NHIÊN CHO TOÀN BLOG

Người đăng: Unknown on Thứ Ba, 26 tháng 7, 2011

Dưới đây là một số mẫu hình nền áp dụng cho toàn blog có chủ đề "hình nền Thiên nhiên ", ứng với mỗi mẫu là code phía dưới, bạn chỉ cần đăng nhập vào blog > chọn thiết kế > thêm HTML/Javacript rồi dán code tương ứng phía dưới vào, bấm Lưu lại là xong. 
Bạn bấm chuột trái vào hình để xem chế độ toàn màn hình trước khi lựa chọn cho mình một mẫu vừa ý để áp dụng vào Blog.

Mẫu 1:



Mẫu 2:



Mẫu 3:



Mẫu 4:



Mẫu 5:



Mẫu 6:



Mẫu 7:



Mẫu 8:



Mẫu 9:



Mẫu 10:




More about →
vào lúc 16:37 { Add nhận xét }
Nhãn: ,