Thêm icon mạng xã hội vào WordPress

Thêm icon mạng xã hội vào WordPress

1. Cách thêm icon mạng xã hội WordPress

Có 2 cách để bạn làm vậy: thêm icon mạng xã hội thủ công hoặc sử dụng plugin WordPress để thêm.

Nếu bạn muốn sử dụng plugin, đây là danh sách plugin mạng xã hội cho WordPress bạn nên dùng:

Sử dụng plugin rất đơn giản cho người mới bắt đầu vì nó không đòi hỏi bạn biết lập trình. Tuy nhiên, hầu hết chúng không có hỗ trợ mạng xã hội không nổi tiếng. Nếu bạn không tìm thấy mạng xã hội bạn cần với plugin, bạn sẽ cần đặt icon mạng xã hội thủ công.

A. Chọn một icon mạng xã hội

Để xử lý bạn chỉ cần tìm ảnh không đòi hỏi bản quyền. Vào Google chọn: Images -> Tools -> Usage rights -> Labeled for reuse.

tim-anh-cho-phep-su-dung-khong-ban-quyen

Giờ, Google sẽ chỉ hiện các kết quả miễn phí. Bạn có thể chọn icon bạn thích, hoặc tải một gói icon về. Một số website cũng có tính năng tương tự, như Iconfinder, cho phép bạn tải một gói icon mạng xã hội miễn phí.

Sau khi đã tìm được biểu tượng cần thiết, tải chúng và upload vào WordPress media library. Vào Media -> Add
New, tải những icon đó lên.

2. Thêm Widget và cấu hình HTML

Giờ, bạn cần có widget để chứa icon mạng xã hội.

Trên trang quản lý WordPress, chuyển tới Customizer -> Widgets. Sau đó, thêm “Custom HTML” bằng cách kéo thả vào mục header, sidebar, hoặc footer.

Đặt tiêu đề của Custom HTML là “Social Media”, dán đoạn code sau vào:
<div><a href=”http://instagram.com/username”><img style=”margin:5px” src=”[đường dẫn tới icon]” width=”30″ height=”30″ alt=”Instagram”></a><a href=”http://facebook.com/username”><img style=”margin:5px” src=”[đường dẫn tới icon]” width=”30″ height=”30″ alt=”Facebook”></a><a href=”http://youtube.com/user/username” ><img style=”margin:5px” src=”[đường dẫn tới icon]” width=”30″ height=”30″ alt=”YouTube”></a></div>

Bạn cần thay tên của bạn ở chỗ username và copy đường dẫn URL của icon của bạn dán vào chỗ dấu ngoặc vuông [đường dẫn tới icon].

Vào Media -> Library rồi click vào icon bạn vừa upload. Tìm vị trí cột URL. Đó là đường dẫn bạn cần copy và dán vào chỗ dấu ngoặc vuông ở trên ở trong custom html

Sau khi bạn đã hoàn tất đặt code, nhấn vào nút Save. Chuyển tới website của bạn và xem kết quả.

footer-social-media

Giờ bạn đã thành công thêm logo mạng xã hội vào website, bạn có thể lặp lại quá trình này để thêm nhiều logo nữa. Nó rất đơn giản và không tốt nhiều thời gian, nhưng lại có thể tăng tính tương tác của website của bạn.