Tạo Nút Share Facebook Cho Website

     

Nút chia sẻ mạng làng mạc hội là phần lớn nút ít chức năng nkhô hanh cùng gọn gàng dùng làm người truy cập bấm vào vào với hiển thị ra một cửa sổ có tất cả biết tin liên kết share, ảnh thay mặt đại diện cùng diễn tả với đều giòng share của người tiêu dùng. Nó hầu như hiện nay gần như có mặt trên tất cả các website vày tính tiện lợi không chỉ là làm đẹp cho trang web mà nó còn giúp cho các links bên trên trang web của doanh nghiệp được share mang đến người tiêu dùng khác và người dùng đang theo liên kết đó vô website.

Bạn đang xem: Tạo nút share facebook cho website

Với bài toán share liên kết như thế hỗ trợ cho trang web của bạn có thêm lượng truy vấn đáng chú ý cũng như giúp website seo giỏi hơn. Nhưng tuy vậy với tất cả những trang web hiện giờ thường áp dụng iframe, Có nghĩa là sử dụng bộ code nhúng của các social mà lại lập trình viên phân phối. Chính chính vì như thế nó sẽ gây ra tốn tài nguyên ổn khi visitor website của công ty yêu cầu load không ít lần tài liệu.

Để bớt tgọi quá nhiều vào việc phụ thuộc vào plugin gây nặng nề site hơn vậy thì lúc này Thịnh share cùng với các bạn biện pháp làm sao để có được những nút share mạng xã hội hay đẹp nhất và lại tiết kiệm được tài ngulặng khối hệ thống tương tự như dung tích sở hữu trang bằng phương pháp dưới đây.

Lưu ý: Thịnh sử dụng fonts awesome và bởi vậy rất cần được khai báo trước kia. Nếu bạn muốn dùng hình họa thì sửa chữa thay thế đoạn mã thẻ html thành .

Tiến hành viết code cho nút chia sẻ social.

Viết mã html

Share Share Tweet Stumble Sạc Pin it LinkedIn BufferLưu ý là thẻ href=”#” bạn phải điền theo phần “Thêm links chia sẻ”.

Viết css

Đoạn mã css sâu dùng để đánh giá các nút ít chia sẻ mạng xã hội. Nút ít chia sẻ mạng xã hội đẹp nhất hay là không phụ thuộc vào phần css này.

Đoạn css cho những nút ít cần sử dụng phổ biến css

.button_mô tả display: block; float: left; padding: 10px 15px; border:none; background-color: #ececec; text-decoration: none; font-size: 18px; color: #FFF;.button_share:hover color: #efefef;Đoạn code css riêng rẽ mang lại từng nút ít đẻ sản xuất màu sắc riêng biệt.

.facebook background-color: #3b5998;.gplus background-color: #dd4b39;.twitter background-color: #55acee;.stumbleupon background-color: #eb4924;.pinterest background-color: #cc2127;.linkedin background-color: #0077b5;.buffer background-color: #323b43;

Thêm link phân tách sẻ

Bây giờ bọn họ bao gồm các nút chia sẻ mạng buôn bản hội sẽ chuẩn bị, câu hỏi có tác dụng hôm nay là thêm link share. Dưới đây danh sách mẫu links share cho các website mạng xã hội: Facebook , Google Plus , Twitter , Stumbleupon , Pinterest , LinkedIn và Buffer.

Xem thêm: Cách Xóa Tài Khoản Skype - Vĩnh Viễn Trên Máy Tính, Điện Thoại

quý khách copy đoạn mã theo cấu tạo sau vào phần thẻ HTML nghỉ ngơi trên thay thế sửa chữa cho lốt “#” nằm trong thẻ href=”#”.

Facebook

Link chia sẻ social facebook chỉ yên cầu url tức là link trên vị trí của website. Ví dụ trang cụ thể của một bài bác làm sao kia.


YOUR-URL - Địa chỉ của những website mà lại bạn có nhu cầu chia sẻhttp://www.facebook.com/sharer/sharer.php?u=YOUR-URLGoogle PlusMạng xóm hội Google Plus yên cầu cũng ko khó khăn nhưng mà chỉ việc chúng ta có links Có nghĩa là url.


YOUR-URL - Địa chỉ của những website mà bạn có nhu cầu phân tách sẻhttps://plus.google.com/share?url=YOUR-URLTwitterMạng thôn hội Twitter thì yên cầu chúng ta cần có url, title hoặc biểu đạt và mang được tài khoản username twitter. Thường Theo phong cách của thịnh thì dồn phần username twitter.


TWITTER-HANDLER - Twitter Usernamehttps://twitter.com/intent/tweet?text=YOUR-TEXT&url=YOUR-URL&via=TWITTER-HANDLERStumbleuponMạng thôn hội Stumbleupon cũng không thực sự khó khăn mà lại chỉ đòi hỏi title hoặc biểu lộ cùng mặt đường dẫn


YOUR-TITLE - Tiêu đề hoặc tế bào tảhttp://www.stumbleupon.com/submit?url=YOUR-URL&title=YOUR-TITLEPinterestMạng làng mạc hội hình họa Pinterest yên cầu đơn giản đó là links, diễn đạt cùng ảnh thay mặt đại diện.


YOUR-IMAGE-SOURCE - Đường dẫn link hình hình ảnh ( Features image )http://pinterest.com/pin/create/button/?url=YOUR-URL&description=YOUR-DESCRIPTION&media=YOUR-IMAGE-SRCLinkedInMạng làng hội LinkedIn thì yên cầu bạn không thực sự khó khăn.


YOUR-TITLE - Tiêu đề hoặc mô tảhttp://www.linkedin.com/shareArticle?mini=true&url=YOUR-URL&title=YOUR-TITLE&source=YOUR-URLBufferMạng làng mạc hộ Buffer cũng như như những mạng xóm hộ khác gần như nhân tự động hóa theo các thông số các bạn cần có.


YOUR-TEXT - Tiêu đề hoặc mô tảhttps://buffer.com/add?text=YOUR-TEXT&url=YOUR-URL

Tạo cửa sổ Popup share mạng buôn bản hội

Với hành lang cửa số Popup lộ diện thì bạn phải áp dụng cho đoạn mã jquery sau để có thể thêm bổ sung và những tùy lựa chọn trước lúc đăng lên mạng xã hội cơ mà bạn có nhu cầu share link.

Xem thêm: Chạy Adword Là Gì ? (Giải Thích Chi Tiết) Quảng Cáo Google Adwords Là Gì

bởi thế là dứt hoàn chỉnh

Kết luận

Cách chế biến ngơi nghỉ bài xích này hơi là dễ dàng cùng các bạn hoàn toàn rất có thể triển khai theo cũng như đổi khác theo ý thích và nó không sử dụng iframe giây tốn dung lượn sở hữu trang của website. Ngoài vấn đề thuộc phông awesome chúng ta có thể thực hiện thẻ img nhằm Hotline băng thông hình ảnh thay thế sửa chữa.