Laman

Pages

Laman

Dec 27, 2011

Mình không muốn viết blog nữa

Có người nói rằng, “Nếu bạn không viết blog để kiếm sống thì thôi hãy dừng lại. Còn không thì hãy viết blog ít lại”.

Điều đó hoàn toàn đúng.

Nếu viết blog trở thành một gánh nặng thì cũng nên nghĩ đến việc từ bỏ cho xong.

Tuy nhiên một số người sẽ tiếp tục viết blog như thế đấy là bổn phận.

Ai cũng biết các blogger bắt đầu viết blog vì nhiều lý do khác nhau và một khi các nhận xét bắt đầu xuất hiện trên blog thì việc viết blog trở nên thú vị hơn. Chúng ta có thêm những người bạn mới, đọc các blog khác và gặp gỡ giao lưu với người khác trong quá trình phát triển các mối liên hệ thực sự.

Tùy thuộc vào quy mô cộng đồng tạo ra mà chúng ta có thể tự mình tìm thấy vị thế của mình ở nơi ấy.

Tôi muốn từ bỏ viết blog, nhưng tôi có những độc giả đang phụ thuộc vào tôi. Hoặc …

Vâng. Câu đó hoàn toàn đúng.

Khi bạn viết blog, những người đến đọc thường có những kỳ vọng nhất định đối với bạn.

Tuy nhiên, mình không nghĩ bạn cảm thấy phải có bổn phận viết blog (trừ khi đó là công việc bạn được trả tiền) mà cũng không nên cảm thấy bạn là người bỏ cuộc nếu bạn dừng lại.

Những gì chúng ta chia sẻ đều có thể giúp người khác và những mối liên hệ chúng ta tạo ra trên mạng là những mối liên hệ chân thực. Nếu trái tim chúng ta không còn ở trong đó thì niềm vui viết blog cũng mất đi, khi đó có thể đến lúc phải đánh giá lại vị thế là blogger của chúng ta.

Cũng giống như đời người, nghiệp viết blog cũng có một tuổi thọ và đối với một số trường hợp nó có thể rất ngắn ngủi.

Vậy thì theo bạn, mình có nên từ bỏ nghiệp viết blog hay không?

Bạn đã từng nghĩ đến việc từ bỏ viết blog?

Điều gì đã thay đổi ý định của bạn?

Bạn có còn quan tâm chia sẻ với người khác?

Dec 20, 2011

Ra mắt 2 blogger template tuyệt đẹp

Như đã xem trailer thì hôm nay Yolks sẽ share cho các bạn 2 template cực đẹp này , các bạn có thể thêm mắm thêm muối vào 2 temp trên bạn nhé.
Thông tin:
2 cột 
Ngày tháng năm hiển thị đẹp mắt
Readmore thông minh của Noct
Tiện ích thông báo







Template kế tiếp cũng là template của WP , do mono-lab thiết kế rất độc đáo
Thông tin:
2 cột
Ngày thắng năm hiển thị đẹp mắt
Cột thông tin bài viết gọn gàng
Hiện tại sẽ update v2 cho template này để cập nhật tab comment + tab chia sẻ ( đợi fandung) sẽ update.


Còn chần chờ chi nữa , link download đây: password ( vngreenzone.com )

Dec 18, 2011

[Trailer] 2 templates sắp tới

 2 template sắp tới sẽ rất quen thuộc với bạn , tuy các temp này được người khác rip trước Yolks , nhưng Yolks  nhận thấy họ không quan tâm gì đến cái temp rip gì cả , nên tìm đến trang chính của nhà thiết kế và rip lại , tuy tay nghề còn kém , nhưng vẫn đợi fandung áp dụng cho 2 cái template , nên việc share nhanh hay share chậm là tùy anh Dũng giúp Yolks . Mong các bạn đừng chọi gạch.



Dec 16, 2011

Kì ngủ đông của vngreenzone.com


Xin chào các bạn , đã lâu rồi vngreenzone nói riêng thế giới blogspot nói chung ta gắn kết , gắn bó cùng chúng ta . Nó như sự kết tinh của thế giới IT hòa quyện vào nhau . GZone đã hứa hẹn rằng mình sẽ cố gắng giúp các bạn hoàn thiện blog của chính bạn bằng những thứ gì hay mà mình biết . Nhưng mùa đông năm nay giá lạnh , Gzone như là 1 con gấu , vì thế phải tìm cách ngủ đông. Hết thời kì sẽ quay lại các bạn nhé.

Dec 10, 2011

Petkute Blogger

Định rip làm trang Auto Game thấy kute lại làm site truyện, post đc 2 bộ truyện chán lại bỏ =))
Mình ko biết sắp xếp cái main sao cho hợp lý . Ai thích cái main hiện kiểu khác thì cho cái ảnh demo mình sẽ làm lại.

