[BÀI 26] NHÚNG FACEBOOK COMMENT VÀ CÁC TÍNH NĂNG KHÁC VÀO WEBSITE
Bài trước chúng ta đã thực hiện thành công việc tạo một tài khoản và kích hoạt ứng dụng facebook. Hôm nay tôi sẽ hướng dẫn các bạn nhúng comment vào website của bạn. Chọn ứng dụng: Mỗi một ứng dụng tạo ra được áp dụng vào một website khác nhau, do vậy mà bạn cần lựa chọn một ứng dụng facebook ...
Bài trước chúng ta đã thực hiện thành công việc tạo một tài khoản và kích hoạt ứng dụng facebook.
Hôm nay tôi sẽ hướng dẫn các bạn nhúng comment vào website của bạn.
Chọn ứng dụng:
Mỗi một ứng dụng tạo ra được áp dụng vào một website khác nhau, do vậy mà bạn cần lựa chọn một ứng dụng facebook trước khi nhúng các ứng dụng facebook vào website.
Để Xem tất cả ứng dụng facebook mà bạn đã tạo, bạn truy cập: https://developers.facebook.com/apps/ , Những ứng dụng có hình tròn nền xanh lá cây ở cuối tên ứng dụng là những ứng dụng đã được kích hoạt.
Click vào ứng dụng của bạn và tiến hành các công việc cần thiết:
Bảng quản lý ứng dụng của bạn hiện lên, click vào “Thêm sản phẩm” ở menu bên trái, lăn chuột xuống dưới cùng , đến phần “Plugin xã hội” ,nhấn vào “đọc tài liệu”:
Sau khi nhấn vào đọc tài liệu, bạn sẽ được chuyển hướng sang trang sau đây:
Có rất nhiều kiểu nhúng, để nhúng comment vào facebook, bạn click vào “Bình luận” ở menu bên trái, và bạn sẽ được chuyển hướng đến trang sau:
Tại đây bạn sẽ cấu hình cho plugin bình luận sẽ được nhúng vào website của bạn,
Các phần cấu hình bạn tùy ý chỉnh giao diện, tuy nhiên phần “URL để bình luận” là phần quan trọng nhất, ở đây bạn phải ghi địa chỉ trang facebook của bạn vào, như ở trên, tôi có ghi địa chỉ trang facebook của tôi.
Sau khi nhập xong, bạn kéo xuống dưới, click vào “Lấy mã” để lấy code nhúng vào website:
Một cửa sổ mới hiện lên như sau:
|
1 2 3 4 5 6 7 8 9 |
<!-- 'Bước 2' --> <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/vi_VN/sdk.js#xfbml=1&version=v2.8&appId=351909355157812"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> |
|
1 2 |
<!-- 'Bước 3' --> <div class="fb-comments" data-href="https://www.facebook.com/trung.hongoc" data-numposts="5"></div> |
Trong đó, ở bước 2 , bạn phải copy đoạn mã facebook viết sẵn và đặt ngay dưới thẻ mở thẻ <body>. Ở bước 3, đoạn mã facebook này bạn có thể đặt bất cứ đâu trên trang web của bạn.
Ví dụ, với đoạn mã của tôi thì tôi viết như sau:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
<!DOCTYPE html> <html> <head> <title>Devpro.edu.vn</title> <meta charset="utf-8"> <meta name="viewport" content="awidth=device-awidth, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <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/vi_VN/sdk.js#xfbml=1&version=v2.8&appId=351909355157812"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); </script> <div class="container"> <div class="row"> <div class="col-md-6 col-md-offset-3"> <div class="fb-comments" data-href="https://www.facebook.com/trung.hongoc" data-numposts="5"></div> </div> </div> </div> </body> </html> |
Tôi tiến hành kiểm tra và xuất hiện giao diện như sau:
Như vậy ở bài viết này tôi đã hướng dẫn các bạn nhúng được comment facebook vào website của bạn. Để nhúng chat facebook, nhúng nút like, nút chia sẻ, nút theo dõi,… vào facebook các bạn cũng thực hiện tương tự. Bài hướng dẫn nhúng comment facebook kết thúc ở đây, và đừng quên đọc những bài viết sau để biết thêm nhiều kỹ năng đặc biệt.
