Mạng xã hội thì luôn có vai trò khá quan trọng trong việc đưa lưu lượng truy cập đến website của chúng ta. Do đó việc thêm các nút như Thích của Facebook, +1 của Google, Chia sẻ lên Twitter,.. là một phần không thể thiếu, đặc biệt là đối với những blog cá nhân đây.
Vấn đề xảy ra ở đây là, nếu bạn tối đang thiết kế hoặc tối tưu cho website của mình để đạt chuẩn HTML5, những số đoạn mã tạo nút chuẩn lại khó tìm kiếm, và đôi khi cần phải sửa đổi. Do đó dưới đây mình sẽ tổng hợp và cung cấp cho các bạn những đoạn mã chia sẻ qua mạng xã hội đạt chuẩn HTML5.
Google Plus
<div class='g-plusone' data-count='true' data-size='medium' expr:data-href='data:post.url'/>
<script type='text/javascript'>
window.___gcfg = {lang: 'id'};
(function() {
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>
Twitter
<a class='twitter-share-button' data-count='horizontal' data-related='' data-via='' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a> <script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
Facebook
Đối với facebook, một mạng xã hội phổ biến nhất ở Việt Nam thì mình chia sẽ code ở cuối cùng là vì có 2 phương án cho bạn lựa chọn.
Sử dụng thẻ iframe
<iframe expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&amp;send=false&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=21"' style='border:none; overflow:hidden; width:90px; height:21px;'/>
đây là phương án tiện nhất chỉ sử dụng một đoạn mã duy nhất để chèn vào website của bạn, nhưng mình không khuyến khích sử dụng phương án này. Như khá nhiều bài viết khác trên mạng đã nói thẻ việc sử dụng thẻ iframe trên website của chúng ta thì hoàn toàn không tốt cho SEO một tý nào.
Sử dụng HTML5 mà facebook cung cấp
Bước 1: Chèn đoạn mã này xuống dưới thẻ <body>
<div id="fb-root"></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/en_US/sdk.js#xfbml=1&appId=191743990857285&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Bước 2: Chèn đoạn mã sau đây vào nơi muốn hiện nút "Thích"
<div class="fb-like" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></div>
0 nhận xét:
Đăng nhận xét