Mình làm random background có 3 cái ảnh thôi nha
Mình cũng không có file PSD đâu nên đừng PM vô ích. và điều quan trọng hơn là mình ko biết PTS :))

Cơ bản chỉ có thế có vài cái ảnh ở petkute.banbe.net các bạn up lại ko là lúc nó thay link là đi :)


Notice: viết nhầm RSS comment ở menu là feeds/comments/default chứ ko phải là /feeds/comment/default sửa lại dùm mình :)

Dec 9, 2011

Tạo ảnh loading đẹp với css và js

Cái thủ thuật này xưa lắm rồi các bạn ạ , nhưng làm thì chúng ta phải có ảnh loading , mà trong khi đó thì các ảnh không được đa dạng và nhìn nó chạy cảm thấy rất nặng , nhưng với cssload.net Chúng ta không phải ngại về vấn đề trên nữa.



Dec 4, 2011

Đồ họa thật kinh ngạc với cs3

Woa , thật ngoạn mục khi yolks lên youtube giải trí , thì thật kinh ngạc nhóm FlashDesk này làm film rất hay. Không ngờ Cs3 không những nổi tiếng về mặc thiết kế web , nó còn làm hình ảnh , làm flash được nữa . Chúng ta hãy quan sát 2 video của nhóm này làm nhé . Và đúc kết được kinh nghiệm gì ?? Các bạn hãy comment phía dưới , phần thưởng là Style comment phân cấp cho các bạn.



Dec 3, 2011

Không cho sao chép nội dung bài viết cho blogger

Có thể mọi thành quả , công lao chúng ta khi chúng ta suy nghĩ hoặc tạo ra nó , các bạn muốn sự làm việc siêng năng của mình được bù đắp. Nhưng , đã có một số kẻ gọi là ăn cắp chất xám người khác vd : "copy cat" , con mèo con chỉ biết bắt chước mèo mẹ mà thôi.
Để chống lại tình trạng copy vô tội vạ của một số blogger . Chúng ta hãy thử cách này xem .






Nov 25, 2011

Các bước và cách bảo vệ blog khỏi google

Google là ông chùm của ngành internet . Ừm thì ông là vua tôi là giặc , tôi vi phạm thì ông xử chém . Qua việc vnblogspot.com bị google đá mất tài khoản là không chấp nhận được và hãy tìm cách làm sai cho ông vua nhà ta bớt giận.










Nov 21, 2011

Manga-Anime [template]

Lại 1 templates được ra mắt vào hôm nay . Trước khi làm tôi chỉ muốn nói 1 lời với cái bạn : " Template này làm từ 2010" Không sao cái thời mà Yolks chỉ mới bước chân vào blogger . Ngày 7/1/2010 là ngày Yolks tạo cái template này.

Nov 20, 2011

Thêm favicon cho tiện ích LinkList

Đối với Blogspot, khi bạn muốn thêm một tiện ích liệt kê các trang web hoặc blog mà bạn ưa thích thì bạn thường dùng đến tiện ích LinkList. Tính năng của tiện ích này rất đơn điệu, bạn chỉ có thể tùy biến CSS cho các liên kết. Qua bài viết này, mình sẽ giúp bạn sáng tạo thêm một chút, thêm favicon cho các liên kết của tiện ích LinkList.

Kể từ khi Blogger tích hợp tính năng Favicon thì một liên kết favicon của blogspot có dạng như sau:

http://tenblogcuaban.blogspot.com/favicon.ico

Theo quy tắc phổ biến, liên kết favicon của một website (được xây dựng trên các nền tảng Wordpress, Joomla, …) có dạng như sau: http://www.tenwebsite.com/favicon.ico.

Bây giờ hãy xem xét cấu trúc XML của một tiện ích LinkList. Trước tiên Đăng nhập Blogger, vào Design >> Page Elements. Thêm một tiện ích LinkList rồi lần lượt thêm địa chỉ (URL) và tên trang tương ứng cho các liên kết ưa thích mà bạn muốn tạo. Sau đó vào Edit HTML chọn Expand Widget Templates. Dùng từ khóa LinkList để tìm đến đoạn code của tiện ích này như sau:

  1. <b:widget id='LinkList1' locked='false' title='My Favourite Resources' type='LinkList'>
  2. <b:includable id='main'>
  3. <b:if cond='data:title'><h2><data:title/></h2></b:if>
  4.  <div class='widget-content'>
  5.    <ul>
  6.      <b:loop values='data:links' var='link'>
  7.        <li><a expr:href='data:link.target'><data:link.name/></a></li>
  8.      </b:loop>
  9.    </ul>
  10.   </div>
  11. </b:includable>
  12. </b:widget>

