Hướng dẫn chèn script Facebook vào tiện ích HTML/Javascript

Từ trước tới nay chúng ta vẫn chèn script sdk của Facebook vào cuối trước thẻ đóng </body>, trong script sdk của Facebook có appId của ứng dụng khác nhau bắt buộc phải thay thế. Nếu bạn là người thiết kế template bạn có thể chèn script vào trong tiện ích HTML/Javascript để thuận tiện hơn cho người sử dụng cụ thể như sau:

Hướng dẫn chèn script Facebook vào tiện ích HTML/Javascript

+ Đoạn script mặc định của Facebook như sau:

Copy

<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 = "https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.6&appId={your-app-id}";

fjs.parentNode.insertBefore(js, fjs);

}(document, 'script', 'facebook-jssdk'));</script>

Như vậy bạn cần thay {your-app-id} bằng ID ứng dụng, cách làm như sau:

+ Trước tiên bạn cần thêm tiện ích HTML/Javascript xong vào chỉnh sửa tiện ích này chọn mở rộng thẻ tag <b:includable id=’main’> chỉnh sửa lại nội dung như sau:

Copy

<div class='widget-content'>

  <data:content/>

</div>

Bạn sửa lại thành:

Copy

<b:if cond='data:content'>

  <div class='widget-content'>

    <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 = "https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&amp;version=v2.6&amp;appId=<data:content/>";

       fjs.parentNode.insertBefore(js, fjs);

     }(document, 'script', 'facebook-jssdk'));</script>

  </div>

</b:if>

Để người dùng cài đặt tiện ích này họ chỉ cần tạo và thêm ID ứng dụng

Hướng dẫn chèn script Facebook vào tiện ích HTML/Javascript

Sau đó chèn ID ứng dụng vào tiện ích

Hướng dẫn chèn script Facebook vào tiện ích HTML/Javascript

Trường hợp nếu bỏ trống thì script sẽ không được tải vì được đặt trong thẻ điều kiện <b:if cond=’data:content’>.

Chấm hết bài!!!

View Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

Published by
5 years ago