Làm thế nào để thêm Facebook comment cho mỗi bài viết ở Ghost Blog?

Đây là phần 5 của loạt bài 6 phần viết về Tôi đã dùng Ghost Blog thế nào? Phần 1 giới thiệu tổng quan về Ghost, và cách thức tạo máy chủ Ghost. Phần 2 tập trung giới thiệu ngôn ngữ soạn thảo Markdown và cách viết bài trên Ghost. Phần 3, giới thiệu về cách viết bài trên Ghost. Phần 4 hướng dẫn cách áp dụng Let's Encrypt cho Ghost Blog. Phần 6 giới thiệu bạn cách thêm Google Analytics

Mặc định Ghost Blog không tích hợp sẵn phần bình luận (comment) - trong khi hành động bình luận đã trở thành hành động phổ biến, là kênh tương tác giữa người viết và người đọc - chính vì vậy, Ghost Blog dù không tích hợp phần bình luận nhưng lại mở tích hợp cho nhà cung cấp bên thứ 3. Trong bài viết này, tôi giới thiệu bạn cách áp dụng Facebook comment cho Ghost Blog.

Làm theo các bước đơn giản dưới đây, bạn sẽ có phần bình luận cho Ghost Blog của mình.

Bước 1. Để bắt đầu, bạn cần đi tới trang FaceBook Developer Comment Plugin Bước 2. Tiếp theo, bạn nhập đường dẫn Ghost Blog của mình như hình dưới: Bạn cần chú ý:

  • URL to comment on: đây là đường dẫn Ghost Blog.
  • Width: là độ rộng của phần bình luận hiển thị ở Ghost Blog.
  • Number of Posts: là số lượng comment được hiển thị ở Ghost Blog.
  • Khung 0 comment bên dưới là phần xem trước để bạn dễ hình dung cách Facebook Comment hiển thị ở Ghost Blog.

Lưu ý: Facebook Comment có hướng dẫn bạn tùy chỉnh những thiết lập, vui lòng kéo xuống bên dưới trang FaceBook Developer Comment Plugin để xem chi tiết.

Bước 3. Cuối cùng, sau khi đã đồng ý với lựa chọn của mình, bạn nhấp chọn nút chọn Get Code, cửa sổ sau xuất hiện: Bước 4. SSH tới máy chủ Ghost Blog, đi tới đường dẫn chứa themes của bạn, trong trong bài viết này tôi dùng theme casper nên đường dẫn là /var/www/ghost/content/themes/casper/, chọn vim làm công cụ chỉnh sửa file post.hbs. Bước 5. Tìm đến dòng sau:

        <section class="post-content">
            {{content}}
        </section>

Bạn paste Step 2 & Step 3bước 2 vào giữa đoạn code này:

        <section class="post-content">
            {{content}}
                <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&version=v2.8";
                          fjs.parentNode.insertBefore(js, fjs);
                }(document, 'script', 'facebook-jssdk'));</script>
                <div class="fb-comments" data-href="https://tien-phan.com" data-numposts="5"></div>
        </section>

Sau đó, bạn save & exit file post.hbs
Bước 6. Restart Ghost Blog của bạn sudo systemctl restart ghost
Bước 7. Ghost Blog của bạn đã tích hợp Facebook Comment Plugin.

Kết luận

Trong bài viết này, tôi đã hướng dẫn bạn cách thêm Facebook comment cho bài viết ở Ghost Blog của bạn. Nếu bạn là người mới bắt đầu với Ghost Blog, tôi có niềm tin bài viết giúp ích cho bạn. Tôi rất vui khi bạn đọc tới đây. Hãy viết những bài cho riêng mình, thoải mái diễn đạt suy nghĩ và ý tưởng của mình bằng ngôn ngữ.

Lời cám ơn

Tôi cám ơn bạn đã dành thời gian để đọc bài viết này. Tất nhiên, tôi luôn quan tâm đến hoàn thiện chất lượng bài viết, vì vậy mọi sự đóng góp của bạn là sự khích lệ đối với tôi.

Bài viết thể hiện quan điểm, văn phong của tác giả. Mọi sự tranh luận, phản biện được khuyến khích. Và tôi bảo lưu mọi quan điểm cho đến khi mọi thứ được sáng tỏ trên cơ sở sự chính xác của thông tin.

Tài liệu tham khảo

Để viết bài này, tôi đã sử dụng các tài liệu tham khảo https://developers.facebook.com/docs/plugins/comments/#configurator
https://www.ghostforbeginners.com/how-to-enable-comments-on-a-ghost-blog/#facebook

Tien Phan

Read more posts by this author.

Subscribe to

Get the latest posts delivered right to your inbox.

or subscribe via RSS with Feedly!