Showing posts with label Thủ Thuật Blogger. Show all posts
Showing posts with label Thủ Thuật Blogger. Show all posts

Thursday, April 26, 2012

,

Dropbox - Sao lưu trực tuyến với khả năng đồng bộ theo thời gian

Dropbox là dịch vụ sao lưu, lưu trữ dữ liệu trực tuyến với khả năng đồng bộ theo thời gian thực và tự động thực hiện sao lưu, hỗ trợ miễn phí 2GB dung lượng lưu trữ trực tuyến trên máy chủ của họ.

Đặt các tập tin của bạn vào trong Dropbox trên một máy tính nào đó và ngay lập tức, chúng sẽ xuất hiện trên bất kì các máy tính khác mà đã được cài đặt sẵn Dropbox của bạn (Windows, Mac, và Linux). Các tập tin này của bạn sẽ được Dropbox sao chép và lưu trữ trên các máy chủ an toàn của họ nên bạn cũng có thể truy cập vào chúng từ bất kì các máy tính hoặc các thiết bị di động khác của bạn thông qua trang web của Dropbox.
  • Với Dropbox, các tập tin của bạn luôn luôn được đồng bộ hóa
    Hãy nói rằng bạn đang chỉnh sửa một tài liệu ở nhà. Ngay sau khi bạn click vào nút “Save”. Dropbox sẽ đồng bộ hóa tài liệu đó với các máy tính khác của bạn một cách nhanh chóng và tự động. Dropbox mang đến cho bạn sự thoải mái để làm việc trên bất kỳ các máy tính của bạn và luôn luôn có các tập tin bạn cần.
  • Dropbox cho phép bạn chia sẻ tập tin một cách dễ dàng
    Bạn có thể dễ dàng chia sẻ toàn bộ thư mục hoặc các an-bum ảnh của bạn. Chỉ việc đặt các thư mục mà bạn muốn chia sẻ vào trong Dropbox của bạn rồi sau đó, gửi e-mail mời những người mà bạn muốn chia sẻ thư mục đó. Bạn cũng có thể gửi liên kết của những tập tin có trong Dropbox của bạn. Dropbox sẽ rất hoàn hảo cho những dự án cần hoạt động nhóm.
  • Với Dropbox, sao lưu trực tuyến là tự động
    Bất kì các tập tin mà bạn bạn đặt vào trong thư mục Dropbox sẽ được tự động sao lưu vào các máy chủ của họ. Thậm chí, nếu máy tính của bạn bị tan chảy thì các dữ liệu của bạn vẫn sẽ được lưu trữ an toàn trên Dropbox và có thể phục hồi lại chúng vào bất kì thời điểm nào mà bạn muốn
  • Dropbox cho phép bạn quay trở lại quá khứ để khôi phục những dữ liệu bị xóa hoặc bị thay đổi
    Mỗi khi bạn lưu một tập tin nào đó vào trong Dropbox, Dropbox sẽ đồng bộ nó với máy chủ an toàn của họ. Dropbox lưu giữ một lịch sử của những lần thay đổi do bạn thực hiện để bạn có thể hoàn tác lại bất kỳ sai lầm và thậm chí lấy lại được các tập tin đã bị xóa. Theo mặc định, Dropbox giữ 30 ngày lịch sử cho tất cả các tập tin của bạn.Dropbox cũng có một lựa chọn hoàn tác không giới hạn gọi là “Pack-rat”
  • Dropbox thay thế:
    • Việc đính kèm tập tin vào e-mail
    • Sử dụng ổ USB để di chuyển dữ liệu sang máy tính có nối mạng khác
    • … và nhiều hơn nữa


