Thêm Like Facebook , Google +1 , Twitter , Linkhay không dùng plugin

Một số bạn muốn chèn các mạng xã hội vào cho website Nhưng lại không biết làm sao cho đẹp hay cho tiện lợi. Bài viết này Harry chia sẻ cho các bạn biết cách chèn Like Facebook , Google +1 , Twitter , LinkHay vào website của mình một cách đơn giản nhất.Đây cũng là cách mà Harry áp dụng cho website : Ao so mi nu . Mục đích để khách hàng hoặc webmaster đọc bài xong có thể share bài viết lên mạng xã hội luôn.

Bạn có thể nhìn bên góc phải bài viết có xuất hiện các nút mạng xã hội như trên.Bây giờ ta chỉ cần mở file footer.php rồi thêm vào đoạn code sau trước thẻ đóng </body>

<!—social–>
<div id=”ShareBar”>
<div style=”float:left; margin:10px 0 0 10px;”>
<div id=”fb-root”></div>

<div class=”fb-like” data-href=’<?=$song_URL;?>’ data-send=”true” data-layout=”box_count” data-width=”50″ data-show-faces=”false” data-font=”arial”></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = “//connect.facebook.net/vi_VN/all.js#xfbml=1&appId=338179059595200″;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>
</div>
<div style=”float:left; margin:10px 0 0 10px;”>
<g:plusone></g:plusone>
</div>
<div style=”float:left; margin:10px 0 0 10px;”>
<!– tweet button start–>
<a href=”https://twitter.com/share” rel=”nofollow” class=”twitter-share-button” data-url=’<?=$song_URL;?>’ data-text=”<?php the_title();?>”>Tweet</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>
<!– tweet button start–>
</div>

</div>
<!–end–>

Đoạn code trên Harry lược bỏ button link hay.Bây giờ bạn chỉ cần css cho đúng ý thích của mình.Harry cho nó về bên phải nhé.

#ShareBar { font-size: 9px;
line-height: normal;
overflow: hidden;
position: fixed;
right: 0 !important;
text-align: center;
top: 28%;
width: 71px;
z-index: 99935;
background:#EB730A;}

Và bây giờ F5 và xem lại thành quả của mình nhé.Nếu bạn gặp khó khăn vui lòng gửi ý kiến tại form bình luận.Đừng quên ủng hộ +1 Harry tại topic sau : shop quan ao