Trai miền Tây | Thông tin mới nhất cho cộng đồng Blogger Việt: Co ban

Đăng nhập Blogspot bằng tên miền khác

Thỉnh thoảng chúng ta không truy cập được blog ở Blogger (BlogSpot) cũng như cách dịch vụ mạng xã hội khác như Facebook do những biện pháp kỹ thuật của các nhà cung cấp dịch vụ internet.

Theo mặc định, địa chỉ blog của bạn có dạng http://yourblog.blogspot.com ngay khi tạo. Tình cờ một lần xem thống kê Thủ Thuật Blog phát hiện địa chỉ Blogger còn có một đuôi khác không phải .com như chúng ta thường thấy. Đó là đuôi .in, tên miền thuộc Ấn Độ, có lẽ dịch vụ này được sử dụng phổ biến ở Ấn Độ nên Google ưu ái mua luôn tên miền ở quốc gia này.

Trong trường hợp không xem được blog theo địa chỉ mặc định bạn chỉ cần thay đổi đuôi .com bằng .in. Ví dụ địa chỉ blog của bạn là http://yourblog.blogspot.com sẽ trở thành http://yourblog.blogspot.in. Tất cả những bài viết của bạn đều có địa chỉ dạng này.

Nguồn: Thủ Thuật Blog

13 mã nguồn Html/JavaScript cơ bản cho Blogger

Tạo Blog là một trong những trào lưu IT được giới trẻ “yêu chuộng” nhất hiện nay, tạo Blog không quá khó tuy nhiên để có được một Blog thật hay và Pro thì đòi hỏi bạn phải biết nhiều thứ trong đó tùy biến mã nguồn nhúng HTML/JavaScript là một đối tượng vô cùng quan trọng.

Trong loạt bài viết “Những thủ thuật hay cho các Blogger” ở phần 1 này tôi sẽ chia sẽ với các bạn những đoạn mã nguồn HTML/JavaScript chọn lọc; mà nếu làm chủ tốt “nó” Blog của bạn sẽ vô cùng hiện đại và chuyên nghiệp. Bài viết được minh họa trên dịch vụ Blogspot của Google, các dịch vụ Blog khác cũng được tiến hành tương tự.

1. Cách nhúng HTML trên BlogSpot:

Hiện nay hầu hết tất cả các dịch vụ tạo Blog như BlogSpot, MSN, YahooPlus, Violet… đều hỗ trợ người quản trị cho phép nhúng vào các đối tượng HTML/JavaScipt để thực hiện các tùy biến cao cấp trên Blog.

Đăng ký tài khoản và tiến hành các bước thiết kế cơ bản cho Blog tại địa chỉ http://www.blogger.com (bạn có thể đăng nhập bằng tài khoản Gmail sẵn có ở đây). Đăng nhập vào quyền quản trị tài khoản > Chọn Layout > Page Elements: trên bố cục của Blog nhấp nút Add a page elements (hay Add a Gadget) ở cột bên phải để bắt đầu lựa chọn đưa vào các đối tượng nhúng (lưu ý: mặc định bố cục của BlogSpot có 2 nút Add a Gadget cho phép thêm đối tượng vào cột bên trái và phần Footer bên dưới; thông thường đối tượng nhúng sẽ ưu tiên vào cột trái).

Trong cửa sổ Add a Gadget nhấp chọn nút HTML/JavaScript để nhúng vào mã nguồn, xem hình 1.

Hình 1

Trên hộp thoại Configure HTML/JavaScript kế tiếp: đặt tên cho đối tượng vào khung Title và mã nguồn vào khung Content, xem hình 2.

Hình 2

Nhấp Save để kết thúc thao tác nhúng đối tượng vào Blog (sau này nếu muốn bỏ đi đối tượng đã nhúng nhấp chọn nút Remove)

2. Nhúng một hộp văn bản cuộn vào Blog:

o Thường vị trí của đoạn văn bản cuộn này nên đặt ở vùng Header hay Footer trên giao diện Blog.

o Nhúng đoạn mã nguồn sau vào chức năng Configure HTML/JavaScript của Blog:

<marquee style="color: #FF00FF; font-weight: bold" bgcolor="#F2FBFF"; direction= “left”>++ Chào mừng các bạn ghé thăm Blog của tôi ++ Mong các bạn góp ý để Blog ngày càng phát triển ++</marquee>

o Trong đó: Color (màu chữ), Bgcolor (màu nền hộp văn bản), direction (chiều di chuyển), đối với giá trị các màu sắc nếu không nắm được mã nhị phân tương ứng bạn có thể điền tên màu bằng tiếng anh.

3. Nhúng ngày tháng năm bằng tiếng việt:

Đoạn mã HTML sau sẽ hiển thị nội dung ngày tháng năm bằng tiếng việt trên Blog.

<!-- // Array ofmonth Names

var monthNames = new Array("01","02","03","04","05","06","07","08","09","10","11","12");

var dayNames = new Array("Chủ nhật,","Thứ Hai,","Thứ Ba,","Thứ tư,","Thứ Năm,","Thứ Sáu,","Thứ Bảy,")

var now = new Date();

thisYear = now.getYear();

thisDay = dayNames[now.getDay()];

if(thisYear < 1900) {thisYear += 1900}; // corrections if Y2K display problem

document.write("Hôm nay : " + thisDay +" "+"ngày"+" "+ now.getDate() + " tháng " + monthNames[now.getMonth()] + " năm " + thisYear);

// -->

</script>

Dùng chức năng nhúng HTML/JavaScript để tùy biến ở vị trí Header hay bên phải giao diện Blog, xem hình 3.

Hình 3

4. Nhúng bảng dự báo thời tiết vào Blog:

o Đoạn mã HTML sau cho phép nhúng vào dự báo thời tiết của 5 thành phố lớn (Hà Nội, TP Hồ Chí Minh, Huế, Cà Mau, Nha Trang) trên cả nước theo 3 tiêu chuần quốc tế: nhiệt độ, thời gian và ẩm độ theo nguồn của trang web dự báo thời tiết nổi tiếng quốc tế http://banners.wunderground.com/, xem hình 4.

Hình 4