Các tính năng của Dropbox:
  • Đồng bộ hóa dữ liệu: Dropbox cho phép bạn đồng bộ hóa các dữ liệu lưu trữ trực tuyến với máy tính của bạn
    • 2GB dung lượng lưu trữ trực tuyến miễn phí, 100GB dung lượng lưu trữ trực tuyến cho khách hàng trả phí
    • Đồng bộ hóa tất cả các thể loại và kích thước của tập tin
    • Đồng bộ hóa cho các máy tính sử dụng hệ điều hành Windows, Mac và Linux
    • Tự động đồng bộ hóa khi có sự thay đổi được phát hiện
    • Làm việc với các tập tin trên Dropbox của bạn ngay cả khi bạn đang offline. Các dữ liệu của bạn sẽ được đồng bộ hóa ngay sau khi kết nối Internet được thiết lập lại
    • Đồng bộ hóa hiệu quả – Khi có sự thay đổi nào đó, Dropbox sẽ chỉ đồng bộ hóa phần bị thay đổi, không đồng bộ hóa tất cả dữ liệu – giúp tích kiệm thời gian của bạn
    • Không lấn chiếm quá nhiều băng thông kết nối internet của bạn, bạn có thể điều chỉnh giới hạn của băng thông bằng tay
  • Chia sẻ tập tin: Chia sẻ các tập tin của bạn một cách đơn giản nhất và có thể hoàn thành chỉ với vài click chuột
    • Shared folders cho phép một vài người có thể hợp tác sử dụng các tập tin có trong thư mục đó
    • Bạn có thể ngay lập tức thấy được sự thay đổi của các tập tin do người khác “gây ra”
    • Một thư mục “Public” cho phép bạn liên kết trực tiếp tới các tập tin trong Dropbox của bạn
    • Kiểm soát những người có thể truy cập vào các Shared folders (bao gồm cả khả năng để trục xuất người đó ra và loại bỏ các tập tin chia sẻ từ máy tính của họ)
    • Tự động tạo phòng trưng bày ảnh trực tuyến từ các thư mục hình ảnh trong Dropbox của bạn.
  • Sao lưu trực tuyến: Dropbox sao lưu các tập tin trực tuyến của bạn mà không cần bạn phải suy nghĩ về nó
    • Tự động sao lưu các tập tin của bạn
    • Khôi phục lại các tập tin và thực mục bị xóa
    • Khôi phục lại các phiên bản trước đó của tập tin của bạn
    • 30 ngày để quay trở về lịch sử, không giới hạn cho các tài khoản trả phí
  • Kết nối web: Một phiên bản sao chép các tập tin của bạn sẽ được lưu trữ lại tại máy chủ an toàn của Dropbox. Điều này cho phép bạn truy cập vào chúng từ bất kì máy tính hay các thiết bị di động khác của bạn một cách dễ dàng
    • Thao tác với các tập tin giống y như đang làm việc trên máy tính của bạn vậy – chỉnh sửa, xóa, đổi tên, di chuyển…
    • Hỗ trợ hộp tìm kiếm tập tin trên Dropbox
    • “Recent Events” cho phép bạn theo dõi các hoạt động gần đây nhất trên Dropbox của bạn
    • Tạo shared folders và mời những người xung quanh cùng sử dụng nó
    • Khôi phục lại các phiên bản trước của tập tin hoặc các tập tin đã bị xóa
    • Xem phòng trưng bày ảnh trực tuyến đã được tạo tự động từ những bức ảnh trong Dropbox của bạn
  • An toàn & Bảo mât: Dropbox đảm bảo nghiêm túc sự an ninh cũng như tính bảo mật cho các tập tin của bạn
    • Các Shared folder sẽ chỉ xem được khi bạn là người được mời sử dụng nó
    • Tất cả quá trình truyền tải dữ liệu tập tin và siêu dữ liệu sẽ được thực hiện trong một kênh được mã hóa (SSL)
    • Tất cả các tập tin được lưu trữ trên các máy chủ của Dropbox sẽ được mã hoá (AES-256) và không thể tiếp cận được nếu không có mật khẩu của bạn
    • Trang web và phần mềm của Dropbox được bảo vệ vững chắc nhằm chống lại các cuộc tấn công từ tin tặc
    • Các nhân viên của Dropbox không thể xem được bất kì các tập tin nào của người sử dụng
    • Kết nối trực tuyến đến các tập tin của bạn yêu cầu tên đăng nhập và mật khẩu của bạn
    • Các tập tin “Public” chỉ có thể xem được bởi những người có liên kết của tập tin đó. Các thư mục “Public” không có khả năng duyệt hoặc tìm thấy bởi những công cụ tìm kiếm
  • Kết nối các thiết bị di động: Ứng dụng Dropbox miễn phí cho iPhone, iPad, và Android cho phép bạn:
    • Truy cập vào Dropbox của bạn
    • Xem các tập tin trong ứng dụng
    • Tải các tập tin về để xem offline
    • Chụp ảnh và quay phim và đồng bộ hóa chúng với Dropbox của bạn
    • Chia sẻ các liên kết và tập tin có trong Dropbox của bạn
    • Xuất các tập tin của sang các ứng dụng khác
    • Đồng bộ hóa các tập tin đã được tải về để chúng được cập nhật
    • Cung cấp phiên bản web giành riêng cho các thiết bị di động: http://m.dropbox.com/
