Chủ Nhật, 25 tháng 11, 2012

cách tạo gestbook trên blogspot



Đây là 1 trong các bước tiến hành để đem giao diện Multiply với 1 Guestbook hiện đại hơn vào Blogspot. Hiện tại, đa số người dùng Multiply khi chuyển qua Blogspot đã cảm thấy bất tiện khi thiếu mất trang Guestbook (hay còn gọi là trang Quick Comments) vốn được xem như phòng tiếp khách của dân Multiply. Nhiều người đã chọn giải pháp là chèn các hộp Chatbox như của Cbox hay 1 vài dịch vụ tương tự để thay thế, tuy nhiên hầu hết các dịch vụ này có những hạn chế nhất định của nó gây khó chịu cho người dùng miễn phí như giới hạn số từ trong 1 comment, khó quản lý, thiếu khả năng tùy biến...


Điều này khiến mình nảy ra 1 ý định là làm sao để dùng chính khung comments của Blogspot để tạo thành 1 trang Guestbook, như vậy vừa đảm bảo tính đồng bộ, vừa đơn giản hơn trong quản lý và tùy biến được các comment với mọi chức năng mà hệ thống comments của Blogspot đem lại.

Tuy nhiên, từ sau khi Blogspot nâng cấp hệ thống Comments sử dụng Threaded Comments thì khả năng tùy chỉnh của nó đã khó khăn hơn, và hiện tại mình chưa tìm ra cách để thay đổi vị trí giữa Comment-Form và Comment-Block, cũng như cách sắp xếp Comments theo thứ tự mong muốn. Vì vậy, mình hướng tới 1 giải pháp thay thế khác trong khi giai pháp chính còn bế tắc đó là thông qua sự giúp đỡ của hệ thống Comments Disqus. Disqus là 1 hệ thống comments mạnh mẽ, nhiều tính năng tốt và việc quản lý cũng ổn định đã được rất nhiều blog là website ứng dụng, vì vậy ta có thể yên tâm về chất lượng của nó.

Tóm tắt sơ lược:

  1. Bạn cần tạo 1 trang blogspot mới, trang này chỉ phục vụ cho việc tạo Guestbook mà thôi. VD trang của bạn là xyz.blogspot.com, thì bây giờ tạo thêm 1 trang mới là guestbook-xyz.blogspot.com
  2. Tạo 1 tài khoản Disqus để sử dụng hệ thống comments này.
  3. Tắt hệ thống comments mặc định của Blogspot trên trang mà bạn muốn sử dụng Disqus. (Bắt buộc) VD ở đây là trang guestbook-xyz.blogspot.com
  4. Chèn hệ thống comments Disqus vào trang blogspot đó.
  5. Tùy chỉnh giao diện trang Blogspot đó để nhìn giống 1 trang Guestbook.
  6. Chèn trang Guestbook này vào 1 tiện ích và đặt nó lên trang chủ của trang Blogspot chính xyz.blogspot.com.
  7. Thiết lập thuộc tính chỉ hiển thị tiện ích này trên Trang chủ.
  8. Hoàn thành và tận hưởng.
Sau đây là các bước tiến hành:

1. Trước tiên, bạn truy cập vào trang Disqus.com, giao diện như trong hình:

2. Nhấn vào nút  Get this on your site  để đăng ký tài khoản.

3. Khai báo các thông tin, chỗ Site URL bạn điền địa chỉ Blogspot của mình vào. Sau khi hoàn tất điền thông tin thì nhấn  Continue  để đi tiếp. Bạn sẽ được chuyển đến trang quản lý tài khoản Disqus của mình.

4. Vào Email mà bạn đã đăng ký lúc nãy để kích hoạt tài khoản Disqus. Sau khi kích hoạt xong bạn sẽ nhận được thông báo:

5. Bây giờ quay trở lại trang Admin để tùy chỉnh 1 số chi tiết tài khoản của mình. Nhấn chọn Edit Profile:

6. Tại cửa sổ mở ra sẽ cho phép bạn tùy chỉnh các thông tin như Profile, Avatar, Services, Notifications, Account và Applications.

7. Tab Moderate sẽ là nơi để bạn quản lý hệ thống comment của mình. Điểm đáng giá của hệ thống này là nó cho bạn kiểm soát toàn bộ các comments được đăng tải bằng tài khoản Disqus của mình trên tất cả các trang web, blog sử dụng Disqus chứ không riêng gì trên blog bạn. Ngoài ra bạn còn có thể share các comments của mình lên Facebook, Twister,... để thu hút thêm lượng truy cập.

8. Tab Tools đem đến cho bạn 1 công cụ để nhập các comments trước đây của mình từ hệ thống comments của Blogspot vào Disqus nhằm quản lý dễ dàng hơn cũng như nếu blog bạn chuyển qua dùng Disqus thì các comments cũ này cũng sẽ được hiện ra. Và nó cũng không thiếu công cụ để xuất các comments của bạn về lại hệ thống comments cua Blogspot khi bạn có ý định thôi dùng Disqus. Các tiện ích này là thứ mà những dịch vụ chatbox như Cbox không hỗ trợ.

9. Làm tuần tự các bước và bạn sẽ sao lưu được toàn bộ những comments trước đây của mình vào Disqus. Và chức năng Sync New Comments cũng cho phép bạn đồng bộ hóa hệ thống comments của Disqus với Blogspot, đảm bảo rằng comments của bạn sẽ không bị mất.

10. Bây giờ, từ trang Settings, bạn truy cập vào tab General để tùy chỉnh 1 vài thứ về bảo mật và e-mail thông báo.