<p align="center"><img border="0" width="24" src="thoitiet.gif" height="20"/><font size="2"><b>Thời tiết một số địa phương ở nước ta </b></font></p>

<p align="center"> Nhiệt độ - Thời Gian - Độ ẩm </p>

<!--webbot bot="SaveResults" U-File="fpweb:///_private/form_results.txt"

S-Format="TEXT/CSV" S-Label-Fields="TRUE" -->

<p align="center"><font size="2"><b>Nha Trang</b></font></p>

</form>

Nếu muốn bỏ đi phần dự báo của Huế thì bạn tìm và xóa đoạn mã tương ứng:

o Lưu ý: tại trang chủ http://banners.wunderground.com/ mỗi một thành phố hay tỉnh của Việt nam có một mã số ảnh riêng, bạn có thể tham khảo ở đây để chèn vào cho phù hợp với đối tượng mà mình muốn hiển thị (Ví dụ: Huế có mã ảnh tỉnh là 48852.gif)

5. Chèn quảng cáo cố định ở hai bên giao diện Blog:

o Với đoạn mã này bạn có thể chèn vào các LOGO quảng cáo cho các đối tượng khác nhau ở hai bên cố định của giao diện Blog bằng cách sử dụng liên kết LINK.

Chú ý: Các link liên kết tới hình ảnh tương ứng phải có thực (tốt nhất bạn nên tự Upload cố định lên Host hay trực tiếp trên Blog), không nên liên kết tới LOGO của trang khác vì rất dễ xảy ra tình trạng chết LINK. Những đoạn Code màu xanh là liên kết tới các hình ảnh đại diện cho đối tượng mà bạn muốn nhúng vào Blog, với đoạn Code này bạn có thể tùy biến thêm vào hay xóa đi các đối tượng một cách thoải mái, xem hình 5.

Hình 5

o Ví dụ: Đối tượng báo giáo dục thời đại trong đoạn Code trên gồm các lệnh:

o Trong đoạn Code trên đối tượng VIOLYMPIC có Logo nhúng vào là một File Flash SWF, khi đó ta phải thay đổi mã lệnh nhúng lại cho phù hợp là:

6. Lịch âm dương trên Blog:

o Là người việt nam chắc chắn Blog của bạn sẽ chuyên nghiệp và mang cá tính hơn với một cuốn lịch âm dương hiển thị để khách viếng thăm tiện việc tra cứu, xem hình 6.

Hình 6

Mã nguồn nhúng vào Blog:

7. Tạo ComboBox trên Blog:

o Việc nhúng một ComboBox để liên kết nhanh tới các đối tượng khác nhau sẽ giúp bạn tiết kiệm được thời gian thiết kế và không gian hiển thị trên giao diện Blog, xem hình 7

Hình 7

Mã nguồn:

<OPTION selected value=#>Website Liên Kết</OPTION>

<OPTION value=#>--- TIN TỨC ONLINE ---</OPTION>

<OPTION value=http://www.vnexpress.net>Vn Express</OPTION>

<OPTION value=http://www.google.com.vn>Google</OPTION>

</SELECT>

Với đoạn Code này bạn cũng có thể Edit lại một cách thật dễ dàng.

8. Nhúng từ điển Anh - Việt vào Blog:

Với đoạn mã nguồn sau Blog của bạn sẽ được trang bị một quyển từ điển ANH - Việt hết sức chuyên nghiệp.

window.open("http://bea.vn/course/blocks/dictionary_mc/dic/search.php?dict="
 + obj.dict.value + "&word=" + obj.word.value, "quickview", 
"status=0,toolbar=0,scrollbars=1,width=500,height=400,location=0");

return false;
}
</script>

<form
 action="http://bea.vn/course/blocks/dictionary_mc/dic/search.php" 
style="margin:0px;" target="_blank" name="dictionary" onsubmit="return 
doSearch(this);" method="post">

<div style="padding-bottom:6px"> Dictionary: <br/>
<select style="font-size: 11px; width: 130px;" name="dict">
<option selected="true" value="ev"/>English - Vietnamese
<option value="ve"/>Vietnamese - English
</select></div>
<div> Enter word:<br/>
<input style="font-size: 11px; width: 87px;" name="word" type="text"/>
<input style="font-size: 11px;" value="Go" name="go" type="submit"/>
</div> </form>
<span style="font-size:90%; font-weight: bold;">© <a href="http://trandaiminhtri.blogspot.com/" target="_blank">Cftanhiep Groups 2009</a></span></p>

Từ điển Anh Việt hiển thị trên Blog, xem hình 8.

Hình 8

9. Tự tạo hộp tìm kiếm thông tin trên Blog:

o Mặc dù bạn có thể dễ dàng thêm vào Blog Gadget tìm kiếm của Google, tuy nhiên nếu tự tay thiết kế được một công cụ riêng về tìm kiếm thì điều đó sẽ thú vị hơn nhiều, xem hình 9.

Hình 9

Mã nguồn:

<p align="left">
<form id="searchthis" action="http://trandaiminhtri.blogspot.com/search" style="display:inline;" method="get">
<strong>Search this site<br/></strong>
<input id="b-query" maxlength="255" name="q" size="30" type="text"/>
<input id="b-searchbtn" value="Search" type="submit"/>
</form></p>

10. Nhúng bảng tỷ giá vàng vào Blog:

Mã nguồn:

<iframe src="http://www.vietstock.com.vn/Transweb/giavang.htm" width="180" height="150" scrolling="yes" frameborder="0" marginheight="0" marginwidth="0"></iframe>

Hiển thị xem hình 10.

Hình 10

11. Nhúng bảng tỷ giá ngoại tệ cho Blog:

Mã nguồn:

Hiển thị xem hình 11.

Hình 11

12. Nhúng lịch xem truyền hình Việt Nam vào Blog:

Mã nguồn:

o Hiển thị xem hình 12.

Hình 12

13. Nhúng cảnh đẹp Việt Nam vào Blog:

Hãy để cho khách viếng thăm cùng đi một tour du lịch Việt Nam cùng với Blog của bạn bằng mã nguồn sau.

1. Nhúng theo mặc định :

2. Có thể thay đổi kích thước :

3. Thêm các thông tin về tour du lịch :