Các yêu cầu hệ thống của Dropbox:
  • Đối với máy tính sử dụng hệ điều hành Windows, Mac OS X, hoặc Linux:
    • Cần tối thiểu 512MB RAM
    • OS:
      • Windows XP, Windows Vista, và Windows 7 (32 và 64-bit)
      • Mac: OS X Tiger (10.4)+
      • Ubuntu 7.10+ và Fedora Core 9+
  • Đối với Dropbox website:
    • Internet Explorer 7+
    • Safari 3+
    • Firefox 3+
    • Opera 9+
  • Đối với các thiết bị di động:
    • iPhone:
      • iPhone (mọi phiên bản) hoặc iPod Touch with iPhone
      • iPhone OS v3.0+
      • Một Apple ID để kết nối vào App Store
    • Android:
      • Android OS 1.5 (Cupcake)+
      • 2MB dung lượng ổ cứng trống trên thiết bị
      • Một SD card
Hiện tại, Dropbox đang cung cấp cho người sử dụng 3 gói dịch vụ bao gồm:
  • Gói Basic: Đây là gói MIỄN PHÍ và có dung lượng lưu trữ trực tuyến trên máy chủ của Dropbox là: 2 GB
  • Gói Pro 50: Đây là gói TRẢ PHÍ với $9.99/tháng hoặc $99.00/năm và có dung lượng lưu trữ trực tuyến trên máy chủ của Dropbox là: 50 GB
  • Gói Pro 100: Đây là gói TRẢ PHÍ với $19.99/tháng hoặc $199.00/năm và có dung lượng lưu trữ trực tuyến trên máy chủ của Dropbox là: 100 GB
Còn chần chừ gì nữa, hãy đăng ký sử dụng ngay để có một dịch vụ lưu trữ miễn phí chất lượng cao
Publisher: Mr. Lucky - 8:01 PM

Wednesday, February 15, 2012

,

Gọi điện thoại miễn phí từ internet

1 Ngày gọi miễn phí được 3 phút, 1 tháng miễn phí 90 phút và 1 năm ( 12 tháng ) gọi miễn phí được 1080 phút đó bạn à. Bạn có muốn đăng ký ngay để gọi miễn phí không nào ?Vậy chúng ta bắt đầu nhé! ^_)
Hiện tại trang Tokiva.com có dịch vụ gọi điện thoại miễn phí cho tất cả các mạng di động trong và ngoài nước, từ di động cho đến điện thoại bàn. Điều hay nhất ở đây là bạn gọi bằng chính di động của bạn chứ không phải là dùng tai nghe để nói chuyện. Nếu bạn đăng ký miễn phí thì một ngày nó cho bạn free 3 phút liền. Và bạn muốn gia tăng số phút gọi của mình thì bạn phải giới thiệu càng nhiều thành viên đăng ký vào trang của nó thì số tài khoản của bạn ngày càng tăng đồng thời là số phút gọi của bạn ngày càng nhiều đó. Mỗi người bạn mời tham gia đăng ký theo tên của bạn sẽ có được +15 điểm trong tài khoản của bạn đó. tôi sẽ hướng dẫn các bạn gia tăng tài khoản vào mục dưới nhé.