11. Bây giờ, bạn quay trở lại trang chủ Blogger của mình, tạo thêm 1 trang blog mới chẳng hạn như guestbook-bongnguoilangle.blogspot.com. Sau đó bạn truy cập vào trang Blogspot mới này, vào Thiết kế => Cài đặt => Bài đăng và nhận xét để tắt hệ thống Comments của Blogspot đi.

12. Lưu cài đặt.

13. Bây giờ bạn quay trở lại với trang Settings của Disqus khi nãy và nhấn Install để cài đặt hệ thống Disqus vào trang blogspot của mình.


14. Chọn  Blogger  và add tài khoản Disqus của bạn vào.


15. Nhấn  Thêm tiện ích .

16. Trở lại trang Thiết kế của Blogspot, kéo tiện ích Disqus này xuống ngay bên dưới Khung bài viết.


17.  Lưu sắp xếp .

18. Vào trang Guestbook vừa áp dụng Disqus, tạo 1 bài đăng mới (chẳng hạn như Bóng Người Lặng Lẽ's Guestbook) với nội dung để trống. Ghi nhớ đường link của bài đăng này (có thể copy ra Notepad hoặc Word để sẵn đó).

19. Tiến hành giấu 1 số thành phần của trang blog này để được giao diện như 1 trang Guestbook.
     - Vào Thiết kế => Mẫu => Tùy chỉnh => Bố cục => Chọn bố cục đơn, không có Sidebar.
     - Tiến hành giấu NavbarFooterthanh Status Message Barthanh điều hướng bài đăngmục đăng ký các bài đăng Atom.
a/ Giấu thanh NavbarFooter, thanh Status Message Bar và mục đăng ký bài đăng Atom:
- Vào Thiết kế => Chỉnh sửa HTML
- Dán code sau vào ngay trước thẻ ]]</b:skin>
#navbar { display: none; } 
#footer-3{ display: none !important; } 
.status-msg-wrap{display:none !important;} 
.posts-feeds, .feed-links {display:none !important;visibility:hidden !important} 
b/ Giấu thanh điều hướng bài đăng cũ hơn, bài đăng mới hơn:
- Vào Thiết kế => Chỉnh sửa HTML
- Tìm đến dòng #blog-pager { (hoặc .blog-pager { tùy theo Template) và thêm lệnh display:none; vào ngay bên dưới nó.
#blog-pager { display:none; text-align:center; } 
 Lưu mẫu .

20. Tiếp tục vào Thiết kế => Chỉnh sửa HTML, tìm đến thẻ body { và chèn đoạn code sau vào ngay bên dưới nó
position: relative; top: -280px; left: -33px; 
Với top: -280px; là giá trị hiển thị phần đầu trên của blog và left: -33px; là hiển thị bên trái blog. Chỉnh lại giá trị top: -280px; này sao cho khung Guestbook nằm ngay đầu trang blog như trong hình. Kiểm tra bằng cách truy cập vào link bài viết Bóng Người Lặng Lẽ's Guestbook đã được lưu lại ở trên.

21. Truy cập vào trang Blogspot chính của bạn, vào Thiết kế => Bố cục => Thêm tiện ích => HTML/Javascript và chèn đoạn code bên dưới vào phần nội dung tiện ích.
<iframe src="http://gb-bongnguoilangle.blogspot.com/2012/11/guestbook.html" style="border:0; overflow:no" scrolling="0" frameborder="0" width="100%" height="600px"></iframe> 
Thay link http://gb-bongnguoilangle.blogspot.com/2012/11/guestbook.html thành đường link đến bài viết mà mình đã dặn các bạn copy ra Notepad để sẵn đó.
height="600px" là chiều cao của tiện ích, bạn chỉnh lại theo ý muốn.

22. Lưu tiện ích và quan sát. Nếu thấy chiều rộng khung tiện ích Guestbook này chưa được như ý thì các bạn vào phần thiết kế của trangguestbook-xyz.blogspot.com để chỉnh lại độ rộng của trang này. Điều chỉnh giá trị left: -33px; ở bước 20 để có được khoảng hiển thị bên trái như ý.

23. Thiết lập thuộc tính chỉ hiển thị tiện ích này trên Trang chủ theo thủ thuật sau: Hiển thị widget chỉ ở trang chủ hoặc trang riêng biệt trong Blogspot

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

3 nhận xét:

kiepluuday nói...

Chào bạn Aquapham , hôm nay Chúa nhật mình mới có thời giờ ghé qua nhà mới của bạn , nhà đẹp quá ! Và may quá chủ đề này mình cũng đang cần tìm học hỏi . mình cũng đang cần học nơi aquapham nhiều cái nữa , mong bạn có cái gì hay hay thì Post lên đây cho mình và các bạn Blog học nhé !
Thân thương !

kiepluuday nói...

Chào bạn , hôm nay Chúa nhật mình mới có thời giờ ghé qua nhà mới của bạn , nhà đẹp quá ! Và may quá chủ đề này mình cũng đang cần tìm học hỏi . mình cũng đang cần học nơi aquapham nhiều cái nữa , mong bạn có cái gì hay hay thì Post lên đây cho mình và các bạn Blog học nhé !
Thân thương !

Nặc danh nói...

Do you mind if I quote a couple of your articles as long as I
provide credit and sources back to your blog? My website is in the very same niche as yours and my users would genuinely benefit from a lot of the information
you present here. Please let me know if this okay with you.
Regards! mature dating
Also see my page > free dating