Trong đoạn code trên, cần chú ý đến dòng

<li><a expr:href='data:link.target'><data:link.name/></a></li>

Nó biểu thị các liên kết. Trong đó data:link.target chính là đích đến của các liên kết. Như vậy để tự động thêm favicon vào trước các liên kết thì chúng ta thay thế dòng code nói trên bằng đoạn code như sau:

  1. <li>
  2.   <a expr:href='data:link.target'>
  3.     <img expr:src='data:link.target + &quot;favicon.ico&quot;' />
  4.     <data:link.name/>
  5.   </a>
  6. </li>

Cuối cùng, bạn có thể tùy biến CSS cho tiện ích, thêm đoạn code bên dưới vào trước dòng ]]></b:skin>.

#LinkList1 li {
background-color: #C89A2B;
border-top: 2px solid #C89A2B;
border-bottom: 2px solid #C89A2B;
cursor: pointer;
margin: 2px 0;
padding:0;
float:left;
width:50%;
list-style:none;
clear:none
}
#LinkList1 li a {
color: #069 !important;
font-weight: normal !important;
padding-left:5px
}
#LinkList1 li img {
display: inline-block;
height: 16px;
width: 16px;
margin-right: 5px;
vertical-align:middle;
border:none
}
#LinkList1 li:hover {
background-color: #C25A3B;
border-color: #606971
}

Lưu Template là hoàn thành.

Nov 8, 2011

Tùy biến label thành tag cloud giống WP

Bạn có thấy tag cloud của WP đẹp không ? , vậy giờ chúng ta sẽ làm giống y hệt nhé , chúng ta sẽ làm cho WP phải lác mắt với sức mạnh blogger.

Xây dựng một vngreenzone hoàn hảo , tại sao không ?

Nút +1 đã đi sau vào tìm thức mỗi con người blogger chúng ta. Từ khi thành lập blog vngreenzone nó đã như là của bạn. Bạn hãy xem vngreenzone như một nơi thư giãn cũng được , là một quán bar , là một ngôi nhà , một gốc cây đễ chúng ta nghĩ lưng.

Vngreenzone không đòi hỏi các bạn phải donate gì cả , dù thủ thuật có cao siêu thì cũng không phải trả phí. Nhưng ngược lai, chúng ta hãy +1 cho ngôi nhà chúng ta , và ngôi nhà sẽ được sơn phết lại theo từng năm tháng bỏ lỡ

Nov 6, 2011

Tiện ích tài liệu tham khảo cho bài đang đọc

Trong mỗi bài viết, đôi khi chúng ta thường đặt các liên kết đến tài liệu tham khảo cho bài viết để người đọc dễ dàng tìm đọc để hiểu thêm về bài viết. Các liên kết này thường được đặt ở cuối mỗi bài viết. Ở đây mình sẽ hướng dẫn bạn cách tạo tiện ích tài liệu tham khảo cho bài đang đọc được đặt trên Sidebar để tạo nét độc đáo cho blogspot của bạn.

DEMO.

Để thực hiện thủ thuật này, bạn hãy làm theo các bước như sau:

Bước 1. Trước tiên khi đăng bài, ở cuối bài viết bạn hãy đặt các liên kết tài liệu tham khảo theo cấu trúc HTML như thế này:

  1. <a class="linkonsidebar" href="URL_tai_lieu_tham_khao_1">Ten tai lieu tham khao 1</a>
  2. <a class="linkonsidebar" href="URL_tai_lieu_tham_khao_2">Ten tai lieu tham khao 2</a>
  3. <a class="linkonsidebar" href="URL_tai_lieu_tham_khao_3">Ten tai lieu tham khao 3</a>

Bước 2. Vào Design >> Edit HTML. Chọn Expand Widget Templates.

Kế đến chúng ta cần ẩn các liên kết tài liệu tham khảo ở cuối bài viết (vì mục đích chính là hiển thị các liên kết này trên Sidebar) bằng cách đặt dòng code sau đây vào trước dòng ]]></b:skin>.

  1. .linkonsidebar {display:none}