Đăng ký Tài khoản :

Đầu tiên các bạn vào link sau: http://www.tokiva.com/để đăng ký một cái account free để có thế gọi ấy mà ==> sau đó nháy vô Sign up và điền đầy đủ thông tin như hình dưới đây nhé:

Sau khi bạn điền đầy đủ các thông tin và nhấn nút Submit thì sẽ có một bức thư gửi tơi địa chỉ thư mà bạn đã đăng ký đó ==> hãy truy cập địa chỉ thư đó để kích hoạt vào một đường dẫn mà nó gửi cho bạn để xác thực tài khoản của bạn. Thế là OK rồi đó.

Sau đó bạn mở hòm thư của bạn ra và nó sẽ gửi cho bạn một đường dẫn yêu cầu bạn nháy vô đó để xác nhận. Hãy nhấn vào đó để xác nhận, sau khi nhấn vào đó nó sẽ hiện ra trang đăng nhập tương tự .
Hãy nhấn vào Login sau khi nhấn vào login thì nó hiện ra cửa sổ sau :


Bạn hãy để ý chữ Choose a screen name for your Tokiva Link nhé : bạn hãy chọn một cái tên để nó hiện thị lên mà hình của mình : Ví dụ tôi chọn là Sunflower1509 đó nếu tên bạn chọn mà đã có người chọn rồi thì bạn hãy chọn tên khác nhé đến lúc nào nó chấp nhận được rồi thì thôi. Sau khi nó chấp nhận rồi thì sẽ có một cửa sổ mới :


Ở khung Please Select Country hãy chọn Vietnam (84 ) đó . Ô dưới thì hãy nhập số điện thoại của mình vào, nhớ rằng hãy bỏ số 0 ở đầu đi nhé .ví dụ số điện thoại của tôi là 0977811398 thì tôi nhập là 84977811398 sau đó nhấn Submit nhé. Thế là coi như hoàn thành rồi đó. quá dễ phải không


Cách gọi điện:

Sau khi đăng ký xong thì nó sẽ đưa bạn vào trang chủ để gọi. Tại Mục To bạn hãy nhập số điện thoại mà bạn muốn gọi tới ( bắt đầu là 84 nhé và cũng bỏ số 0 ở đầu đi )
Ví dụ:Bạn gọi cho tôi thì đánh 84977811398.

Nếu gọi vào số ĐT cố định thì 84+ Mã tỉnh+ Số
điện thoại. Ví dụ mình ở Phú Thọ thì gõ 84+210
Kích chuột vào "Call" ( hình có biểu tượng cái điện thoại đó )

Khi bạn kích chuột vào "Call" xong, ngay sau đó, bạn thấy điện thoại
của mình đổ chuông và hiện lên chính số mình muốn gọi gọi đến( thực tế
không phải như vậy vì trang web đang làm việc trung gian kết nối). Bạn
trả lời thì nghe thấy một vài câu tiếng Anh. Vài giây sau thì chuông
bên kia đổ. Họ nhấc máy là chúng ta bắt đầu nói chuyện.Bạn không phải
lo thời gian và thoải mái nói chuyện vì khi hết 3 phút. Cuộc gọi sẽ tự
kết thúc và có tiếng chào" Goodbye!". Chất lượng cuộc gọi cũng khá tốt.
Các bác yên tâm em thử rùi. Người nghe và gọi đều không bị mất tiền.
Bạn hãy để ý chữ màu xanh đó nhé: Please wait .... nghĩa của mấy câu đó là hãy đợi Tokiva kết nối tới bạn. Bạn có 3 phút cho cuộc gọi này . Lúc đó máy bạn sẽ đổ chuông và có một số máy nước ngoài hiện lên máy của bạn hãy bấm nút nghe , sẽ có mấy câu tiếng anh và sau đó bạn sẽ thấy tiếng đổ chuông của máy bên kia thế là bạn đã gọi được rồi đó.
=====Bạn hãy giới thiệu cho các thành viên khác trong và ngoài diễn đàn biết nhá====
(sưu Tầm)
Publisher: Mr. Lucky - 3:41 AM

