Một số trang web tìm kiếm Icon

Với xu thế hiện nay cho việc thiết kế web các nhà thiết kế ai cũng muốn có cho mình những icon đẹp mắt và đặc biệt miễn phí thì càng tốt! Một icon phù hợp cũng rất quan trọng nó giúp trang trí web, điều hướng... Hôm nay Viettin24h giới thiệu đến các bạn một số trang web giúp các bạn tìm được những Icon phù hợp cho website của mình.

1. Icon Finder

Iconfinder.com cung cấp các icon chất lượng cao cho những người thiết kế và phát triển web. Chúng ta có thể dễ dàng tìm kiếm những icon một cách dễ dàng bằng cách gõ từ khóa trong ô tìm kiếm. Trang web này được ra mắt vào năm 2007, là một trong những công cụ tìm kiếm đầu tiên tập trung vào các icon. Bạn có thể tìm kiếm hơn 150.000 icon hoặc duyệt qua hơn 800 bộ sưu tập.

2. Find Icons

FindIcons.com là một bộ tìm kiếm icon mạnh, bạn có thể tìm kiếm rất nhiều icon miễn phí ở trang này. Với cơ sở dữ liệu icon lớn kèm bộ lọc thông minh FindIcons.com sẽ giúp bạn tìm được bộ icon mà bạn cần cho quá trình thiết kế của mình.

3. iconlet

Iconlet là một công cụ tìm kiếm icon chất lượng và miễn phí. Nó có một vài tính năng hay như cung cấp thông tin về tác giả, định dạng phân giải, hình ảnh đồ họa và giấy phép của Icon. Chỉ cần gõ từ khóa tìm kiếm rồi Enter ta có thể tìm được một danh sách các icon mà bạn có thể sử dụng trong dự án của mình.

4. Icon Shock

IconShock.com có một bộ sưu tập tuyệt vời các icon với phong cách thiết kế khác nhau như: XP, Vista, Mac… với nhiều kiểu độc đáo đi kèm bản gốc. Có nhiều kích thước cho sẵn cho mỗi icon, định dạng và màu sắc các quốc gia.

Ngoài ra bạn cũng có thể tìm thấy ở IconShock.com nhiều bộ sưu tập độc đáo như bộ sưu tập thẻ ngân hàng, vector…

5. Silk Icon Finder

SilkIconFinder.com cung cấp hàng loạt biểu tượng (icon) cho các ứng dụng phần mềm. Trang web này rất hữu ích cho các nhà phát triển giao diện người dùng (UI – User Interface). Đặc biệt là các bạn đang làm những ứng dụng Windows Form…

6. iconSweets

IconSweets.com là một bộ sưu tập icon miễn phí chứa 60 hình vector với định dạng photoshop, chịu ảnh hưởng của Glyphish và Pictoico. Chúng ta có thể sử dụng gói icon này cho dự án thương mại hoặc phi thương mại. Bạn có thể tùy chỉnh lại bằng photoshop bất cứ khi nào.

7. Icon Archive

IiconArchive.com là một nguồn tuyệt vời để tìm kiếm icon cho Windows, Mac, Linux… Trang này cũng có những icon của những trang tương tự khác. Có hơn 40 danh mục về các chủ đề icon, ta có thể dễ dàng tìm kiếm icon thích hợp cho mình.

8. Icons Pedia

IconsPedia.com là  trang có nhiều icon miễn phí và chất lượng cho các dự án web của bạn.

9. Soft Icons

SoftIcons.com là một trang khá tốt để tìm những icon miễn phí. Có cả định dạng png và link download trực tiếp với hơn 300.000 icon/image.

10. Free Icons Web

Với FreeIconsWeb.com bạn có thể tìm kiếm hơn 28.000 icon chất lượng và miễn phí cho Windows, Macintosh và Linux. (Desktop Icons, Windows Icons, Windows XP and Vista Icons, Mac OS X Icons, Linux, PNG Transparent Icons, Gif Icons, Pixels Icons).

11. Icon Pot

IconPot.com cung cấp một danh sách cái icon miễn phí cho phát triển web.