Sau đó, viết một kịch bản giúp các liên kết ẩn trong bài viết được hiển thị trên Sidebar. Vì mỗi bài viết có một ID riêng nên các liên kết này cũng được gán theo ID của bài viết. Đặt đoạn code bên dưới vào trước thẻ </head>.

  1. <script type="text/javascript">
  2. //<![CDATA[
  3. // Script to Display Reference Links on Sidebar  by www.thuthuatblogger.info
  4. // giúp các liên kết ẩn trong bài viết được hiển thị
  5. var linkonsidebarHREF=new Array();
  6. var linkonsidebarTXT=new Array();
  7. // chức năng hiển thị link theo ID của bài viết
  8. function displayLinks(idPOST) {
  9.   var thePOST = document.getElementById("post-" + idPOST);
  10.   // tìm tất cả các link
  11.   var thelist = thePOST.getElementsByTagName("a");
  12.   if(thelist.length>0){
  13.     // nếu có thì tìm tất cả các link có lớp linkonsidebar
  14.     var offset;
  15.     for(var i=0; i<thelist.length; ++i) {
  16.       if(thelist[i].className=="linkonsidebar") {
  17.         // nếu tìm ra thì thêm vào danh sách hiển thị
  18.         offset = linkonsidebarHREF.length;
  19.         linkonsidebarHREF[offset] = thelist[i].href;
  20.         linkonsidebarTXT[offset] = thelist[i].innerHTML;
  21.       }
  22.     }
  23.   }
  24. }
  25. //]]>
  26. </script>

Bước 3. Tiếp theo, chúng ta cần phải gắn ID cho bài viết. Tìm đến đoạn code như sau:

  1. <b:includable id='post' var='post'>
  2.   <div class='post hentry'>

Thẻ <div class='post hentry'> (hoặc <div class='post'>) tạo lớp CSS chung cho toàn bộ bài viết, vậy để chuyên biệt hóa cho từng bài viết thì chúng ta cần gắn ID vào như sau:

  1. <div class='post' expr:id='&quot;post-&quot; + data:post.id'>

Sau đó tìm đến đoạn code tương tự như bên dưới và thêm vào phần được đánh dấu màu đỏ.

<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
<script type='text/javascript'>displayLinks(&#39;<data:post.id/>&#39;);</script>

Lưu Template.

Bước 4. Vào Page Elements. Thêm một tiện ích HTML/Javascript và đặt vào nội dung tiện ích bằng đoạn code bên dưới. Có thể đặt tên cho tiện ích là Tham khảo cho bài đang đọc.

<style>
#reflinks { /* thêm thuộc tính CSS cho nội dung thẻ div */ }
#reflinks a {
/* thuộc tính cho link */
display: block;
list-style-type:decimal
}
#reflinks a:hover { /* hiệu ứng hover cho link */ }
</style>
<div id="reflinks">
<script type="text/javascript">
var strout = "";
// nếu có link hiển thị
if(linkonsidebarHREF.length>0){
// thì đọc danh sách
for(var i=0; i<linkonsidebarHREF.length; ++i) {
// và đặt cùng nhau trong mã HTML
strout += "<a href='" + linkonsidebarHREF[i] + "' target='_blank'>" + linkonsidebarTXT[i] + "</a>";
}
document.write(strout);
}
// nếu không có link hiển thị thì hiện thông báo chưa có tài liệu tham khảo
else {document.write('<b>Chưa có tài liệu nào</b>');
}
</script>
</div>
<div class='clear'></div>

Bước 5. Vào Edit HTML. Thao tác cuối cùng là chỉ hiển thị tiện ích HTML/Javascript vừa thêm ở các trang bài viết (item). Chọn Expand Widget Templates. Tìm đến ID của tiện ích HTML/Javascript nói trên (ví dụ ở đây có ID là HTML100) và thêm vào lệnh điều kiện (ở dòng 3 và dòng 11) như sau:

  1. <b:widget id='HTML100' locked='false' title='Tham khảo cho bài đang đọc' type='HTML'>
  2. <b:includable id='main'>
  3. <b:if cond='data:blog.pageType == &quot;item&quot;'>
  4.   <!-- only display title if it's non-empty -->
  5.   <b:if cond='data:title != &quot;&quot;'>
  6.     <h2 class='title'><data:title/></h2>
  7.   </b:if>
  8.   <div class='widget-content'>
  9.     <data:content/>
  10.   </div>
  11. </b:if>
  12. </b:includable>
  13. </b:widget>

Lưu Template.
Gắn ID cho các thành phần bài viết

Nov 3, 2011

Hiển thị danh ngôn ngẫu nhiên bằng PHP trên blogspot

Cũng như ngôn ngữ Javascript, mình đến với PHP chỉ bằng con đường tự mày mò nghiên cứu trong những thời gian rảnh rỗi và chưa từng trải nghiệm qua bất kỳ khóa học nào. Quả thật, PHP không dễ cảm thụ, nhưng mình nghĩ các bạn có thể học được nếu có lòng kiên trì và đam mê. Hy vọng qua những ví dụ từ dễ đến khó được ứng dụng trên nền tảng Blogspot, các bạn sẽ từng bước hiểu được tường tận về ngôn ngữ PHP.

Qua bài này, mình sẽ giúp bạn hiển thị những câu danh ngôn một cách ngẫu nhiên theo như DEMO bên dưới (nhấn F5 để thấy tác dụng).