Friday, December 23, 2011

Ẩn 2 cột sidebar và hiển thị cột sidebar thứ 3 khi xem bài viết (dùng cho template 3 cột)


Như theo yêu cầu, bài viết sẽ hướng dẫn làm ẩn 2 cột sidebar khi xem bài viết, thêm vào đó là tạo thêm 1 cột sidebar thứ 3 sẽ hiển thị bên phải, còn phần bài viết bên trái. Và cột sidebar thứ 3 này sẽ chỉ hiện thị duy nhất ở trang bài viết mà thôi. Hay nói cách khác, cột sidebar thứ 3 này và 2 cột sidebar cũ sẽ không thể hiện thị cùng 1 lúc.

Có thể nói thủ thuật này là 1 thủ thuật thay đổi bố cục blog theo trang, với trang bài viết thì sẽ hiển thị dạng template 2 cột, còn ở các trang khác trang bài viết sẽ hiển thị dạng 3 cột. Và ta có thể xem đây là 1 template 4 cột, và ta chỉ thấy được điều này trong Bố cục » Phần tử trang.


Đây là hình ảnh minh họa thủ thuật

Giả sử ta có 1 template có các phần main, sidebar1, sidebar2 có tên tương ứng là : main-wrapper, newsidebar-wrapper, sidebar-wrapper (do là thủ thuật yêu cầu của bạn HC, nên mình lấy tên các id này trùng với các id trong code template của bạn HC)

Bây giờ ta vào Bố cục » Chỉnh sửa code HTML (không cần nhấp chọn mở rộng mẫu tiện ích), và tìm các đoạn code CSS và HTML của 3 phần trên, nó sẽ trông như bên dưới:
Code CSS:

#main-wrapper {
background: #ffffff;
width: 540px;
margin-left: 10px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper {
background: #77aa77;
-moz-border-radius-bottomleft:15px; -moz-border-radius-bottomright:15px; -moz-border-radius-topleft:15px; -moz-border-radius-topright:15px;
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float*/
}

#newsidebar-wrapper {
background: #77aa77;
-moz-border-radius-bottomleft:15px; -moz-border-radius-bottomright:15px; -moz-border-radius-topleft:15px; -moz-border-radius-topright:15px;
width: 220px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Code HTML:

<div id="newsidebar-wrapper">
<b:section class="sidebar section" id="newsidebar" preferred="yes">
...
...
...
</b:section>
</div>

<div id="main-wrapper">
<b:section class="main section" id="main" preferred="yes">
...
...
...
</b:section>
</div>

<div id="sidebar-wrapper">
<b:section class="sidebar section" id="sidebar" preferred="yes">
...
...
...
</b:section>
</div>


☼ Bây giờ ta bắt đầu thủ thuật (Lưu ý save template lại trước khi thực hiện - nếu cho chắc chắn hãy tạo 1 blog mới và test trước khi thực hiện với blog của mình)
A. Bước 1 : chỉnh sửa code CSS
- ở bước này ta sẽ có 2 điều phải làm, 1 là thay đổi style cho phần main khi hiển thị ở trang bài viết, và tạo 1 đoạn code CSS mới cho cột sidebar thứ 3
- Với đoạn code CSS ở trên, ta sẽ xóa phần code CSS của main (phần code bị xóa này sẽ được chỉnh sửa thêm và dán vào bên dưới sau dòng code ]]></b:skin>) và tạo thêm code CSS cho cột sidebar thứ 3. Ta sẽ đặt tên cho nó là rightsidebar-wrapper và code CSS sẽ trông như bên dưới:

#sidebar-wrapper {
background: #77aa77;
-moz-border-radius-bottomleft:15px; -moz-border-radius-bottomright:15px; -moz-border-radius-topleft:15px; -moz-border-radius-topright:15px;
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float*/
}

#newsidebar-wrapper {
background: #77aa77;
-moz-border-radius-bottomleft:15px; -moz-border-radius-bottomright:15px; -moz-border-radius-topleft:15px; -moz-border-radius-topright:15px;
width: 220px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#rightsidebar-wrapper {
background: #77aa77;
-moz-border-radius-bottomleft:15px; -moz-border-radius-bottomright:15px; -moz-border-radius-topleft:15px; -moz-border-radius-topright:15px;
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float*/
}

- Như vậy đã tạo xong code CSS cho cột thứ 3, bây giờ ta tùy chỉnh CSS cho phần main, hãy dán đoạn code bên dưới vào trước dòng code ]]></b:skin>

<style>

<b:if cond='data:blog.pageType == "item"'>
#main-wrapper {
background: #ffffff;
width: 760px;
margin-left: 10px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
<b:else/>
#main-wrapper {
background: #ffffff;
width: 540px;
margin-left: 10px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
</b:if>

</style>

- Chú ý đoạn code màu đỏ :
+ width: 760px; : đây là độ rộng của phần main khi hiển thị ở trang bài viết (các bạn có thể bỏ dòng code này, tức là không gán độ rộng cho nó). Giá trị này được tính bằng (540px + 220px + 220px) - 220px = 760px, tức là độ rộng của 3 cột ban đầu trừ đi độ rộng của cột sidebar thứ 3 được thêm vào.
+ width: 540px; : đây là độ rộng của phần main khi hiển thị ở các trang khác trang bài viết.

Như vậy đã xong phần code CSS, bây giờ ta sang phần Code HTML của các phần

B. Bước 2 : thêm cột thứ 3 vào trong code template .
- Tiếp tục ở bước 1 (bước 1 vẫn chưa save template) tiếp tục xuống phía dưới, ta sẽ thấy code HTML như bên dưới :

<div id="newsidebar-wrapper">
<b:section class="sidebar section" id="newsidebar" preferred="yes">
...
...
...
</b:section>
</div>

<div id="main-wrapper">
<b:section class="main section" id="main" preferred="yes">
...
...
...
</b:section>
</div>

<div id="sidebar-wrapper">
<b:section class="sidebar section" id="sidebar" preferred="yes">
...
...
...
</b:section>
</div>

- Và ta thay đổi nó như bên dưới :

<b:if cond='data:blog.pageType != "item"'>
<div id="newsidebar-wrapper">
<b:section class="sidebar section" id="newsidebar" preferred="yes">
...
...
...
</b:section>
</div>
</b:if>

<div id="main-wrapper">
<b:section class="main section" id="main" preferred="yes">
...
...
...
</b:section>
</div>

<b:if cond='data:blog.pageType != "item"'>
<div id="sidebar-wrapper">
<b:section class="sidebar section" id="sidebar" preferred="yes">
...
...
...
</b:section>
</div>
</b:if>

<b:if cond='data:blog.pageType == "item"'>
<div id="rightsidebar-wrapper">
<b:section class="sidebar section" id="rightsidebar" preferred="yes">

</b:section>
</div>
</b:if>

- Đoạn code màu cam là code của cột sidebar thứ 3
- Các đoạn code màu đỏ là để thiết lập bố cục hiển thị của blog ở các trang.


C. Bước 3: cuối cùng là save template.

Publisher: Mr. Lucky - 12:24 AM

tạo button cho phép bạn ẩn/hiện nội dung