12. Free Icon Download

FreeIconDownload.com cung cấp cho chúng ta một tài nguyên icon miễn phí, phong phú, chất lượng cao sử dụng cho Windows, Mac và Linux. Cung cấp nhiều định dạng khác nhau của icon như:  Ico, Gif, Bmp, Png . Những icon được cung cấp trên trang này nhằm mục đích phi thương mại, nó chỉ đề cập đến tác giả đã thiết kế ra icon đó. Nếu bạn là một người thiết kế icon và muốn giới thiệu và chia sẽ icon của mình với mọi người thì đây là nơi tốt nhất.

13. Vista Icons

VistaIcons.com với bộ sưu tập hơn 2500 icon chất lượng cao mang phong cách Vista. Trang này cho phép tải về 2 định dạng là ico và png. Bạn có thể download miễn phí các icon có độ phân giải 256×256 cho Windows Vista.

14.  Website Icons

WebsiteIcons.com có giao diện chỉ tập trung vào các biểu tượng nên khá thân thiện với người dùng. Trang này còn cung cấp chế độ sưu tập và tải về icon cho một người dùng có tài khoảng ở đây.

15. icofree

Với IcoFree.com bạn sẽ tìm thấy những icon miễn phí từ các nghệ sĩ thiết kế. Bản quyền của icon thuộc về tác giả thiết kế ra nó. Các icon ở trang này được cung cấp cho người dùng cá nhân và phi thương mại…

More about →

Thêm hộp Google plus vào Blogspot

Hôm nay mình giới thiệu đến các bạn thủ thuật tạo hộp box Google+++

Ảnh minh họa:

* Cách thực hiện:
1. Đăng nhập vào tài khoản Blogger

2. Chọn bố cục

3. Thêm tiện ích HTML/Javascript và dán code bên dưới vào:

<style> .post-body{padding:8px 0 10px} </style>
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 500;
summary_img = 390;
img_thumb_height = 120;
img_thumb_width = 180;
</script>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'></script>


<script type="text/javascript">
(function() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = '//pagead2.googlesyndication.com/pagead/js/google_top_exp.js';
var head = document.getElementsByTagName('head')[0];
if (head) {
head.appendChild(script);
}})();
</script>
<style type="text/css">
#gpplikebox{
background-color:#F90101;
display:block;
padding:0;
z-index:99999;
position:fixed;
}
.gpplbadge{
background-color:#F90101;
display: block;
height:150px;
top:50%;
margin-top:-75px;
position:absolute;
left:-47px;
width:47px;
background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCwJ_HHQAhAa3BRpjchyphenhyphenygV4vo1kK0XjH9IrMliM166Ftzf3e5MX2GXsYnBSHr2s7vkjj_LmAKUI-A6WAEow4fbwLwHys_8TAE_9A5efpT8FcPSnKkQCMibcoSkoYoIys162LZuyhv1XPY/s1600/gplus-right.png");
background-repeat:
no-repeat;
overflow:hidden;
-webkit-border-top-left-radius:8px;
-webkit-border-bottom-left-radius:8px;
-moz-border-radius-topleft:8px;
-moz-border-radius-bottomleft:8px;
border-top-left-radius:8px;
border-bottom-left-radius:8px;
}
</style>
<script type="text/javascript">
(function(md){
md(document).ready(function(){
var $dur = "medium";
// Duration of Animation

md("#gpplikebox").css({right: -250, "top" : 100 })
md("#gpplikebox").hover(function () {
md(this).stop().animate({
right: 0
}, $dur);
}, function () {
md(this).stop().animate({
right: -250
}, $dur);
});
md("#gpplikebox").show();
});
})(jQuery);
</script>
<div id="gpplikebox" style="display:none;">
<div class="gpplbadge"></div>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsSkFWoaVW_T6-CdpKpk9deTRShwU2djCt2ne9OLL_mZdGJQY_GxLnud7RMnXpBBsHzvrmQ0UCRU6lZo08ZiyOvLVsqZWQ4-BVGm2NvmK0fiL6sb1A0S5P9JF9AMF-dFHzguF09LUX3ia1/s128/bloggers-hero.blogspot.com.png'/>
<div class="g-plus" data-action="followers" data-height="300" data-href="https://plus.google.com/116705128458723615786" data-source="blogger:blog:followers" data-width="245">
</div>
<script type="text/javascript">
      (function() {
        window.___gcfg = {'lang': 'en'};
        var po = document.createElement('script');
        po.type = 'text/javascript';
        po.async = true;
        po.src = 'https://apis.google.com/js/plusone.js';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(po, s);
      })();
    </script>