Điều trước tiên là bạn cần có một hosting (có thể dùng free hosting như byethost.com để thử nghiệm). Mở công cụ Notepad trên máy tính của bạn rồi dán vào đó bằng đoạn code bên dưới rồi lưu file với tên là randomquotes.php.

  1. <?
  2. //////////////////////////////////////////////////////
  3. // PHP Random Quote Script for Blogspot applied by www.thuthuatblogger.info
  4. // Many thanks to http://davidmarotz.com/ for its original PHP code
  5. //////////////////////////////////////////////////////
  6. Header("content-type: application/x-javascript");
  7. $bgcolor = '#FFFFCC';
  8. $textcolor = 'black';
  9. $textcolor2 = 'brown';
  10. $textsize = '4';
  11. $textsize2 = '3';
  12. // Array Structure:  "Quote","Author"
  13. $allqts = array
  14.     ("The Black Knight Always Triumphs!",
  15.         "Monty Python",
  16.     "I swear by my life and love of it that I will never live for the sake of<br>another man, nor ask another man to live for mine" ,
  17.         "Atlas Shrugged",
  18.     "It is clear that the individual who persecutes a man, his brother,<br> because he is not of the same opinion, is a monster",
  19.         "Voltaire",
  20.     "I agree that there is a natural aristocracy among men<br>The grounds of this are virtue and talents.",
  21.         "Thomas Jefferson",
  22.     "Liberty, when it begins to take root, is a plant of rapid growth.",
  23.         "George Washington",
  24.     "Never argue with an idiot. <br>They drag you down to their level <br>then beat you with experience",
  25.         "Dilbert",
  26.     "The Answer is 42. What is the question?",
  27.         "Hitchikers Guide to the Galaxy",
  28.     "Anyone who has never made a mistake has never tried anything new",
  29.         "Albert Einstein",
  30.     "Progress doesn't come from early risers, progress is made<br>by lazy men looking for easier ways to do things.",
  31.         "Lazarus Long <font size=-2>(Time Enough for Love by Robert A. Heinlein)</font>",
  32.     "Throughout history, poverty is the normal condition of man. <br>Advances which permit this norm to be exceeded - here and there, now and then - <br>are the work of an extremely small minority, frequently despised,<br> often condemned, and almost always opposed by all right-thinking people. <br>Whenever this tiny minority is kept from creating, or (as sometimes happens)<br> is driven out of a society, the people then slip back into abject poverty.<br><br>This is known as 'bad luck.'",
  33.         "Robert Heinlein",
  34.     "A little learning is a dangerous thing; Drink deep, or taste not the<br>Pierian spring.  There shallow draughts intoxicate the brain, <br>and drinking largely sobers us again",
  35.         "Alexander Pope",
  36.     "The early bird gets the worm, but the second mouse gets the cheese",
  37.         "Anonymous",
  38.     "Subjugating the enemy's army without fighting is the true pinnacle of excellence",
  39.         "Sun-tzu, The Art of War",
  40.     "Work as though you were to live 100 years; pray as if you were to die tomorrow",
  41.         "Benjamin Franklin",
  42.     "The world is a stage, but the play is badly cast",
  43.         "Oscar Wilde",
  44.     "Truth is generally the best vindication against slander.",
  45.         "Abraham Lincoln",
  46.     "...mercy to the guilty is cruelty to the innocent...",
  47.         "Adam Smith",
  48.     "...I wish that I may never think the smiles of the great and powerful<br> a sufficient inducement to turn aside from the straight path<br> of honesty and the convictions of my own mind",
  49.         "David Ricardo",
  50.     "Democracy is the worst form of government except for all the others",
  51.         "Winston Churchill",
  52.     "You can only know the highest peaks if you have experianced the lowest valley's",
  53.             "Richard Nixon",
  54.     "They dress the wound of my people as though it were not serious. <br>'Peace, peace,' they say, when there is no peace.",
  55.         "Jeremiah 6:14",
  56.     "It is better to remain silent and be thought a fool<br> than to open your mouth and remove all doubt.",
  57.         "Jonathan Swift",
  58.     "The market system delivers the goods people want,<br>but those who make it work cannot readily explain why it is so.<br>The socialst or communist system does not deliver the goods, <br>but those who operate it can readily explain away its failure.",
  59.         "F.A. Hayek, Law, Legislation and Liberty, Vol. II",
  60.     "Never Stop Exploring<sup>tm</sup>",
  61.         "The North Face"
  62.         );
  63. // Gets the Total number of Items in the array
  64. //  Divides by 2 because there is a Quote followed by an Author
  65. $totalqts = (count($allqts)/2);
  66. // Subtracted 1 from the total because '0' is not accounted for otherwise
  67. $nmbr = (rand(0,($totalqts-1)));
  68. $nmbr = $nmbr*2;
  69. //$nmbr = 18;
  70. $quote = $allqts[$nmbr];
  71.          $nmbr = $nmbr+1;
  72. $author = $allqts[$nmbr];
  73. $space = "<font color=$bgcolor>.....................................</font>";
  74. echo "document.write(\"<center><font color=$textcolor size='$textsize'><i>$quote</i></font><br>$space<font color=$textcolor2 size='$textsize2'>$author</font></center>\")";
  75. ?>