4. Thay đổi khoảng thời gian giữa hai bức ảnh :

Hiển thị xem hình 13.

Hình 13

14. Tổng kết: Kết thúc phần 1 với 14 đoạn Code khác nhau dựa trên nền tảng nhúng HTML/JavaScript Blog của bạn đã trở nên đặc sắc và chuyên nghiệp hơn hẳn, hẹn gặp lại ở các các phần tiếp theo của loạt bài.

Một số cách tăng tốc Blogspot

Hiện nay xuất hiện khá nhiều blog chủ đề về tin tức hoặc giải trí sử dụng mã nguồn Blogger nhưng có vẻ như chưa được tối ưu hóa nên tốc độ tải trang có vẻ "không được nhanh", điều này không những gây khó chịu cho độc giả mà còn ảnh hưởng tới SEO. Vì vậy Noct muốn chia sẻ một số thủ thuật nhằm tăng tốc độ load trang web trên Blogspot với kinh nghiệm có được.

Trước khi thực hiện các tip này bạn nên save lại mẫu template của mình để có gì còn hồi phục lại được nếu chẳng may không thành công.

1/ Tối ưu CSS: nếu template của bạn có mã CSS quá dài thì nên làm điều này, còn không thì cứ để vậy cũng được. Bạn có thể vào địa chỉ này để nén code CSS lại, tốc độ sẽ được cải thiện.

2/ Tối ưu hình ảnh: các weblog về tin tức- giải trí chứa nhiều hình ảnh sẽ gây chậm blog, vì vậy hãy sử dụng định dạng JPG cho tất cả các image. Không nên copy link các hình ảnh trên website khác quá nhiều mà hãy tự upload chúng lên host riêng ví dụ như photobucket, mình thì thường up lên Picasa. Ngoài ra còn có một số software giúp nén hình ảnh mà vẫn giữ nguyên chất lượng ví dụ như Advanced JPEG Compressor.

Thử test chương trình này thì được kết quả như sau (cả hai ảnh đều ở định dạng JPG):

13Kb -> 400% -> 3Kb
Bạn có nhận ra được sự suy giảm chất lượng hình ảnh ? Tôi thì không. Software này đặc biệt hữu ích với các web có nhiều hình ảnh (truyện tranh).

3/ Tối ưu javascript: thông thường thì ta không nên chèn quá nhiều script vào template bởi gây chậm đáng kể, tuy nhiên nếu điều đó là bất khả kháng thì vẫn có một số cách để tăng tốc. Chúng ta có thể chèn thẳng code trong file .js vào trong template bằng cách dùng thẻ

<script  type='text/javascript'>//<![CDATA[
code
//]]></script>

Tuy nhiên cũng cần chú ý với cách này, tuy nó có tăng tốc độ load trang web nhưng lại ảnh hưởng đến SEO. Sở dĩ nói vậy là vì Google không mặn mà lắm với các trang web có phần code HTML quá dài dòng và người chịu thiệt hại sẽ là bạn. Nếu ta sử dụng các liên kết tới file .js thì sẽ giảm được khả năng này. Vì vậy mình khuyên chỉ nên chèn các đoạn script có dung lượng < 10KB, và bạn cũng có thể nén nó lại bằng cách truy cập địa chỉ này (lưu ý là không phải lúc nào cũng nén thành công). Nên chèn script vào cuối phần code của template nếu được, càng sát thẻ </body> càng tốt.

Một đoạn script không nhất thiết phải được load ở tất cả các trang trên blog. Ví dụ: trang web của bạn có một slider ở trang chủ sử dụng hiệu ứng jquery. Vậy jquery có còn cần thiết ở trang đọc bài (không có slider) không ? Tất nhiên là không, ta sẽ sử dụng câu lệnh sau để loại bỏ sự phiền hà này:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<script src='jquery.js' type='text/javascript'/>
</b:if>

Ở trên chỉ là ví dụ, hãy áp dụng cách này cho các script khác như related posts hoặc page-navigation chẳng hạn.

4/ Hạn chế sử dụng các tiện ích bên ngoài như Linkwithin, DISQUS, Facebook Fanpage... tuy rất tiện lợi nhưng chúng gây chậm rõ rệt, và SEO tệ hại.

5/ Hiện nay Blogger đã hỗ trợ tính năng readmore (đọc thêm), nhưng khả năng tùy biến của nó là chưa cao, và đa số chúng ta vẫn thường dùng Auto-readmore script bởi đẹp và tiện lợi. Tuy nhiên đây cũng chính là nguyên nhân gây chậm, bởi vì không như readmore của Blogspot, toàn bộ nội dung của bài đăng (tất cả hình ảnh) vẫn được load ở trang chủ, nó chỉ là bị ẩn đi thôi.

Thậm chí nếu số hình ảnh là quá lớn thì sẽ xảy ra tình trạng mất bài ở trang chủ. Mình khuyên là không nên dùng script auto, bạn có thể tham khảo thủ thuật auto-readmore không dùng javascript để khắc phục lỗi này.

Nâng cấp search box của Blogspot

Search box mặc định của blogspot vốn rất hạn chế, chỉ search phần tiêu đề là chính. Ta có thể thay thế bằng tiện ích Tìm kiếm tùy chỉnh (Google Custom Search) do Google cung cấp, thế nhưng tiện ích này cũng không thể tùy biến giao diện được. Vì vậy lần này sẽ hướng dẫn cách nâng cấp search box có được tính năng Custom Search của Google mà vẫn giữ nguyên thiết kế chuẩn của template.

Demo bạn có thể xem ở ngay chính blog này. Thủ thuật này mình thấy ở itechplus.info nhờ "view-source đại pháp" ^^.

Đầu tiên hãy đăng nhập vào Blogger rồi tạo một công cụ tìm kiếm tùy chỉnh ở đây. Điền đầy đủ thông tin, chọn url là địa chỉ website của bạn. Cuối cùng, ta sẽ nhận được một đoạn mã, trong đó có một dòng như thế này:
.CustomSearchControl('001194051199720490924:uaqar0jwvq4');
Đoạn mã màu đỏ sẽ khác đối với mỗi website, đây chính là cái chúng ta cần, hãy copy nó.