</div>

Thay ID màu xanh thành ID của bạn

Chúc các bạn vui vẻ

More about →

Like box facebok xuất hiện khi vào Blog/web

Ảnh minh họa:

Các bước thực hiện: 

 1. Đăng nhập Blog

 2. Bố cục--> Thêm tiện ích HTML/javascritpt

 3. Dán code sau vào tiện ích HTML trên:

<!--popup box like Facebook - up by quangvietmkt -->
   <div style='position: fixed; left: 0%; top: 0%;'>
<style type='text/css'>
#makingdifferentpopup{

border:10px solid rgba(82, 82, 82, 0.7);
-webkit-background-clip: padding-box; /* for Safari */
background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
-webkit-border-radius:8px 8px 8px 8px;
-moz-border-radius:8px 8px 8px 8px;
border-radius:8px 8px 8px 8px;
width:300px;
height:360px;
overflow:hidden;
}
#makingdifferentpopup span{
font-size:20px !important;
font-weight:bold !important;
}
#makingdifferentpopup h1{
background:#6d84b4 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqV7egNNmWF_3jNc6iM18yeQd-8w8WRXY_Y8b3XeboJO1VSKCY5Ahyz0KBtImXZdDVY5_tH_97JDUGoZn8vIVVYCswJV5wVviSZp0ahlBij1W8Rmpdc5GHZc93bgV3E-We3G_5zlen3FDe/s1600/%255Bwww.gj37765.blogspot.com%255Dh1.png) 98% no-repeat;
border:1px solid #3b5998 !important;
color:#FFFFFF !important;
font-size:20px !important;
font-weight:700 !important;
padding:5px !important;
margin:0 !important;
font-family:&#39;&quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif !important;
overflow:hidden !important;
}
.htmlarea{
font-size:12px !important;
font-weight:normal !important;
height:265px !important;
padding:1px !important;
background:#fff !important;
border-bottom:2px solid #ddd;
overflow:hidden !important;
}
#mdfooter{
text-align:left;
background:#F2F2F2 !important;
height:56px !important;
padding:10px 10px 10px 10px !important;
overflow:hidden !important;
}
#mdclose{
float:right;
background-color:#eee !important;
border:1px solid #ccc !important;
color:#111 !important;
font-weight:bold !important;
padding:5px 8px 5px 8px !important;
text-decoration:none !important;
display:inline-block !important;
font-family:&#39;&quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif !important;
outline:none !important;
position:relative !important;
font-size:18px !important;
margin:1px !important;
}
#mdclose:active{
top:1px;
left:1px;
}
.grabthis{
bottom:80px;
font:8px &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif;
position:absolute;
right:6px;
text-align:right;
z-index: 99999;
}
.grabthis a{
color: #000;
text-decoration:none;
}
.grabthis a:hover{
text-decoration:underline;
}
</style>
<script type='text/javascript'>
jQuery(document).ready(function() {
function makingdifferent_ppopup()  {
var sec = 10
var timer = setInterval(function() {
   $(&quot;#mdfooter span&quot;).text(sec--);
   if (sec == 0) {
      $(&quot;#makingdifferentpopup&quot;).fadeOut(&quot;slow&quot;);
      clearInterval(timer);
   }
},1000);
  var mdwh = jQuery(window).height();
  var mdpph = jQuery(&quot;#makingdifferentpopup&quot;).height();
  var mdfromTop = jQuery(window).scrollTop()+50;
 jQuery(&quot;#makingdifferentpopup&quot;).css({&quot;top&quot;:mdfromTop});}
jQuery(window).fadeIn(makingdifferent_ppopup).resize(makingdifferent_ppopup)
 //alert(jQuery.cookie(&#39;sreqshown&#39;));
 //var mdww = jQuery(window).width();
 //var mdppw = jQuery(&quot;#makingdifferentpopup&quot;).width();
 //var mdleftm = (mdww-mdppw)/2;
   var mdleftm = 500;
 //var mdwh = jQuery(window).height();
 //var mdpph = jQuery(&quot;#makingdifferentpopup&quot;).height();
 //var mdfromTop = (jQuery(window).scrollTop()+mdwh-mdpph) / 2;
 jQuery(&quot;#makingdifferentpopup&quot;).animate({opacity: &quot;1&quot;, left: &quot;0&quot; , left:  mdleftm}, 0).show();
     jQuery(&quot;#mdclose&quot;).click(function() {
jQuery(&quot;#makingdifferentpopup&quot;).animate({opacity: &quot;0&quot;, left: &quot;-5000000&quot;}, 1000).show();});});
</script>
<div id='makingdifferentpopup'>
<h1>Like Fan Page Quangvietmkt</h1>
<div class='htmlarea'>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/VIT-Tin-t%E1%BB%A9cGi%E1%BA%A3i-tr%C3%ADTh%E1%BB%A7-thu%E1%BA%ADt/102371373304961&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23fff&amp;stream=false&amp;header=false&amp;height=250' style='border:none; overflow:hidden; width:300px; height:250px;'/>

</div>
<div id='mdfooter'>
Please wait..<span>10</span> Seconds
<a href='#' id='mdclose' onclick='return false;'>Close</a>
</div>
</div>
<!-- End popup -->
   </div>

Tùy chỉnh: 

- Màu đỏ: bạn thay thành địa chỉ fanpage của mình]

- Màu xanh: tên hiển thị tiêu đề cho phù hợp

- code:  <div style='position: fixed; left: 0%; top: 0%;'> : bạn điều chỉnh lại theo ý bạn muốn hiển thị

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

More about →

Thủ thuật ẩn bài viết ở trang chủ blogspot

 Trang chủ là nơi thể hiện các bài đăng của bạn được xếp theo thứ tự thời gian, bài nào đăng cuối cùng sẽ hiển thị trên cùng. Các bạn sẽ tự hỏi: "Ẩn bài viết ở trang chủ để làm gì?".

Với lý do nào đó, bạn muốn ẩn bài viết ở trang chủ để gắn các tiện ích khác đẹp hơn và hữu dụng hơn tạo cho trang Blog của mình có giao diện lạ mắt và khác biệt so với các blog khác thể hiện phong cách của chính mình...( theo cách diễn giải của mình là cất hết những bài viết đang có sẵn của mình để trang trí sắp xếp theo ý mình như Mul chẳng hạn, Dĩ nhiên các bài của bạn phải được xếp theo Label(nhãn) cho từng loại rồi nhé VD: Notes, Blog, Photos, video…)

Đây là thủ thuật đơn giả nên mình sẽ không post hình minh họa kết quả.

Cách tiến hành ẩn bài viết ở trang chủ!
Trước tiên thực hiện bạn phải xác định id của widget "Bài đăng trên blog", thông thường nó đều có id là "Blog1".Với một số blog có thể khác. Các bạn xác định theo các bước bên dưới:
1- Đăng nhập (login) vào Blog

2- Vào Mẫu (Template)

3- Chọn Chỉnh sử HTML (Edit HTML) => Tiếp tục (Proceed): => Tìm đoạn code tương tự như hình dưới:Xem hình họa:

- Trường hợp này Id là Blog1 (phần màu xanh). Sau khi xác định đc id này, ta thực hiện các bước tiếp theo:

4- Chèn đoạn code bên dưới vào sau dòng code ]]></b:skin> 

<style>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
#Blog1 {
display:none;
visibility:hidden;
}
</b:if>
</style>

- Lưu ý: Xác định đúng id. Nếu không phải id Blog1 thì bạn thay Blog1 thành id như temp của bạn

More about →

Cách ẩn bài viết trên trang chủ - Blogspot

Có bạn đã từng hỏi mình cách ẩn 1 số bài viết không muốn hiện trên trang chủ kiểu sau đây mình xin chia sẻ với các bạn cách thực hiện như sau (nhớ thank hoặc like nếu thấy hữu ích các bác nhé):

Mình sẽ lấy ví dụ cụ thể để cho các bạn dễ hiểu

Ví dụ: mình viết một loạt bài viết có tiêu đề lần lượt là Bài viết số 1, Bài viết số 2, Bài viết số 3, Bài viết số 4, Bài viết số 5. Ở đây mình muốn Bài viết
số 1 và Bài viết số 3 không được hiển thị ở trang chủ, vậy mình đặt thêm một nhãn chung cho hai bài viết này là Z Label. Phải đặt như thế này để trong trường hợp 2 bài viết này được đặt nhiều nhãn (ví dụ Z Label, Nhãn 1, Nhãn 2, …) thì Z Label sẽ hiển thị ở cuối cùng. Thủ thuật của mình là không cho nhãn Z Label xuất hiện trên trang chủ, khi đó Bài viết số 1 và Bài viết số 3 sẽ không xuất hiện ở trang chủ.

Để làm được như vậy, Bạn cần đăng nhập Blogger, vào Design >> Edit HTML(chỉnh sửa HTML), chọn Expand Widget Templates (nhớ Backup Template phòng khi code hỏng để còn tài lại ). 

Tìm dòng <b:includable id='main' var='top'>. Tính từ dòng này trở xuống vài dòng code mình sẽ tìm thấy đoạn code giống hoặc tương tự như đoạn code bên dưới.

<b:loop values='data:posts' var='post'>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include data='post' name='comments'/>
</b:if>
<b:if cond='data:post.includeAd'>
<b:if cond='data:post.isFirstPost'>
<data:defaultAdEnd/>
<b:else/>
<data:adEnd/>
</b:if>
<data:adCode/>
<data:adStart/>
</b:if>
<b:if cond='data:post.trackLatency'>
<data:post.latencyJs/>
</b:if>
</b:loop>

Rồi bạn thay nó bằng đoạn code bên dưới.

<b:loop values='data:posts' var='post'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == &quot;true&quot;'>
<b:if cond='data:label.name != "Z Label"'>
<b:include data='post' name='printPosts'/>
</b:if>
</b:if>
</b:loop>
</b:if>
<b:else/>
<b:include data='post' name='printPosts'/>
</b:if>
</b:loop>

Lúc này bạn tìm thẻ đóng </b:includable> Thẻ đóng này nằm ngay trước dòng : <b:includable id='commentDeleteIcon' var='comment'> hoặc bạn có thể tìm thẻ này cho nhanh <b:includable id='commentDeleteIcon' var='comment'>

Rồi đặt đoạn code bên dưới vào sau thẻ </b:includable> nói trên.

<b:includable id='printPosts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'>
<data:post.dateHeader/>
</h2>
</b:if>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<b:include data='post' name='comments'/>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comments'/>
</b:if>
</b:includable>

Chú ý cái Z Label là cái bạn có thể đổi tên nhưng bạn lên đặt tên tags có chữ Z ở đầu ví dụ như đặt tên là Z thuê xe du lịch chẳng hạn,các bài viết trong Z Label sẽ không được hiển thị tại trang chủ


Nếu bạn muốn ẩn liên kết nhãn Z Label ở cuối bài viết để khi ta đọc đến Bài viết số 1 và Bài viết số 3 thì sẽ không nhìn thấy liên kết Z Label ở cuối bài viết.

Ở chế độ Edit HTML chọn Expand Widget Templates. Tìm đoạn code như bên dưới.

<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
</b:loop>

Thay nó bằng đoạn code bên dưới.

<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name != &quot;Z Label&quot;'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
</b:if>
</b:loop>

Lưu Template là OK.


Chúc các bác thành công
Code này mình tìm tòi và sưu tầm thôi mình cũng không nhớ rõ nguồn nữa

More about →

Tạo khung liên kết bạn bè đẹp mắt cho Blogspot

Chắc hẳn bạn đã từng thấy tiện ích Friend Connect – Kết nối bạn bè trên một blog nào đó. Đây là một khung chứa liên kết đến các trang blog cá nhân của những người bạn của chủ Blog.

Tiện ích này không những có thể giúp chủ blog liên kết dễ dàng đến các Blog khác, mà đây còn là một hình thức để quảng bá lẫn nhau giúp tăng Pageview cho những blog được liên kết.

- Dĩ nhiên Google cũng đã cung cấp cho các Blogger một tiện ích tương tự là Google Friend Connect hay Followers, nhưng tiện ích này có một vài nhược điểm như :

• Phải sử dụng 1 file JavaScript để thực thi. Điều này xem ra không ổn vì sẽ ảnh hưởng đôi chút đến tốc độ tải trang của Blog, cho nên nó thường được các Blogger đặt ở Footer (bên ngoài content-wrapper để tiện ích tải sau cùng).
• Đoạn code để tạo nên tiện ích không hợp chuẩn W3C Validator - Điều này sẽ ảnh hưởng đến nhiều thứ khác như khả năng seo của chính blog bạn.

 Hôm nay mình sẽ giới thiệu đến các bạn cách tạo cho mình khung liên kết không mắc các nhược điểm trên.

 Demo for Post

1. Chuẩn bị

- Favicon của Blog bạn muốn liên kết

- Link đến Blog bạn muốn liên kết

2. Thực hiện

- Vào Thiết kế > Phần tử trang

- Tạo một widget HTML\JavaScript và dán vào đoạn code bên dưới ( không cần tạo tiêu đề cho widget )

<style type="text/css">
#namknaconnect{margin:0;  padding: 0; height:238px; overflow: auto;  background:url(http://1.bp.blogspot.com/-i4Ta82RggtU/T4D-FlKIHuI/AAAAAAAABfw/IiSVs-103LU/s1600/namkna-lien-ket-cong-dong-blogger-viet-namkna-blogspot-com.jpg)  no-repeat bottom right; font-weight:bold} 
#namknaconnect p {margin:0; padding:2px 10px} 
.favicon {width:16px; height:16px; margin-right:5px} 
.connect {width:48px; height:48px; margin:5px 10px -15px 0}
</style> 
<div id="namknaconnect"> 
<center  style="margin-bottom:15px"><img  src="http://2.bp.blogspot.com/-VZnzVoaXulk/T4D-gQcu-zI/AAAAAAAABf4/kaTX9D83xVE/s1600/namkna-connect-blogspot.png"  class="connect"/><a href="http://quangvietmkt.blogspot.com/2011/01/trao-oi-logo-lien-ket-cong-ong-blogger.html">KẾT NỐI BẠN BÈ</a></center> 
<p> <img src="YOUR FAVICON" class="favicon" /> <a href="       
http://quangvietmkt.blogspot.com/" target="_blank">Vietmkt</a></p> 
<p> <img src="YOUR FAVICON" class="favicon" /> <a href="       
Liên kết tới blog bạn bè" target="_blank">Tên blog</a></p> 
<!—tương tự cho các liên kết khác -->
</div>

Thay đoạn code được in đậm cho phù hợp.

* Update : do có bạn yêu cầu làm cho danh sách liên kết chuyển động từ dưới lên ( hoặc từ trên xuống ) để làm cho Blog trông đỡ “tĩnh lặng” hơn. Để làm điều đó, các bạn chỉ việc thay đoạn code bên trên bằng đoạn code sau :

<style type="text/css">      
#namknaconnect{margin:0;  padding: 0; border:double #ccc;  background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFesd3IBAX4sbb-ROgbQV8WoGFJHfB8yJDDNDswjNsdnaA3Pi5Jz6wMJwP6nvnugJvqGR8GAo_zRKl461RY2lMsNnbEkFB8zFPIZ9iytcNAA6njlZhDC1uCevXBOE_12JyXzyXxlr6kqPS/s1600/namkna-lien-ket-cong-dong-blogger-viet-namkna-blogspot-com.jpg)  no-repeat bottom right; font-weight:bold}       
#namknaconnect p {margin:0; padding:2px 10px}       
.favicon {width:16px; height:16px; margin-right:5px}       
.connect {width:48px; height:48px; margin:5px 10px 0 0}       
</style>       
<div id="namknaconnect">       
<center  style="margin-bottom:25px"><img  src="http://2.bp.blogspot.com/-VZnzVoaXulk/T4D-gQcu-zI/AAAAAAAABf4/kaTX9D83xVE/s1600/namkna-connect-blogspot.png"  class="connect"/><a href="http://quangvietmkt.blogspot.com/2011/01/trao-oi-logo-lien-ket-cong-ong-blogger.html">KẾT NỐI BẠN BÈ</a></center> 
<marquee align='left' direction='up' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' height='165' width='100%'>       
<p> <img src="YOUR FAVICON" class="favicon" /> <a href="       
http://namkna.blogspot.com/" target="_blank">Namkna</a></p>       
<p> <img src="YOUR FAVICON" class="favicon" /> <a href="       
Liên kết tới blog bạn bè" target="_blank">Tên blog</a></p>       
<!--tương tự cho các liên kết khác-->       
</marquee>       
</div>

- Thay đổi Up thành down nếu bạn muốn trôi từ trên xuống.
Như vậy là bạn đã có tiện ích “Liên kết bạn bè” đơn giản mà đẹp mắt rồi đó.

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

theo namkna

More about →

Tự động thay đổi hình nền Blogspot theo thời gian

Với thủ thuật này bạn có thể dễ dàng đặt khoảng thời gian cho việc thay đổi nền này trong 24h. Ví dụ, bạn có thể đặt khoảng thời gian từ 17 đến 18h màu nền của bạn là màu xanh, 18h đến 20h nền của bạn là màu xám chẳng hạn, tương tự như vậy bạn có thể chia khoảng thời gian 24h ra thành nhiều khoảng tương ứng với từng màu nền mà bạn thích.


1. Vào phần thiết kế (Design)

2. Chọn thêm tiện ích (Add a Gadget)

3. Thêm 1 HTML/Javascript và thêm vào code bên dưới

<script type="text/javascript">

var now = new Date();

var hours = now.getHours();

var psj=0;




document.write('<style type="text/css">')

//từ 18 - 19h tối

if (hours > 17 && hours < 20){

document.write('body{background:#000000; color:#FFFFFF;} a{color: #ff0033 !important}')




}

//từ 20 - 21h tối

if (hours > 19 && hours < 22){

document.write('body{background:#cccccc; color:#FF00FF;} a{color: #bbbbbb!important}')




}

//từ 22 - 4h sáng

if (hours > 21 || hours < 5){

document.write('body{background:#aba; color:#FFFFccc;} a{color: #ff0000 !important}')

}

//từ 5 - 9h sáng

if (hours > 4 && hours < 10){

document.write('body{background:#000; color:#FFFFFF;} a{color: #444 !important}')

}

//từ 10 - 16h chiều

if (hours > 9 && hours < 19){

document.write('body{background:#eee; color:#FF66FF;} a{color: #ddd !important}')

}

//từ 16 - 17h chiều

if (hours > 15 && hours < 18){

document.write('body{background:#ddd; color:#FFFF99;} a{color: #ccffff !important}')

}

document.write('</style>')

</script>

» Chỉnh code:

- Các con số màu xanh chính là khoảng thời gian bạn muốn đặt, lưu ý cách đặt khoảng thời gian này. Ví dụ bạn muốn đặt khoảng thời gian là từ 13h đến 15h, thì con số nhỏ phải nhỏ hơn 13h tức là 12h và con số lớn phải lớn hơn 15h tức 16h. Ở đây là chúng ta lấy khoảng nên 2 con số mốc ta bỏ ra, tính từ số kế tiếp.
- Code màu đỏ là màu nền bạn muốn đặt cho khoảng thời gian định trước
- Code màu tím là màu của text trên blog của bạn
- Code màu xanh nhạt chính là màu của các linktext trên blog, bạn thay các mã mãu trên thành các màu bạn thích.

More about →