Subscribe Now

Trending News

Bài viết

Chèn nút Social Share WordPress không cần plugin
Chèn nút Social Share WordPress không dùng plugin
WordPress

Chèn nút Social Share WordPress không cần plugin

Chia sẻ bài viết lên các trang mạng xã hội như Facebook, Google Plus, Twitter,.. là điều tất yếu bạn cần phải làm sau khi xuất bản bài viết để người dùng có thể tiếp cận bài viết nhiều hơn. Chèn các nút chia sẻ mạng xã hội vào bài viết sẽ giúp bạn thực hiện chia sẻ một cách nhanh chóng và nếu người dùng đọc bài viết của bạn thấy hay thì có thế chia sẻ một cách dễ dàng hơn.

WordPress hiện cũng đã có rất nhiều plugin hỗ trợ chèn nút chia sẻ vào bài viết hay trên website đủ các kiểu style để cho người dùng lựa chọn, nhưng nếu đã có cài plugin thì tất nhiên web của bạn sẽ nặng thêm một tí nên mình chia sẻ cách để chèn các nút chia sẻ vào website WordPress mà không cần dùng đến plugin để website nhẹ hơn và cho những bạn nào chỉ thích code 😉

Code CSS gồm:

Code PHP:

Bạn cần tìm ra đoạn code hiển thị nội dung bài viết trong mã nguồn website, thông thường hay nằm trong file single.php (có thể nằm ở file khác, Sublime Text có thể giúp bạn tìm nhanh hơn) và hàm thực hiện là the_content()

<?php
    $actual_link = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
?>
<div>
    <a class="btn btn-social-icon btn-facebook" href="https://www.facebook.com/sharer/sharer.php?u=<?php echo $actual_link; ?>" target="_blank"><span class="fa fa-facebook"></span></a>
    <a class="btn btn-social-icon btn-google" href="https://plus.google.com/share?url=<?php echo $actual_link; ?>" target="_blank"><span class="fa fa-google"></span></a>
    <a class="btn btn-social-icon btn-twitter" href="https://twitter.com/home?status=<?php echo $actual_link; ?>" target="_blank"><span class="fa fa-twitter"></span></a>
    <a class="btn btn-social-icon btn-linkedin" href="https://www.linkedin.com/shareArticle?mini=true&url=<?php echo $actual_link; ?>&title=<?php echo get_the_title(get_the_ID()); ?>&source=example.com" target="_blank"><span class="fa fa-linkedin"></span></a>
    <a class="btn btn-social-icon btn-pinterest" href="https://www.pinterest.com/pin/create/link/?url=<?php echo $actual_link; ?>&media=<?php echo the_post_thumbnail_url('large'); ?>&description=<?php echo get_the_title(get_the_ID()); ?>" target="_blank"><span class="fa fa-pinterest"></span></a>
</div>
<div>
    <?php the_content() ?>
</div>
<div>
    <a class="btn btn-social-icon btn-facebook" href="https://www.facebook.com/sharer/sharer.php?u=<?php echo $actual_link; ?>" target="_blank"><span class="fa fa-facebook"></span></a>
    <a class="btn btn-social-icon btn-google" href="https://plus.google.com/share?url=<?php echo $actual_link; ?>" target="_blank"><span class="fa fa-google"></span></a>
    <a class="btn btn-social-icon btn-twitter" href="https://twitter.com/home?status=<?php echo $actual_link; ?>" target="_blank"><span class="fa fa-twitter"></span></a>
    <a class="btn btn-social-icon btn-linkedin" href="https://www.linkedin.com/shareArticle?mini=true&url=<?php echo $actual_link; ?>&title=<?php echo get_the_title(get_the_ID()); ?>&source=example.com" target="_blank"><span class="fa fa-linkedin"></span></a>
    <a class="btn btn-social-icon btn-pinterest" href="https://www.pinterest.com/pin/create/link/?url=<?php echo $actual_link; ?>&media=<?php echo the_post_thumbnail_url('large'); ?>&description=<?php echo get_the_title(get_the_ID()); ?>" target="_blank"><span class="fa fa-pinterest"></span></a>
</div>

Bạn chèn đoạn code các nút chia sẻ trước và sau hàm the_content() để hiển thị các nút lẫn cả đầu và cuối bài viết. Đoạn có example.com thì hãy thay thành domain của bạn nhé. Mình chỉ demo các mạng xã hội phổ biến, nếu bạn muốn nhiều hơn, hãy vào trang sharelinkgenerator.com để tạo ta chuỗi url sharing.

Chúc các bạn thành công!

Bài viết liên quan

Theo dõi
Thông báo của
guest

4 Góp ý
Mới nhất
Cũ nhất Được bỏ phiếu nhiều nhất
Phản hồi nội tuyến
Xem tất cả bình luận
đại phú
đại phú
4 năm trước

Chào bạn! suqr dụng code như bạn! sau này cập nhật thêm hoặc word press thì có bị mất hay gây lỗi cho website k?

Cáo già
Cáo già
4 năm trước

Làm sao bật tính năng chia sẻ bài viết trên jet pack vậy bạn. web mình kích hoạt mà không hiện