Tiếp theo, vào phần chỉnh sửa HTML của template, tìm đoạn code của search box, nó trông tương tự như thế này :

<div id='search'>
<form action='/search' id="searchform' method='get'>
<input name='q' size='30' type='text' value='' />
</form>
</div>

Đoạn code trên có thể khác đôi chút tùy template, thay thế đoạn màu xanh ở trên bằng đoạn mã sau:

<form action='/p/search.html' id='searchform'>
<input name='cx' type='hidden' value='001194051199720490924:uaqar0jwvq4'/>
<input name='cof' type='hidden' value='FORID:10'/>
<input name='ie' type='hidden' value='UTF-8'/>

Dòng màu đỏ chính là đoạn mã của Google Custom Search mà chúng ta đã ghi nhớ.

Bước cuối cùng, tạo một static page (trang tĩnh) mới, đặt tên nó là search. Link của nó sẽ có dạng ...blogspot.com/p/search.html

Trong Page này bạn không đăng nội dung gì cả, hãy chuyển qua phần HTML của Page và chèn tiếp đoạn code sau:

<div id="cse-search-results"></div>
<script type="text/javascript">
var googleSearchIframeName = "cse-search-results";
var googleSearchFormName = "cse-search-box";
var googleSearchFrameWidth = 600;
var googleSearchDomain = "www.google.com";
var googleSearchPath = "/cse";
</script>
<script src="http://www.google.com/afsonline/show_afs_search.js" type="text/javascript">
</script>

Click xuất bản trang. Đoạn mã trên chính là một iframe hiển thị nội dung của Custom Search. Vậy là gần như đã xong. Chúng ta dùng CSS để điều chỉnh kích thước của iframe này cho phù hợp với template, ở đây mình set width là 600px:
#cse-search-results iframe{width:580px}
Chúc bạn có một search box như ý.

10 lý do khiến tôi không đọc blog của bạn

Ngày nay, các blogger luôn tìm mọi cách để làm tăng thêm lượng người đọc vào blog của họ. Điều này thực sự đòi hỏi rất nhiều điều ở blogger, họ phải cố gắng hết sức và sử dụng mọi cách mà họ có thể làm được. Và cũng không thể loại trừ, tôi cũng vậy. Bạn thấy đó, tôi đã nhiều lần thay theme và tối ưu lại blog, công việc này rất mất thời gian nhưng bù lại nó cho tôi có thêm nhiều kinh nghiệm và biết cái nào thì tốt cho người đọc hơn.

Tôi là một blogger, tôi cần bạn đọc blog của tôi, nhưng tôi cũng cần đọc blog của người khác nữa. Tôi thường lấy tin RSS từ các blog mà tôi nghĩ là chúng có thể giúp đỡ tôi lấy ý tưởng để viết và học hỏi. Đây là một sự chọn lọc rất chặt chẽ vì không phải blog nào cũng tốt và phù hợp với tôi hay chủ đề blog tôi đang viết cả. Vậy những lý do nào khiến tôi không đọc những blog đó ? Câu trả lời ở ngay bài viết này.

Hãy xem bạn có trong những lý do sau đây không ? Nếu có thì hãy tìm cách khắc phục nó.

