THỦ THUẬT

Hiệu ứng Like page Facebook (FB), G+, twitter động cực đẹp cho Web, blogspot


Làm thế nào để thêm nút Like Facebook, chia sẻ G+, theo dõi Twitter cho 1 trang Web hoặc blog?
Thủ thuật hôm nay mình giới thiệu tới các bạn cách thêm 1 nút Like Page FB, chia sẻ G+, theo dõi twitter cực đẹp và rất tiện dụng.
Điểm nổi bật của thủ thuật này là khi các bạn kéo thanh cuộn trình duyệt ra khỏi Top thì nút khung Like đó tự xuất hiện và khi lên Top thì nó lại tự động biến mất.
tin shock, shock360
Demo tại blog: Tin shock (kéo thanh cuộn trình duyệt và xem kết quả nhé các bạn)
- Cách làm thủ thuật trên Blogspot (trên những nền Web khác nhau thì các bạn làm tương tự nhé)
1. Vào bảng điều khiển blogger - > Bố cục (Layout) -> Thêm tiện ích (Add a widget) -> HTML/Javascript
2. Dán Code dưới đây vào tiện ích vừa thêm.


<style>
#socialslide{background: rgb(41, 40, 40) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-3cyI_CPBbM7WnjkBRF_wu9BBGmu149Tyr_hKKJL3MHYK2FdqlaR8GTHS25ed1MbgimZLkSkUjyTwvcZT73LB40dS3ECHYdFjRfpCwM7YsmLlcAZXL9xKIg7wLJ4Zae3fjg6yJTkOtok/s1600/recbg-btrix.png) left top repeat-x;
border-radius: 9px;
-moz-border-radius: 9px;
-webkit-border-radius: 9px;
-moz-box-shadow: inset 0 0 3px #333;
-webkit-box-shadow: inset 0 0 3px #333;
box-shadow: inner 0 0 3px #333;
padding: 12px 14px 12px 14px;
width: 300px;
position: fixed;
bottom: 13px;
right: 2px;
display: none;
z-index: 3;
height: 65px;
}
</style>


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

<script type="text/javascript">$(window).scroll(function(){if($(document).scrollTop()>=$(document).height()/4)$("#socialslide").show("slow");else $("#socialslide").hide("slow");});function closesocialslide(){$('#msocialslide').remove();$.ajax({type:"POST",url:"/facebookpage.php"});}</script>
<div style="display: none;" id="socialslide">
<a style="position:absolute;top:14px;right:10px;color:#555;font-size:10px;font-weight:bold;" href="javascript:void(0);" onclick="return closesocialslide();">(ĐÓNG)</a>
<span style="font-family: Tekton Pro; font-size: 20px; margin: 10px 0; text-shadow: 1px 1px 0 #FFFFFF;">Tham gia cùng Shock360 nhé!</span><br />
<div style="float:left; margin:15px;"><g:plusone annotation="none"></g:plusone></div>

<div style="float:left; margin:15px;"><iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2F511574655544346&send=false&layout=button_count&width=80&show_faces=false&action=like&colorscheme=light&font=arial&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:80px; height:21px;" allowtransparency="true"></iframe></div>

<div style="float:left; margin:15px;"><a href="https://twitter.com/#" class="twitter-follow-button" data-show-count="false" data-size="large" data-show-screen-name="false">Follow @hannygames</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></div>
</div>

<div class='clear'></div>

-Trong đó
Tham gia cùng Shock360 nhé! : là lời nhắc trên tiêu đề khung (Nhớ Like cho shock360 cái nhá các bạn)
511574655544346 : là con số id của Page FB các bạn. Nếu Page FB của các bạn đã đổi tên thì lấy nó là tên link id của Page đó nhé. Ví dụ "https://www.facebook.com/thuphapVietNam1" thì thay con số này bằngthuphapVietNam1
#: là Page twitter của các bạn.
Xong rồi. Xem kết quả nhé :)
Chúc các bạn thành công !

TÁC GIẢ : Unknown

Hi. I’m Designer and CEO/Founder of ThemeXpose. I’m Creative Web Designer, UI/UX Designer, Web Developer, Business Enthusiast, StartUp Enthusiast, Speaker, Writer and Photographer. Inspired to make things looks better.

  • 0Blogger
  • Facebook
  • Disqus
  • Google+

Post a Comment

More →
Chữ đậm Chữ nghiêng Chữ nghiêng 2 Chèn Link Chèn Link Mã hóa code Help ?Nhấn vào biểu tượng hoặc kiểu chữ hoặc chèn link sau đó nhấn nút Chọn rồi copy (Ctrl + C) để paste (Ctrl + V) vào khung viết bình luận. Mã hóa code nếu bạn muốn đưa code vào bình luận.

Chọn Xóa

comments powered by Disqus


Powered by Blogger.