"Touch Me" Sharing Widget cho Blogs

Các giao tiếp chia sẽ giữa Blogger với các ứng dụng bây giờ không còn là một chuyện khó khăn nữa. Việc tạo cho mình một kiểu dáng bằng cách thiết kế và viết Blogspot để quãng bá, giao tiếp đã trở thành một việc làm phổ biến, ngay cả đến những bạn chưa biết gì cũg vẫn có thể theo đó để tự tạo dựng. Blogger ngày nay là phổ dụng trên các cộng động mạng như một tên gọi quen thuộc, kiểu cách trình bày thiết kế là nhiều vô số kể. Blogger như một Modul lắp ghép, cứ chịu khó học hỏi, biết gì, tới đâu thì làm tới đó. Phat hiện ra điều chi mới lạ, đẹp hơn, bạn có thể gỡ bỏ những gì mình đã làm, thay vào đó là những kiểu dáng phù hợp hơn. Tuy nhiên, Blogger vẫn là Blogger, vẫn có một bản sắc của nó, nội dung bên trong để cho bạn thể hiện vẫn là bạn, chỉ có kiểu dáng bên ngoài mà ta quen gọi là Modem hay Style là phải theo thời, theo thuở.

Nhìn hình dáng dưới đây, giao diện chia sẽ với các ứng dụng, bạn có một cảm chừng như rất linh hoạt, Blog của bạn tỏ ra như có một vẽ ứng xử mau lẹ, dễ thương hơn. Chuyện đó tùy các bạn, chỉ có việc thử xem, chép về, chia sẽ...

Cách thiết kế dã nói là một Modul, nên các bước trình tự không mấy gì khó.

  Thực hiện như sau: tất nhiên là ban phải có Account trên Google, không có phải tạo.

1. Vào thiết kế Blogger > Layout

2. Chọn add a gadget

3. Chọn tiếp HTML/JavaScript

4. Copy Source Code sau đây, Paste dán vào trong khung Text Box:

<style>
/*--------Touch Me Sharing Widget ------*/
.touchme a {
display:block;
height:50px;
width:50px;
padding:0 4px;
float:left;
background:transparent url(http://mybloggertricks.googlecode.com/files/Sharing%20Touch%20Me.png) no-repeat;
-webkit-transition: ease-in 0.2s all;   
-moz-transition: ease-in 0.2s all;   
-o-transition: ease-in 0.2s all;   
-ms-transition: ease-in 0.2s all;   
transition: ease-in 0.2s all;
cursor:pointer;
}

.touchme a.googleplus {
background-position: 0px -58px;
}
.touchme a.googleplus:hover {
background-position: 0px 0px;
}

.touchme a.twitter {
background-position: 0px -290px;
}
.touchme a.twitter:hover {
background-position: 0px -232px;
}
.touchme a.facebook {
background-position: 0px -406px;
}
.touchme a.facebook:hover {
background-position: 0px -348px;
}

.touchme a.rss {
background-position: 0px -174px;
}
.touchme a.rss:hover {
background-position: 0px -116px;
}

</style>

<div class='touchme'>
<!--RSS-->
<a class='rss' href="YOUR RSS LINK" rel='external nofollow' target='_blank'></a>
<!--Google Plus-->
<a class='googleplus' href="YOUR GOOGLE PROFILE LINK" rel='external nofollow' target='_blank'></a>
<!--Facebook-->
<a class='facebook' href="YOUR FACEBOOK LINK" rel='external nofollow' target='_blank'></a>
<!-- Twitter -->
<a class='twitter' href="YOUR TWITTER LINK" rel='external nofollow' target='_blank' ></a>

</div>

Chú thích:

• Thay thế YOUR RSS LINK bởi Feed burner link của bạn.
• Thay thế YOUR GOOGLE PROFILE LINK bởi Google+ URL của bạn.
• Thay thế YOUR FACEBOOK LINK bởi Facebook URL của bạn.
• Thay thế YOUR TWITTER LINK bởi Twitter Profile URL của bạn

         5. Click nút Save, lưu lại hộp HTML/JavaScrip. Thế la xong!
Chúc các bạn thành công.

Tham khảo Nguồn My Blogger Tricks

Socializer Widget by Nguyen D. Khanh

SOCIALIZE IT →

Tweet

FOLLOW US →

SHARE IT →

Các bạn có thể tham khảo thêm nhiều kiến thức từ các bài viết mà mình đã SEO bằng các Từ khóa bên dưới bài đăng nầy để tìm hiểu thêm về các khái niệm và ứng dụng có liên quan nhé..