1. Không phải nội dung mà tôi thích hoặc nó không có chất lượng - khi đọc báo, tôi chỉ thích đọc những tin đáng chú ý hay tôi thích và đáng để tôi coi là xem được. Đối với blog cũng vậy, tôi chỉ xem những blog mà tôi cảm thấy thích và thú vị đối với tôi. Nếu nội dung blog của bạn tương tự như những tin “lá cải” trên các tờ báo thì tôi không thể cố nhồi nhét đầu óc của mình để xem những thứ đó. Đó là điều đơn giản. Nếu bạn muốn biết cái mà bạn đang viết có chán hay không thì hãy thử đọc chính nó. Và sau khi đọc hãy hỏi chính mình “Liệu tôi có phí thời gian khi đọc những bài viết như thế này không ?” Nếu câu trả lời là có thì hãy thay đổi cách viết của bạn hay viết về một điều gì khác.
2. Bạn không cập nhật thường xuyên – khi tôi quyết định lấy tin RSS một blog. Tôi thường theo dõi tần số viết bài của blogger đó trước. Nếu bạn viết bài hàng ngày nhưng sau đó một tuần bạn không viết nữa thì tôi nghĩ tôi sẽ khá thất vọng và không xem blog bạn nữa. Nhưng nếu bạn gửi một thông báo giải thích lý do tại sao lại như vậy thì có lẽ tôi sẽ thông cảm cho điều đó. Vì vậy, hãy chắc chắn là bạn sẽ đưa một bài thông báo để giải thích cho việc bạn không tiếp tục viết bài được nếu bạn muốn giữa tôi như người đọc blog của bạn.
3. Bạn ngừng viết về chủ đề tôi thích – có những blogger không kiên định với chủ đề mà mình theo đuổi, họ thay đổi chủ đề của họ rất nhiều lần và nếu bạn là một trong số những người đó thì đừng mong đợi bạn sẽ có được những người đọc “trung thành”. Giả dụ, tôi chọn blog bạn vì nó có nhiều thông tin và bài viết liên quan đến SEO nhưng sau một thời gian viết về nó bạn lại đổi chủ đề về các tin tức mới nổi bật thì bạn nghĩ xem tôi có nên tiếp tục đọc blog của bạn tiếp hay không khi tôi hoàn toàn không thích chủ đề mới này ?hãy kiên định với chủ đề của bạn ngay từ bước đầu tiên.
4. Bạn quấy nhiễu người đọc – tôi không nghĩ là có nhiều blogger làm điều này. Nhưng dĩ nhiên là tôi đã thấy một vài blog làm điều này, họ đã để lại một ấn tượng xấu. Nếu tôi thấy rằng một blogger nào đó mà tôi biết có những hành động này thì tôi sẽ lập tức ngừng đọc blog của người đó chu dù nội dung có hay và viết tốt đến chừng nào. Blogger bị Phương Thanh kiện gần đây cũng gần giống với điều này.
5. Bạn không trả lời những comment của người đọc – Nếu bạn chỉ để cho người đọc comment mà không trả lời họ, thì tôi nghĩ mình hoàn toàn đúng khi không xem blog bạn. Bạn chỉ biết viết mà không cho người đọc biết được những suy nghĩ của bạn qua những gì họ nói (hay ít nhất cũng nên thừa nhận những quan điểm của họ) thì tôi nghĩ rằng bạn đang che giấu một quyển nhật ký chứ không phải một blog công khai cho mọi người.
6. Phải đăng ký mới được comment – thực sự, bạn có một blog rất đẹp và những bài viết của bạn lại rất tuyệt, nhưng tôi nghĩ rằng tôi sẽ không trở lại blog đó nữa vì quá khắt khe. Tôi không thể nhận xét và trình bày quan điểm của mình trên một bài viết hay mà mình thích và thực sự rất bực mình hơn lại phải bỏ thời gian của mình ra để điền những thông số vào những ô vuông trống rỗng. Thật vô vị. Có lẽ tôi hơi khó tính nhưng biết đâu người đọc kế tiếp của bạn sẽ tốt hơn tôi.
7. Tôi đã thấy những bài viết này trước đây. Trên một vài blog nào đó – Điều này thực sự xảy ra rất nhiều. Nhiều blogger có thói quen hay chủ tâm sao chép những bài viết của người khác để hy vọng blog họ được chú ý nhiều hơn. Nếu tôi đã đọc một bài viết hay vào ngày hôm nay thì tôi thực sự không muốn hoang phí thời gian của mình để đọc một bài viết giống như vậy trên một blog khác vào ngày hôm sau. Hãy thử là chính bạn xem. Nếu như đề tài mà bạn chọn đã có quá nhiều người viết thì hãy đưa thêm vào những kinh nghiệm hay ý kiến của cá nhân bạn về nó.
8. Hãy chậm lại – Blog của bạn rất tuyệt, tôi thích những bài viết của bạn. Nhưng bạn đừng làm người đọc của mình bị bội thực bài viết đừng cập nhật blog quá nhanh như một chiếc xe phóng đi hết tốc độ mà không thể kiểm soát được. Tôi không phải là siêu nhân, tôi có một lượng thời gian hạn chế mỗi ngày. Tôi vẫn còn hàng “chục” bài viết phải đọc ở các blog khác, vì vậy đừng để tôi tốn quá nhiều thời gian vào blog bạn.
9. Quá nhiều quảng cáo, kiến tiền quá sớm – điều này điều mà đa số người đọc điều không thích. Bao gồm cả tôi và có thể là bạn. Bạn có chịu đựng được không khi vào một blog phải chịu đựng hàng trăm cửa sổ pop-up nhảy ra như đập vào mặt bạn và bạn phải cuộn mỏi cả tay khi bắt gặp những dòng quảng cáo đầy bực mình trên header chưa hết phần nội dung bài viết thì lại tràn đầy và lẫn lộn giữa image, banner, tex link ads,… Tôi không biết bạn cảm thấy thế nào nhưng riêng tôi thì đây là một điều thực sự rất phiền phức và hao tổn năng lượng. Mặt khác, khi bạn đặt quảng cáo bạn có nghĩ điều gì sẽ xảy ra khi site bạn vẫn còn trẻ và vẫn chưa có nhiều visit. Sẽ không một ai làm là John Chow 2 nếu như kiếm tiền theo cách của bạn.
10. Giả bình luận và hack alexa – điều này thực sự đã có nhiều người làm. Họ giả những bình luận để cho người khác làm tưởng rằng blog của họ được nhiều người chú ý hay tăng alexa lên để tạo danh tiếng cho mình. Nhưng bạn hãy nhớ rằng, không có điều gì trong gian lận là tốt cả, nó giống như một con dao hai lưỡi vậy, nếu người ta biết bạn gian lận thì blog bạn chẳng mấy chốc sẽ không còn người đến nữa và danh dự hay tên tuổi của bạn sẽ bị tổn hại rất nhiều. Hãy lưu ý điều này!

Bạn có giống như tôi không ? Bạn có ghét những điều này ? Hay bạn đang vấp phải những lỗi trên ? Hãy làm những gì mà bạn cho thấy đúng, cho dù nó không đúng đối với tôi
Theo Vietkicks

Blogspot: một số vấn đề thường gặp

Trong quá trình chỉnh sửa tùy biến Blogger hẳn không ít lần bạn mắc phải sai lầm khiến phát sinh lỗi ngoài ý muốn. Bạn không biết nên làm lại từ đâu và sửa chữa như thế nào ? Bài viết này có thể sẽ giúp được bạn, đây là tổng hợp một số vấn đề mà rất nhiều người dùng Blogger thường mắc phải, kèm theo cách giải quyết.

     Điều quan trọng nhất trước khi chỉnh sửa template là sao lưu một bản gốc để có thể phục hồi lại khi cần thiết. Nếu sau khi tùy biến mà bạn nhận ra template của mình bị mất một số thành phần (avatar, label, .v.v...) thì có thể hoàn nguyên mẫu tiện ích về mặc định để "lấy lại những gì đã mất".

1/ Bị mất bài ở trang chủ
   Đây là vấn đề mà rất nhiều người mắc phải, nguyên nhân là do tính năng auto-pagination của Blogger tự động cắt bớt số bài đăng để blog của bạn load nhanh hơn. Đặc biệt nếu ở trang chủ có các bài đăng chứa nhiều hình ảnh thì khả năng mất bài là khá cao.

    Cách giải quyết: dùng tính năng read more (đọc thêm) của Blogger để thu gọn nội dung các bài đăng ở trang chủ (đừng nhầm lẫn với auto-readmore, nó chắc chắn không giúp bạn giải quyết được vấn đề này). Nếu không thấy tính năng này thì bạn vào phần cài đặt của Blogger rồi chọn cập nhật trình chỉnh sửa bài đăng.

2/ Số bài đăng của mỗi nhãn hiển thị không chính xác
Cách giải quyết : tìm trong template dòng sau
<a expr:href='data:label.url' rel='tag'>
Sửa nó thành:
<a expr:href='data:label.url + "?&max-results=10"' rel='tag'>
10 là số bài đăng tối đa mà bạn muốn hiển thị trên từng nhãn.