Trong đoạn code trên, bạn có thể thay thế những câu danh ngôn tiếng Anh bằng những câu danh ngôn tiếng Việt tương ứng, thêm hoặc bớt tùy ý theo đúng định dạng. Chú ý dùng <br> để xuống dòng cho câu văn.

Upload file randomquotes.php lên hosting của bạn để sử dụng.

Để hiển thị danh ngôn thì bạn đặt trong bài viết Blogspot hoặc tiện ích HTML/Javascript bằng dòng code như sau:

  1. <script type="text/javascript" src="http://www.tenmienhostingcuaban.com/randomquotes.php"></script>
Chạy PHP bằng Javascript ngoại
Danh ngôn ngẫu nhiên bằng Javascript

Cuộc thi dự đoán thứ hạng đội tuyển U23 Việt Nam tại SEA Games 26

Đội tuyển bóng đá U23 Việt Nam sẽ có trận cầu đầu tiên quan trọng chiều nay với đội U23 Philippines. Với lòng nhiệt thành của một fan hâm mộ thật sự đối với bóng đá Việt Nam, thay mặt Ban Quản trị Thủ thuật Blogger, xin chúc các chàng trai trẻ của đội tuyển U23 Việt Nam sẽ có một trận đấu cống hiến, chiến thắng chính mình và chiến thắng đối thủ, để lại nhiều cảm xúc sâu sắc cho khán giả và người xem truyền hình. Xin chúc đội tuyển U23 Việt Nam sẽ thi đấu ấn tượng suốt đại hội thể thao SEA Games 26, vượt qua mọi đối thủ để đi đến trận đấu cuối cùng và đứng trên bục vinh quang cao nhất để thỏa lòng người hâm mộ Việt Nam.


Đồng hành cùng đội tuyển bóng đá U23 Việt Nam tham dự SEA Game 26, Thủ thuật Blogger tổ chức cuộc thi dự đoán thứ hạng của đội tuyển U23 Việt Nam tại giải đấu này.

* Thể lệ cuộc thi như sau:

1. Chủ đề: Dự đoán thứ hạng của đội tuyển bóng đá nam U23 Việt Nam tại SEA Games 26. Các thứ hạng gồm: vô địch, á quân, hạng ba, hạng tư, không có thứ hạng.

2. Thời gian tham gia dự đoán: 04/11 – 15/11/2011.

3. Giải thưởng:

- 1 giải nhất: Một Blogger Template trị giá 10 USD;

- 1 giải nhì: 01 suất tùy biến Template theo yêu cầu trị giá 5 USD.

Người trúng giải nhất là người dự đoán đúng thứ hạng của đội tuyển và dự đoán gần đúng nhất về số người có cùng câu trả lời. Nếu kết thúc chương trình, có từ 2 bạn đọc trở lên cùng dự đoán đúng thì Ban Tổ chức sẽ trao giải cho bạn đọc có thời gian dự đoán đúng sớm nhất. Người trúng giải nhì là người dự đoán đúng thứ hạng của đổi tuyển và dự đoán gần đúng nhất về số người có cùng câu trả lời sau người trúng giải nhất.

Để tham gia cuộc thi, bạn đọc soạn tin nhắn theo cú pháp:

U23VN [Thứ hạng] [Số người cùng dự đoán như bạn] gửi 0909841270

Chúc các bạn may mắn!

* Kết quả dự đoán công bố ngày 22/11/2011:

Có 3 người dự đoán như sau:
- Số điện thoại 01278882345 dự đoán U23 Việt Nam vô địch, số người cùng dự đoán là 500
- Số điện thoại 0972990892 dự đoán U23 Việt Nam xếp hạng 3, số người cùng dự đoán là 92
- Số điện thoại 0977504688 dự đoán U23 Việt Nam xếp hạng 3, số người cùng dự đoán là 2.

Rất tiếc không có bạn nào trúng giải. Chân thành cảm ơn các bạn. Hẹn các bạn ở lần sau.

Nov 2, 2011

Social media icons tuyệt đẹp cho blogger

Yolks sẽ mở thêm 1 thư mục là trang trí . Ở mục này sẽ có nhiều bài viết về các icons , các thủ thuật về thiết kế cho đẹp mắt , các bạn chú ý đón xem. và đây là bài đầu tiên.