Chỉ với 1 dòng lệnh kết hợp với các thẻ div là bạn có thể tạo 1 button cho phép ẩn hiện nội dung của bạn khi click vào nó. Thủ thuật này mình post theo yêu cầu của bạn mecuoi (mecuoi.com). Thủ thuật này ta thường thấy trong các forum, và bạn mecuoi cũng lấy ý tưởng từ đó.


Demo:
Phần nội dung hiển thị

Code:



Phần nội dung hiển thị
<div>
<div>
<input type="button" value="Xem" style="width:75px;font-size:10px;margin:0px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Ẩn'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Xem'; }">
</div>
<div>
<div style="display: none;">
{Phần nội dung bị ẩn}
</div>
</div>
</div>

- Khi các bạn muốn áp dụng cho bài viết của mình thì cứ việc thay thế dòng {phần nội dung bị ẩn} thành nội dung bài viết của bạn là xong.
- Nếu bạn muốn tạo nhiều nút Ẩn/Hiện trong bài viết của mình thì cứ làm tương tự.

Publisher: Mr. Lucky - 12:20 AM

Thủ thuật cho phép hiển thị widget ở nhưng trang nhất định trong blog

Để tạo nên sự riêng biệt cho một số trang nào đó cho blog của mình, bạn có thể tạo 1 widget và chỉ cho nó hiển thị ở trang đó. ( ví dụ : tạo một widget gallery ảnh chỉ cho phép hiển thị khi ta tìm tới nhãn picture..., hoặc chỉ cho phép những widget nào đó chỉ được phép hiển thị ở trang chủ ). Bài viết này sẽ hướng dẫn các bạn làm điều này.

Trước tiên, bạn phải biết rõ vị trí code của các widget trong code template. Để xác định việc này, bạn phải xác định được ID của các widget đó, và việc này cũng rất đơn giản, ví dụ : ta có tiện ích(widget) "Người theo dõi" (xem hình minh họa bên dưới)


Bạn nhấp chọn "Chỉnh sửa" sẽ hiện ra hộp thọai như bên dưới:


Phần khoanh tròn màu đỏ chính là ID của widget. Như vậy ta đã xác định được id của nó, bây giờ vào code template để xác định vị trí của nó (xem hướng dẫn bên dưới)

☼Xác định code của widget trong code template:
1. Đăng nhập blog
2. Vào chỉnh sửa code HTML(edit code HTML), chọn mở rộng mẫu tiện ích(Expand Widget Templates).
3. Tìm đọan code như bên dưới, nó chính là code của widget "Người theo dõi" (có thể nhấn Ctrl +F rồi điền từ khóa "Followers2" để tìm).


Khi đã xác định được code của 1 widget, bây giờ ta bắt đầu vào thủ thuật, để đơn giản ta xét code của 1 widget HTML/Javascript (như bên dưới):



<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>


<b:include name='quickedit'/>
</b:includable>
</b:widget>


A. Chỉ cho phép widget hiển thị ở trang chủ:
- Bạn thêm đọan code màu đỏ như bên dưới

<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:if>

</b:includable>
</b:widget>


B. Chỉ cho phép widget hiển thị ở từng bài viết:
- Bạn thêm đọan code màu đỏ như bên dưới

<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>

<b:if cond='data:blog.pageType == "item"'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:if>

</b:includable>
</b:widget>


C. Chỉ cho phép widget hiển thị ở những trang nhất định:
- Bạn thêm đọan code màu đỏ như bên dưới

<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>

<b:if cond='data:blog.url == "BLOG_POST_URL"'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:if>

</b:includable>
</b:widget>

Publisher: Mr. Lucky - 12:20 AM

Thursday, December 22, 2011

Bài viết liên quan kèm ảnh cho blogger

Chắn hẳn bạn từng biết qua tiện ích Bài viết liên quan có ảnh đại diện của Linkwithin. Tính năng của tiện ích này là hiển thị các bài viết liên quan đến một chủ đề với ảnh đại diện và tiêu đề bài viết. Tuy nhiên có một điểm mà mình cho rằng sẽ gây khó chịu cho những blogger khó tính nhất, đó là liên kết Linkwithin hiển thị ngay trên tiện ích. Đây được xem là một kiểu quảng cáo.