3/ Mục bài đăng cũ hơn, bài đăng mới hơn không hiển thị
     Lỗi này do nhiều nguyên nhân, cách giải quyết thường là hoàn nguyên mẫu tiện ích về mặc định, nếu vẫn không được thì bạn kiểm tra trong template xem đã có dòng này hay chưa :
#blog-pager { clear : both; }
4/ Tiện ích phân trang không hoạt động
     Blog của bạn phải có một số lượng bài đăng nhất định thì tiện ích phân trang mới hoạt động. Ngoài ra nếu bạn cài đặt blog ở trạng thái chỉ có tác giả xem được thì cũng sẽ không thấy phân trang.

5/ Tiện ích Popular Posts không hiển thị ảnh thumbnail
     Mặc dù tất cả các bài đăng phổ biến của bạn đều chứa hình ảnh nhưng tiện ích Popular Posts của Blogger vẫn không hiển thị ảnh đại diện. Khi bạn đăng bài và dùng tính năng chèn hình ảnh của Blogger thì chúng được tự động upload lên Picasa, và tiện ích Popular Posts chỉ lấy các ảnh này làm ảnh đại diện thu nhỏ. Do vậy nếu bạn copy link ảnh từ các trang web khác (không phải từ Picasa) thì sẽ không thấy ảnh thumbnail. Đây cũng là cách mà Blogger khuyến khích người dùng tự viết bài và không nên đi sao chép của người khác.

6/ Ảnh trong bài đăng quá to và lấn sang sidebar
     Bạn có thể điều chỉnh kích thước tối đa của ảnh chứa trong bài đăng bằng đoạn CSS sau:
.post img { max-width: 600px; }
Đoạn code trên có nghĩa là nếu bài nào chứa ảnh mà có kích thước quá lớn thì sẽ tự động thu nhỏ (resize) bề rộng còn 600px. Các ảnh nhỏ hơn 600px vẫn giữ nguyên kích thước.

7/ Blog load quá chậm
     Có rất nhiều nguyên nhân gây chậm, thường là do bạn không dùng tính năng đọc thêm (read-more) của Blogger mà lại dùng auto-readmore script. Việc phải tải toàn bộ nội dung của tất cả bài đăng ở trang chủ khiến tốc độ blog giảm rất nhiều. Ngoài ra, việc lạm dụng quá nhiều tiện ích bên ngoài như Bài đăng mới, Bài đăng theo nhãn, bài đăng ngẫu nhiên (có ảnh đại diện)... cũng gây chậm đáng kể. Sử dụng các tiện ích do chính Blogger cung cấp là tốt nhất. Bạn có thể tham khảo bài viết này để cải thiện tốc độ cho blog của mình.

8/ Các tiện ích có dùng js không hoạt động
     Các link .js trong template của bạn đã die, bạn cần upload chúng lên một host khác (Dropbox, Google Code...). Hoặc bạn có thể chèn trực tiếp đoạn mã trong file js vào thẳng trong template. Cách này có ưu điểm là nhanh, không phụ thuộc vào host nhưng nhược điểm là dễ khiến bọ của Google nhầm lẫn giữa nội dung bài với đoạn mã mà bạn đã chèn, ảnh hưởng tới SEO.

9/ Chuyển toàn bộ Blog sang một tài khoản khác, làm thế nào ?
     Đăng nhập vào Blogger -> Cài đặt -> Quyền , ở mục Tác giả blog bạn nhập địa chỉ tài khoản mới (email). Cấp quyền quản trị (Admin) cho tài khoản đó, đăng nhập vào hộp thư tài khoản mới để xác nhận, cuối cùng bạn gỡ bỏ quyền quản trị của tài khoản cũ và remove nó đi. Khi bạn muốn xóa một blog nào đó mà không muốn phải đợi đến 90 ngày thì cũng có thể dùng cách này.

     Trên đây là các vấn đề thường gặp của Blogger, cách giải quyết có thể chưa phải là tối ưu. Nếu bạn có ý kiến khác thì có thể bổ sung ở dưới đây, chắc chắn nó sẽ có ích cho nhiều người.

Sửa lỗi avatar của Blogger

Dạo gần đây Blogger đã tiến hành nhiều cập nhật, đây là một điều đáng mừng để nền tảng này ngày càng hoàn thiện. Nhưng có một số update gây khá nhiều phiền phức, một trong số đó là lỗi avatar (lệch khung, không đúng kích thước... )

Căn nguyên của lỗi này là do một số đoạn CSS đã được thêm vào trong file bundle.css như thế này:

.avatar-image-container {

    float: left;

    max-height: 36px;

    overflow: hidden;

    width: 36px;

}

.avatar-image-container img {width: 36px;}

Theo như trên thì kích thước avatar tối đa mà Blogger qui định là 36x36, ta có thể thay đổi lại để phù hợp với template của mình. Ví dụ trong Newcast Template, để sửa lỗi avatar thì ta thêm đoạn CSS sau phía trên ]]></b:skin>:

.avatar-image-container {  

     width: 60px !important; 

     max-height: 60px !important; 

     float:none !important;

}

.avatar-image-container img { width: 60px !important; }

Như vậy kích thước avatar đã được đổi lại là 60x60. Hy vọng mẹo trên có ích cho những ai đang đau đầu vì vấn đề không đáng có này.

Hướng dẫn "thiết kế" mẫu Blogger

Chắc chắn các bạn đều hình dung ra được là để thiết kế một mẫu Blogger là tương đối phức tạp và đòi hỏi công sức và trí tuệ nhất định. Trong bài viết này, tôi xin giới thiệu với các bạn phương pháp "Thiết kế" đơn giản, nói đại khái chung là tuỳ biến những mẫu có sẵn thành một mẫu thiết kế của riêng mình.
Về cơ bản đây là một dạng "Cheat", mà đã là "Cheat" thì là không tốt rồi, nhưng mục đích bài viết này được tham khảo từ hướng dẫn của Blog Buster là để các bạn quen với các khái niệm, quen với các mã, tag... trong blogger. Bài viết thực ra là một bài dịch để tự bản thân tìm hiểu nhưng cũng xin được xuất bản lên blog cá nhân để ai có nhu cầu có thể tham khảo.