Khung tìm kiếm biết nói cho blogspot

Bạn đã thấy khung tìm kiếm biết nói chưa ? Đa số là chưa đâu vì Yolks đã mới nghiên cứu trình duyệt  Google Chrome nên giờ thấy thích thú quá.

Demo sẽ là blog Yolks (Chỉ xem bằng Google Chrome)

Nov 1, 2011

Trình diễn đa năng với koolbox

Trong lúc đi dạo các blog chuyên về design thì Yolks thấy, một số designer dùng plugin của jQuery koolbox. Cho một số trang web của họ để làm đẹp ảnh trình bày bai viết.

Tuy nhỏ gọn , nhưng bảo đảm với các bạn koolbox có thể sẽ đánh ngã được prettyphoto trong thời gian sắp tới vì đây chỉ mới phiên bản v1.

Oct 31, 2011

Script phân trang cho bảng

Trước đây hẳn bạn nghe nhiều đến script phân trang cho toàn bộ blog và phân trang cho nội dung trong bài viết, chứ ít khi nghe kiểu phân trang cho bảng. Đôi khi bạn cần phải dùng đến bảng (table) để bố trí nội dung theo nhiều cột và nhiều dòng giống như trong văn bản Microsoft Word. Trong trường hợp nội dung quá nhiều thì bảng sẽ trở nên rất dài, khi đó với script phân trang sẽ giúp bảng trở nên gọn gàng hơn.

DEMO

Để phân trang cho bảng như vậy, bạn hãy thực hiện như sau:

Bước 1. Đăng nhập Blogger, vào Design >> Edit HTML. Đặt đoạn code sau đây vào trước thẻ </head>.

  1. <script type="text/javascript">
  2. //<![CDATA[
  3. function Pager(tableName, itemsPerPage) {
  4.     this.tableName = tableName;
  5.     this.itemsPerPage = itemsPerPage;
  6.     this.currentPage = 1;
  7.     this.pages = 0;
  8.     this.inited = false;
  9.    
  10.     this.showRecords = function(from, to) {      
  11.         var rows = document.getElementById(tableName).rows;
  12.         // i starts from 1 to skip table header row
  13.         for (var i = 1; i < rows.length; i++) {
  14.             if (i < from || i > to)
  15.                 rows[i].style.display = 'none';
  16.             else
  17.                 rows[i].style.display = '';
  18.         }
  19.     }
  20.    
  21.     this.showPage = function(pageNumber) {
  22.           if (! this.inited) {
  23.                    alert("not inited");
  24.                    return;
  25.           }
  26.  
  27.         var oldPageAnchor = document.getElementById('pg'+this.currentPage);
  28.         oldPageAnchor.className = 'pg-normal';
  29.        
  30.         this.currentPage = pageNumber;
  31.         var newPageAnchor = document.getElementById('pg'+this.currentPage);
  32.         newPageAnchor.className = 'pg-selected';
  33.        
  34.         var from = (pageNumber - 1) * itemsPerPage + 1;
  35.         var to = from + itemsPerPage - 1;
  36.         this.showRecords(from, to);
  37.     }  
  38.    
  39.     this.prev = function() {
  40.         if (this.currentPage > 1)
  41.             this.showPage(this.currentPage - 1);
  42.     }
  43.    
  44.     this.next = function() {
  45.         if (this.currentPage < this.pages) {
  46.             this.showPage(this.currentPage + 1);
  47.         }
  48.     }                      
  49.    
  50.     this.init = function() {
  51.         var rows = document.getElementById(tableName).rows;
  52.         var records = (rows.length - 1);
  53.         this.pages = Math.ceil(records / itemsPerPage);
  54.         this.inited = true;
  55.     }
  56.  
  57.     this.showPageNav = function(pagerName, positionId) {
  58.           if (! this.inited) {
  59.                    alert("not inited");
  60.                    return;
  61.           }
  62.           var element = document.getElementById(positionId);
  63.          
  64.           var pagerHtml = '<span onclick="' + pagerName + '.prev();" class="pg-normal"> &#171 Prev </span> | ';
  65.         for (var page = 1; page <= this.pages; page++)
  66.             pagerHtml += '<span id="pg' + page + '" class="pg-normal" onclick="' + pagerName + '.showPage(' + page + ');">' + page + '</span> | ';
  67.         pagerHtml += '<span onclick="'+pagerName+'.next();" class="pg-normal"> Next &#187;</span>';          
  68.        
  69.         element.innerHTML = pagerHtml;
  70.     }
  71. }
  72. //]]>
  73. </script>