Bài viết này giới thiệu về tiện ích Bài viết liên quan ngẫu nhiên có ảnh đại diện (Random Related Posts with Thumbnail) hiển thị 4 bài viết ngẫu nhiên liên quan đến một nhãn cho bài viết, gồm ảnh đại diện, tiêu đề bài viết và phần tóm tắt bài viết. Điểm đặc biệt của tiện ích này là: nếu bài viết không có ảnh đại diện thì sẽ hiển thị ảnh đại diện mặc định, nếu bài viết không có ảnh đại diện mà thuộc các nhãn như Blogger, CSS, HTML, JavaScript, Jquery, Facebook, Twitter thì sẽ hiển thị ảnh đại diện mặc định được gán sẵn cho các nhãn đó.

Để cài đặt tiện ích này, bạn hãy thực hiện theo các bước sau đây.

Bước 1. Đăng nhập Blogger, vào Design >> Edit HTML, chọn Expand Widget Templates.

Thêm đoạn code dưới đây vào trước thẻ </head>.

/* Random Related Posts with Thumbnails Widget by Huynh Nhat Ha */
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#rdrelatedposts {}
#rdrelatedposts h2{height:25px;color:blue;font-size:15px;font-weight:bold;font-family:Arial,Tahoma,Times New Roman,serif;margin:0px 4px 0;margin-top:4px;padding:0 0 5px}}
.relaposts {float:left;height:200px;margin:0 5px;overflow:hidden;padding:5px;text-align:center;width:130px;}
.relaposts:hover {background-image: -moz-linear-gradient(100% 100% 90deg, #303941, #101921);background-image: -webkit-gradient(linear, left bottom, left top, from(#303941)), to(#101921));filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#FF101921', EndColorStr='#FF303941');}
.relaposts a {color:#a52a2a !important;display:inline;font-family:Arial;font-size:12px;line-height:1;}
.relaposts img {-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;-moz-box-shadow: 0 0 20px #444 inset;-webkit-box-shadow:0 0 20px #444 inset;box-shadow:0 0 20px #444 inset;height:72px;padding:5px;width:72px;}
.relaposts h6 {display:table-cell;height: 5em;margin:5px 0 0;overflow:hidden;padding-bottom:2px;vertical-align:middle;width:130px;}
.relaposts p {border-bottom:1px dotted #555;border-top:1px dotted #555;color:#AAA;font-size:11px;height:4em;line-height:1;margin:5px 0 0;overflow:hidden;padding:5px 0;text-align:justify;}
</style>
<script src='http://hacodeproject.googlecode.com/files/randomrelaposts.js' type='text/javascript'/>
</b:if>

Nếu bạn rành về CSS thì có thể điều chỉnh một số thuộc tính CSS trong đoạn code ở trên. Chú ý đoạn code trên dùng cho Template có phần post-body với chiều rộng là 600px, tùy thuộc vào bề rộng của phần post-body trong Template của bạn mà chỉnh tham số width:130px trong dòng code được đánh dấu màu đỏ cho phù hợp.

Bạn nên tải về file randomrelaposts.js để upload lên host sử dụng cho blog của bạn để tránh hạn chế băng thông do dùng chung file.


Bước 2. Tìm dòng <div class='post-footer-line post-footer-line-3'> rồi đặt trước nó với toàn bộ đoạn code dưới đây.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='rdrelatedposts'>
<h2>Bài viết liên quan</h2>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=readpostlabels&amp;max-results=100&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>displayrelatedposts();</script>
</div>
<div style='clear:both;'></div>
</b:if>

Bước 3. Bước sau cùng nhưng không kém phần quan trọng là Lưu Template.Chúc bạn thành công nhé!
Publisher: Mr. Lucky - 11:19 PM