Như hình trên, bạn sẽ thấy rõ ràng Mẫu blog bên phía tay phải hoàn toàn khác so với bản gốc bên phía trái. Nếu bạn đã thành thạo thì chỉ trong khoảng thời gian khoảng 30 phút bạn có thể thay đổi được diện mạo bất kỳ Blog mẫu nào trở lên hoàn toàn khác biệt.
Để rõ hơn xin giới thiệu với các bạn ví dụ tuỳ biến mẫu mặc định Minima mẫu được cung cấp bởi Blogger. Với ví dụ này như đã nói ở trên, bạn có thể áp dụng phương thức sử dụng ở đây cho bất kỳ mẫu Blog khác.
Để làm như vậy, trong tổng thể mẫu Blog thông thường ta thay đổi cho 3 thành phần chính sau:

Tiêu đề: Tuỳ biến với một Hình ảnh mới
Background: Một mẫu nền mới.
Màu nền của bải viết (nội dung) chính của blog.

Trong hướng dẫn này tôi hướng dẫn các bạn thay đổi chủ yếu về 3 thành phần trên bằng cách so sánh sự thay đổi giữa mẫu ban đầu và mẫu sau khi thay đổi và được minh hoạ bằng các hình ảnh chụp màn hình. Các kỹ thuật can thiệp về kỹ thuật các bạn sẽ dần dần tìm hiểu về sau, ở đây chỉ có những kỹ thuật đơn giản và rất dễ dàng tìm hiểu cho những người mới bắt đầu như tôi chẳng hạn.
Trước khi bạn bắt đầu!
Công việc đầu tiên của bất kỳ các việc thử nghiệm, tuỳ biến, hay thêm một tiện ích nào là bạn phải sao lưu blog để phòng trường hợp gặp lỗi hoặc muốn phục hồi lại mẫu cũ.
Để thực hiện điều này. bạn vào Mẫu "Template" l Chỉnh sửa HTML "Edit HTML" và click vào Tải xuống Mẫu đầy đủ "Download Full Template". Lưu các tệp tin XML vào máy tính của bạn, và đảm bảo bạn có thể truy cập sau này.
1. Thực hiện tạo một tiêu đề mới cho blog của bạn
Cách đơn giản nhất để tuỳ chỉnh mẫu blog là thay đổi diện mạo tiêu đề blog của bạn bằng một hình ảnh. Trong phần hướng dẫn này, tôi sẽ cung cấp cho bạn cách thay đổi tiêu đề thành một hình ảnh của tiêu đề một cách nhanh chóng và dễ dàng.
Tìm chiều rộng của các tiêu đề
Công việc đầu tiên để tạo ra một hình ảnh của tiêu đề, chúng ta cần phải biết chiều rộng của tiêu đề trong mẫu hiện có trước khi tuỳ biến, việc biết được chiều rộng của tiêu đề để giúp bạn tìm hoặc thiết kế được một hình ảnh tiêu đề không bị hụt do ngắn hoặc tràn khỏi mẫu do quá dài trong thiết kế.
Để tìm chiều rộng của tiêu đề bạn vào Bố cục "Layout" l Chỉnh sửa HTML "Edit HTML" trong Bảng điều khiển "Blogger dashboard", và tìm kiếm dòng lệnh sau:

#header-wrapper {

Ngay dưới dòng lệnh này , bạn có thể thấy các thông số CSS về độ toàn bộ các định dạng của tiêu đề. Mặc định mẫu Minima như sau:

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

Từ thông tin này, bạn biết được yêu cầu cần phải làm cho hình ảnh tiêu đê rộng 660 pixel. Với các mẫu khác nhau thì độ rộng của tiêu đề cũng khác nhau, không giống nhau. Việc của bạn là phải kiểm tra chính xác độ rộng của tiêu đề để đảm bảo khi thiết kế hình ảnh tiêu đề có chiều rộng bằng với của mẫu cần tuỳ chỉnh.
Chiều cao của tiêu đề không quan trọng, bạn có thể giữ nguyên chiều cao, hoặc có thể thay đổi tuỳ ý không ảnh hưởng gì. Tuy nhiên theo tôi, bạn nên để chiều cao của hình ảnh tiiêu đề là 300px để có thể chứa được nội dung tiêu đề (Môt tả).
Thực hiện Mẫu hình ảnh của tiêu đề
Việc thực hiện tạo một mẫu hình ảnh của tiêu đề tuỳ thuộc vào "Gu" thiết kế và sáng tạo của bạn để tạo ra được một hình ảnh tiêu đề độc đáo hấp dẫn. Bạn có thể sáng tạo hình ảnh tiêu đề bằng các phần mềm chuyên về đồ hoạ như CorelDraw hoặc Photoshop. Hoặc bạn cũng có thể sử dụng các hình ảnh tiêu đề được cung cấp miễn phí đáp ứng được yêu cầu của bạn.
Trong ví dụ miêu tả về cách tuỳ chỉnh mẫu Minima, hình ảnh tiêu đề được I downloaded hình ảnh "free vector header BitBox a và được chỉnh kích cỡ chiều rộng thành 660px sử dụng GiMP (một chương trình miễn phí có chức năng tương tự Photoshop).

Bằng cách sử dụng GIMP, tôi được thêm vào một số thử nghiệm của tôi về hình ảnh tiêu đề, và đây là kết quả đã hoàn thành với 1 file hình ảnh dạng GIF:

Thêm tiêu đề hình ảnh của bạn vào blog của bạn
Vào Bố cục "Template" l Phần tử trang "Page Elements" trong Bảng điều khiển Blog và click vào Tiêu đề "Header" ở phía gần trên cùng của trang:

Khi đó xuất hiện màn hình popup, bạn sẽ thấy tùy chọn cho tiêu đề của riêng bạn bằng cách sử dụng hình ảnh. Chọn nút radio để tải lên một hình ảnh từ máy tính của bạn bằng cách sử dụng nút "Browse". Sau đó check vào nút chọn Thay cho tiêu đề và mô tả "Use instead of title and description". Cuối cùng lưu lại các cài đặt của bạn.