Bước 2. Đặt đoạn CSS sau đây vào trước dòng ]]></b:skin> để định dạng các thuộc tính cho phần phân trang:

  1. .pg-normal {
  2.        color: red;
  3.        font-weight: normal;
  4.        text-decoration: none;  
  5.        cursor: pointer;  
  6. }
  7. .pg-selected {
  8.        color: black;
  9.        font-weight: bold;      
  10.        text-decoration: underline;
  11.        cursor: pointer;
  12. }

Lưu Template.

Bước 3. Khi tạo nội dung trong một bài viết nào đó, hãy sử dụng cấu trúc HTML cho bảng dưới dạng như sau (ở đây demo bảng có 3 cột và 9 dòng để phân trang thành 3 trang, bạn có thể vận dụng linh hoạt):

  1. <table id="results">
  2.      <tr>
  3.           <th>Heading 1</th>
  4.           <th>Heading 2</th>
  5.           <th>Heading 3</th>
  6.      </tr>
  7.      <tr>
  8.           <td>Column 1 – Row 1</td>
  9.           <td>Column 2 – Row 1</td>
  10.           <td>Column 3 – Row 1</td>
  11.      </tr>
  12.      <tr>
  13.           <td>Column 1 – Row 2</td>
  14.           <td>Column 2 – Row 2</td>
  15.           <td>Column 3 – Row 2</td>
  16.      </tr>
  17.      <tr>
  18.           <td>Column 1 – Row 3</td>
  19.           <td>Column 2 – Row 3</td>
  20.           <td>Column 3 – Row 3</td>
  21.      </tr>
  22.      <tr>
  23.           <td>Column 1 – Row 4</td>
  24.           <td>Column 2 – Row 4</td>
  25.           <td>Column 3 – Row 4</td>
  26.      </tr>
  27.      <tr>
  28.           <td>Column 1 – Row 5</td>
  29.           <td>Column 2 – Row 5</td>
  30.           <td>Column 3 – Row 5</td>
  31.      </tr>
  32.      <tr>
  33.           <td>Column 1 – Row 6</td>
  34.           <td>Column 2 – Row 6</td>
  35.           <td>Column 3 – Row 6</td>
  36.      </tr>
  37.      <tr>
  38.           <td>Column 1 – Row 7</td>
  39.           <td>Column 2 – Row 7</td>
  40.           <td>Column 3 – Row 7</td>
  41.      </tr>
  42.      <tr>
  43.           <td>Column 1 – Row 8</td>
  44.           <td>Column 2 – Row 8</td>
  45.           <td>Column 3 – Row 8</td>
  46.      </tr>
  47.      <tr>
  48.           <td>Column 1 – Row 9</td>
  49.           <td>Column 2 – Row 9</td>
  50.           <td>Column 3 – Row 9</td>
  51.      </tr>
  52. <div id="pageNavPosition"></div>
  53. <script type="text/javascript"><!--
  54.        var pager = new Pager('results', 3);
  55.        pager.init();
  56.        pager.showPageNav('pager', 'pageNavPosition');
  57.        pager.showPage(1);
  58. //--></script>

Ở đoạn script trên thì số 3 biểu thị số dòng mỗi trang, bạn có thể điều chỉnh tùy theo trường hợp áp dụng của bạn.

Oct 29, 2011

Sổ lưu niệm

Lời đầu tiên xin chân thành cảm ơn sự ủng hộ nhiệt tình của quý bạn đọc gần xa đối với trang web Thủ thuật Blogger trong thời gian qua.

Ban Quản trị Thủ thuật Blogger đã, đang và sẽ không ngừng nỗ lực phấn đấu để trang web ngày càng phong phú hơn, chất lượng hơn để đáp ứng yêu cầu ngày càng cao của các bạn. Quả thật, trong chặng đường đã qua không thể nào tránh khỏi những thiếu sót, những điều chưa hoàn thiện. Nếu các bạn cảm thấy những điểm chưa hài lòng, chưa có sự đổi mới, hẳn đó là vì sức lực của Ban Quản trị cũng có hạn, không thể làm thỏa mãn đến từng chân tơ kẻ tóc đối với tất cả mọi mong muốn của bạn đọc. Rất mong quý bạn đọc cảm thông.

Sổ lưu niệm là nơi để các bạn viết vài dòng nhắn gửi, những lời tri ân hoặc những góp ý đối với Ban Quản trị giúp Thủ thuật Blogger có thêm cơ sở để ngày càng nâng cao chất lượng thông tin. Sổ lưu niệm cũng có thể là nơi khách vãng lai lưu lại những dòng chân tình nhắn nhủ với người thân quen, tri kỷ, người yêu dấu, bạn bè … để nhỡ biết đâu đó người ấy có thể đọc được tâm tình của bạn …

Quy định chung của Sổ lưu niệm: sử dụng tiếng Việt có dấu; ngôn ngữ nghiêm túc, lành mạnh.

Thân mến!