Hiện nay Facebook một nguồn giúp tăng lưu lượng truy cập cho các
web/blog. Đây là lý do tại sao các quản trị web tập trung nhiều hơn tới
các liên kết trang web của họ với các Plugins của Facebook.Tuy nhiên, có một yêu cầu là làm
thế nào để tạo một thư viện ảnh từ Facebook với Jquey cho Blogger? Hôm
nay, trong bài viết này tôi sẽ chia sẻ các bạn làm thế nào để tạo
một thư viện ảnh từ Facebook với Jquey cho Blogger mà không cần phải
truy cập vào trang blog của bạn (How to Create a jQuery Facebook Photo Gallery in Blogger).
 |
| Ảnh minh họa |
» JQuery Facebook Photo Gallery cho Blogger là gì?
Plugin này phát triển bởi mybloggerlab cho
phép bạn xem và truy cập vào tất cả các Album chứa các hình ảnh trên
trang Facebook của bạn ngay trên trang web của bạn mà không phải truy
cập vào trang Facebook của bạn. Nó có thể truy cập tất cả các album công
cộng (puplish) của bạn, nhưng nó chỉ hoạt động với Facebook
Fanfage. Nó cho phép bạn tự do loại trừ bất kỳ album nào mà bạn không
thích. Toàn bộ hệ thống hoạt động trên jQuery, vì vậy bạn có đủ lựa chọn
để tùy chỉnh nó theo cách bạn muốn.
Bạn có thể xem demo bên dưới:VIEW DEMO
Trên đó, bạn có thể xem các hình ảnh trên trang trên facebook trong trang web của bạn thông qua chức năng Lightbox. Bạn có thể duyệt các album khác nhau và có thể quay trở lại nơi từ nơi bạn bắt đầu.
» Làm thế nào để thêm thư viện ảnh từ Facebook Page với Jquery cho blogger?
1- Đăng nhập vào Blogger.
2- Chọn mẫu (Template).
3- Sao lưu mẫu của bạn để đề phòng sảy ra lỗi khi áp dụng thủ thuật này.
4- Nhấp chọn vào Chỉnh sửa HTML (Edit HTML).
5- Thêm đoạn code bên dưới vào trước thẻ đóng </head>
<link media="all" href="http://fonts.googleapis.com/css?family=Shadows+Into+Light" rel="stylesheet" type="text/css" /> <link media="all" href="https://googledrive.com/host/0B-vz7n1QSdEfWE1Wbmxtc2FYN1k" rel="stylesheet" type="text/css" /> <!-- Scripts --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script type="text/javascript" src="https://googledrive.com/host/0B-vz7n1QSdEfRkNxSXVfYjlRU3c"></script> <script type="text/javascript" src="https://googledrive.com/host/0B-vz7n1QSdEfUDFxcEpsM1ZSTjQ"></script> <script type="text/javascript" src="https://googledrive.com/host/0B-vz7n1QSdEfaHU3dTFPallrU1E"></script> <script type="text/javascript" src="https://googledrive.com/host/0B-vz7n1QSdEfUFhSTlNaaU5tTkE"></script> <script type="text/javascript" src="https://googledrive.com/host/0B-vz7n1QSdEfeVlQNnBDZGhtXzQ"></script>
- Để dùng thủ thuật này lâu dài bạn hãy tải các file CSS và Javascripts bên trên về Tại đây và Upload lên host riêng nha. Nếu chưa có host bạn có thể dùng host miễn của Google Drive .
6- Lưu mẫu lại và tiến hành các bước tiếp theo.» Xác định ID trang facebook của bạn.
7. Bây giờ để tọa một thư viện ảnh bạn phải xác định được ID hồ
sơ trang Facebook của bạn. Nếu chưa biết bạn có thể dùng công cụ sau: http://findmyfacebookid.com/
- Hãy nhớ ID mà bạn lấy được vì nó sẽ cần thiết cho bước tiếp theo.
» Tạo trang thư viện ảnh của bạn.
8. Tiếp theo là chọn vị trí để đặt thư viện ảnh của bạn. Bạn có
thể đặt trong một tiện ích HTML/Javascripts, trong một bài viết hay
trong một trang của bạn. Trng bài viết này mình sẽ hướng dẫn các bạn đặt
trong một trang của blogspot với các trang khác các bạn làm tương tự.
- Vào Trang (Page) => Chọn Trang mới (New page)=> Trang trống (Page Blank) và dán đoạn code bên dưới vào nha:
<script>
$(document).ready(function ($) {
$('#FB_Album_Frame').FB_Album({
facebookID: 'Your-Page-ID',
responsiveGallery: false,
fixedWidth: 980
});
});
</script>
<div id="FB_Album_Frame"></div>
Tùy chỉnh:
- Thay Your-Page-ID thành ID trang Facebook mà bạn đã xác đinh được ở trên bước 7.
- fixedWidth: 980 là độ rộng trang thư viện ảnh của mình chỉnh lại 980 cho phù hợp với trang web của bạn tránh tình trạnh ảnh tràn ra khỏi khung bài viết nha.
9- Giờ thì xuất bản trang của bạn và xem thành quả nha.
Hy vọng qua bài viết này bạn sẽ hiểu cách làm thế nào để tạo một trang thư viện ảnh từ trang facebook của bạn vào blog. Hãy cho mình biết nếu bạn gặp bất cứ khó khăn gì khi áp dụng thủ thuật này nha.
Bài viết được chia sẻ từ BlogNamkna