Sử dụng phương thức trên, hình ảnh của bạn sẽ được lưu trữ bởi Blogger, và nó sẽ xuất hiện thay cho Tiêu đề và miêu tả, như hình dưới:

Chú ý: Trong Minima Template có thể do CSS nên có thể hình ảnh tiêu đề khi xuất hiện có lệch so với tổng thể Blog. Vấn đề này sẽ được giả quyết một cách đơn giản bằng cách thay đổi margin của #header như sau:

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

Thay thế bằng:

#header {
margin: 0;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

Bây giờ bạn đã có một tiêu đề hình ảnh thay thế cho tiêu đề văn bản mặc định.
2. Sử dụng hình ảnh nền (Background)
Để phù hợp với hình ảnh tiêu đề trên, tôi lựa chọn một hình nền dạng hoa văn bằng cách sử dụng hình nền miễn phí tileable tạiSquidFingers , ngoài ra bạn có thể tìm kiếm Google để lựa chọn một hình nền ưng ý để thử.
Chọn hình ảnh nền

Bước đầu tiên là bạn lựa chọn một hình nền ưng ý và phù hợp để bắt đầu thực hiện tạo nền cho blog của bạn.. Bạn có thể lựa chọn pattern từ Squidfingers, đây là nguồn cung cấp miễn phí và đa dạng cho bạn lựa chọn, bạn có thể tìm ở bất kỳ đâu đó trên mạng bất kỳ hình ảnh bạn thích. Bạn cần phải lưu chúng vào ổ cứng máy tính của bạn để sử dụng chúng lúc cần thiếtdueYou will need to save the background image to your computer as we will be using this very soon. Bạn sẽ cần phải lưu các hình ảnh nền cho máy tính của bạn như chúng tôi sẽ sử dụng này rất sớm.
Upload hình ảnh của bạn với web
Để sử dụng hình ảnh nền background cho blog của bạn, bạn sẽ cần phải tải lên này lên một host trực tuyến nào đó. Thông dụng nhất là upload lên Photobucket.
Hoặc bạn có thể Click chuột phải vào hình ảnh ở một bài viết nào đó mà có hình nền bạn ưng ý và xem properties. Từ đây bạn có thể biết được vị trí (địa chỉ) lưu trữ URL của hình ảnh. Sao chép URL này để tạm của bạn hay Notepad để bạn có thể sử dụng này để tham khảo nền hình ảnh của bạn trong mẫu của mã HTML.
Thêm các hình nền và code của mẫu blog
Bây giờ chúng tôi sẽ cần phải sửa đổi một phần nhỏ mã HTML mẫu blog của bạn của để thêm hình ảnh vào nền background.
Bạn vào Bố cục "Layout" l Chỉnh sửa HTML "Edit HTML" trong Bảng điều khiển "Blogger dashboard", và tìm dòng mã:

body {
background:$bgcolor;

Chúng ta cần thêm URL của hình nền background image vào dòng định nghĩa "background" bằng cách sử dụng định dạng sau:

url(the_url_of_your_image)

Trong hướng dẫn này có dạng như sau:

body { background:$bgcolor url(http://1.bp.blogspot.com/_xn2gmPb9TfM/R4TGdeDdP4I/AAAAAAAAArY/RP5IQy-eABA/s1600-h/pattern_140.gif);

Hãy chắc chắn sẽ làm theo cùng một định dạng, và đảm bảo rằng dấu (;) xuất hiện ở cuối của các định nghĩa.
Bây giờ qua blog của bạn để xem các thay đổi. Nó có thể trông như thế này:

Nếu bạn hài lòng với các nền, bạn có thể lưu mẫu của bạn và chuyển sang bước tiếp theo, để chúng tôi đi trên để bước tiếp theo. Tuy nhiên, nếu bạn không muốn sử dụng này, bạn có thể chỉ cần bấm vào "clear edits" và thực hiện với một nền mẫu khác.
Giờ đây bạn đã thay đổi background cho blog, tuy nhiên bạn sẽ dễ dàng nhận thấy các đoạn văn bản của blog rất khó nhìn, do vậy bạn cần phải thực hiện một bước nữa là thay đổi hình nền của phần nội dung chính của blog.
Thêm một màu nền cho các phần chính của blog
Một trong những cách tốt nhất để thu hút sự chú ý đến nội dung của blog của bạn là làm cho chúng nổi bật bằng màu sắc khác biệt. Vì vậy, ngoài hình ảnh nền đã thêm vào blog, chúng ta cần phải đặt các nội dung chính của blog vào một màu bổ sung làm cho nó dễ dàng hơn để đọc.
Để thêm màu cho nội dung blog của bạn, đơn giản tìm dòng này trong code HTML mẫu blog của bạn :

#outer-wrapper {

Thêm ngay dưới dòng này dòng mã sau:

background: #ffffff;

Dòng mã này để định nghĩa cho màu của phần nội dung chính blog là màu (bao gồm cả phần bài đăng và các sidebar. Bạn cũng có thể thay đổi màu trắng (#ffffff) như định nghĩa trên thành các màu khác mà bạn ưng ý theo giá trị hex cho màu trắng (# ffffff), bạn có thể sử dụng lựa chọn màu bằng công cụ "the web color calculator in the Tools section of this site".
Trong ví dụ trên tôi sử dụngnền màu xanh (# E3F2FB) để bổ sung cho các hình ảnh nền. Đây là cách toàn bộ mã :

#outer-wrapper {
background: #E3F2FB;
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

To make the foreground stand out even more from the background image, I also added a border to the left and right hand sides of the outer wrapper, which can be achieved by adding the line in red to the outer-wrapper style statement: Để làm cho các foreground được nhìn thấy riêng biệt ra thậm chí nhiều hơn từ các hình ảnh, tôi thêm vào phía bên trái và bên tay phải khoảng cách các border như sau:

#outer-wrapper {
background: #E3F2FB;
border-left: 2px solid #cccccc;
border-right: 2px solid #cccccc;
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

Và đây là kết quả sau khi đã hoàn thành:

Sau khi những tuỳ chỉnh chính đang hoàn tất, bạn có thể thay đổi một số màu sắc và phông chữ để phù hợp với thiết kế mới của bạn.

Translate