Chia header thành 2 phần

Kể từ khi đưa vào sử dụng Template Designer mã nguồn mẫu do Blogger đề xuất đã thay đổi rất nhiều so với những mẫu được sử dụng trước đó. Nhiều thành phần mới được thêm vào và việc tùy biến giao diện đòi hỏi phải công phu hơn nhưng không có nghĩa là không làm được.

Bài viết này hướng dẫn cách chia thành phần header (đầu) thành hai phần khác nhau, giúp bạn có thể đặt chỗ cho một logo bên trái và treo thêm một banner bên phải.

Mặc định phần đầu của Blogger chỉ chứa tên blog và miêu tả về blog nằm ngang trên cùng. Công việc của chúng ta là "cắt" phần đầu này ra làm hai.

Ở đây xin lấy mẫu SIMPLE đầu tiên làm ví dụ minh họa.

Bước 1. Đăng nhập Blogger, tại thẻ Design (Thiết kế) | Edit HTML (Chỉnh sửa HTML) tìm đoạn code sau đây:

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Thủ Thuật Blog (Header)' type='Header'/>
</b:section>

Và thay bằng:

<b:section class='header' id='header-left' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Thủ Thuật Blog (Header)' type='Header'/>
</b:section>
      <b:section class='header' id='header-right' maxwidgets='1' showaddelement='yes'/>

Bước 2. Tiếp tục tìm header-outer bạn sẽ nhìn thấy như thế này:

.header-outer {
  background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
  _background-image: none;
}

Bây giờ chúng ta thay bằng:

.header-outer {
  background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
  _background-image: none;
  height: 100px;
  overflow: hidden;
}

#header-left{
  width: 350px;
  float: $startSide;
  overflow: hidden;
}

#header-right{
  width: 468px;
  float: $endSide;
  overflow: hidden;
}

.tabs-outer{
  clear: both;
}

Và tiến hành lưu lại.

Như bạn thấy trong đoạn CSS trên tôi đã đề nghị kích thước ngang header-left và header-right lần lượt là 350px và 468px. Tổng kích thước này không được vượt quá chiều ngang của template.

Tùy vào kích thước logo và banner mà muốn sử dụng cũng như kích thước của template mẫu hãy điều chỉnh các con số trên cho cân xứng.

Chiều ngang của template

Trước khi thay đổi

Sau khi thay đổi và thêm tiện ích HTML/JavaScript (Nội dung là một banner 468x60)

Hiển thị trên blog

Sử dụng logo:

Bạn vừa thấy 350px là chiều ngang của logo, còn chiều cao thì bao nhiêu? Xin thưa chiều cao của logo chính là chiều cao của header-outer, ở đây 100px. Như vậy bạn cần thiết kế logo có kích thước 350x100.

Chọn kiểu hiện thị logo

Tất nhiên đây chỉ là những con số gợi ý, thực tế như thế nào còn tùy thuộc vào bố cục template, margin, padding và kể cả quan điểm thẩm mỹ của từng người.

Hãy cùng chia sẻ với Thủ Thuật Blog cách làm của bạn.

Chơi nhạc trên blog với Yahoo! Media Player

Với việc hỗ trợ HTML và JavaScript đầy đủ, Blogger cho phép người dùng thoải mái sử dụng một trình chơi nhạc tùy thích trên blog của mình mà không bị giới hạn như Yahoo! 360plus hay một số nền blog miễn phí khác.

Còn nhớ cách đây khá lâu Thủ Thuật Blog đã giới thiệu công cụ chơi mp3 của del.ico.us (Dịch vụ ghi nhớ trang ưa thích trước đây đã được Yahoo mua lại, tuy nhiên giờ đã bán cho đồng sáng lập Youtube Chad Hurley và Steve Chen) nhưng dịch vụ này chỉ cho phép sử dụng các bài hát có định dạng mp3.

Yahoo! cũng có một công cụ chơi nhạc khác hỗ trợ định dạng âm thanh mp3 và video từ Yahoo! Movie lẫn YouTube.

Bạn có thể làm các bước sau đây để sử dụng trên blog mình:

Bước 1. Chèn đoạn JavaScript sau đây trước thẻ </body> (Đăng nhập Blogger, chọn Thiết kế | Chỉnh sửa HTML, nhấn Ctrl + F để tìm):

<script type="text/javascript" src="http://webplayer.yahooapis.com/player.js"></script>

Bước 2. Lấy link bài hát và tạo các liên kết như dưới đây:

<a href="http://mediaplayer.yahoo.com/example3.mp3">Yodel (mp3 link)</a>
<a href="http://movies.yahoo.com/movie/1810096458/info">Tron (Yahoo! Movie link)</a>
<a href="http://www.youtube.com/watch?v=i56XeM0-b8Y">Zoetrope (YouTube link)</a>

Từ giao diện kéo thả của Blogger, tạo một tiện ích HTML/JavaScript mới, dán các liên kết như trên vào và lưu lại.

Cách khác, bạn có thể gom 2 đoạn code ở bước 1 và 2 cùng dán vào HTML/JavaScript hoặc dán vào một bài viết cụ thể.

Bước 3. Thưởng thức!

Yodel (mp3 link)
Tron (Yahoo! Movie link)
Zoetrope (YouTube link)

Trang web lấy link trực tiếp và chia sẻ file siêu tốc

Bạn muốn download rất nhiều file từ nhiều nguồn chia sẻ file (FileServe, FileSonic, Hotfile, Megaupload, ThePirateBay ...) nhưng bạn không muốn chờ đợi, không phải mở quảng cáo, không phải nhập mã bí mật, không bị giới hạn dung lượng download ? Điều này sẽ được giải quyết trong nháy mắt chỉ với vài Click theo hướng dẫn dưới đây.

Hiện tại trang Leech này vẫn chạy bản Beta nhưng phiên bản này đã có khả năng Leech, tự bung, trình chiếu với tốc độ siêu nhanh.
 
Bước 1: Đăng nhập vào trang chủ rồi đăng ký một tài khoản mới ở ĐÂY (Hình 1). 

Hình 1-Đăng ký tài khoản mới

Bước 2: Click vào nút "FETCH FILES" rồi nhập các link mà bạn muốn download. Sau đó bấm nút "Next" 
Chú ý: Trong bước này trang web tự động xoá file nén và tự bung. Nếu các bạn không muốn thực hiện hai việc này thì các bạn tích bỏ hai lựa chọn "Automatically delete ..." và "Automatically extract..." (Hình 2)

Hình 2-Nhập những link cần Leech

Bước 3: Chờ trang web tự động nhận dạng file trong một khoảng thời gian nào đó (tuỳ thuộc số lượng, dung lượng của file mà bạn đã Add), khi xong chúng ta bấm nút "FETCH!" (Hình 3)

Hình 3-Bắt đầu Leech (Fetch)

Chú ý: Do trang web vẫn đang ở phiên bản Beta cho nên chúng ta chỉ có thể Leech được 3 file một lúc.

Bước 4: Những file đã Leech về thành công sẽ có trạng thái "COMPLETED", các bạn chỉ cần click vào nút mũi tên bên cạnh đó để mở file. Trường hợp file có mật khẩu chúng ta phải nhập mật khẩu để trang web leech về (Hình 4)

Hình 4-Quá trình Leech (Fetch) kết thúc

Bước 5: Khi đã mở được file thì chúng ta có nhiều lựa chọn mà hai lựa chọn hữu ích nhất là "Download" và "Share" (Hình 5)

Hình 5-Download hoặc chia sẻ file đã Leech về

Bước 6: Dung lượng của mỗi người dùng miễn phí chỉ ở mức 10GB cho nên chúng ta nên xoá những gì đã Leech về để đảm bảo cho việc kéo dài tài khoản (Hình 6) 

Hình 6-Xoá hết sau khi đã download về để có nhiều dung lượng hơn

Theo kinh nghiệm của tác giả thì thời gian tới đây trang web này sẽ nâng cấp nhiều hơn nữa và có nhiều tính năng để Leech được từ mọi trang chia sẻ. Khi các bạn muốn tìm các trang web Leech thay thế có thể đọc các liệt kê liên tục được cập nhật ở liên kết NÀY. Chúc các bạn thành công !

7 mẹo tìm kiếm có thể bạn chưa biết

Khi cần tìm kiếm thông tin liên quan về 1 vấn đề nào đó trên Internet, các bạn sẽ tiến hành như thế nào? Thao tác đơn giản nhất vẫn là khởi động trình duyệt, truy cập Google hoặc Bing, gõ từ khóa tìm kiếm và nhấn Enter. Nhưng liệu các bạn có biết rằng nếu sử dụng thêm một số liên từ như AND, OR... sẽ giúp chúng ta cải thiện được kết quả chính xác hơn. Trong bài viết hướng dẫn dưới đây, chúng tôi sẽ giới thiệu với các bạn cách kết hợp và sử dụng chúng sao cho hiệu quả.

1. Với Google, sử dụng AROUND(n) để tìm kiếm khoảng chính xác:

Chắc hẳn cụm từ này khá xa lạ với nhiều người sử dụng, đó là toán tử AROUND(n) của Google. Khi áp dụng, kết quả trả về từ Google sẽ được giới hạn trong khoảng 2 từ khóa chính:

Ví dụ, các bạn gõ obama AROUND(5) osama vào Google thì hệ thống sẽ hiển thị toàn bộ website có chứa 2 từ khóa ở 2 đầu, với khoảng cách là 5 từ.

2. Tìm kiếm Superstars trong Gmail:

Việc đánh giá, sắp xếp email là 1 tính năng gần như không thể thiếu trong Gmail từ khi người sử dụng kích hoạt tùy chọn Superstars. Các bạn có thể tự phân loại các email khác nhau tùy thuộc vào mức độ quan trọng và nhu cầu cá nhân dựa vào những biểu tượng khác nhau. Và khi đã sử dụng chức năng này, tại sao mọi người lại không tìm những email đã được phân loại trước đó?

Ví dụ, khi tìm kiếm với cú pháp has:blue-info, hệ thống sẽ giới hạn lại toàn bộ những email được đánh dấu bằng biểu tượng màu xanh:

Và dưới đây là một số toán từ tìm kiếm ngắn gọn khác:

has:yellow-star (hoặc l:^ss_sy)

has:blue-star (hoặc l:^ss_sb)

has:red-star (hoặc l:^ss_sr)

has:orange-star (hoặc l:^ss_so)

has:green-star (hoặc l:^ss_sg)

has:purple-star (hoặc l:^ss_sp)

has:red-bang (hoặc l:^ss_cr)

has:yellow-bang (hoặc l:^ss_cy)

has:blue-info (hoặc l:^ss_cb)

has:orange-guillemet (hoặc l:^ss_co)

has:green-check (hoặc l:^ss_cg)

has:purple-question (hoặc l:^ss_cp)

Một số thông tin khác các bạn có thể tham khảo thêm tại đây.

3. Gán thêm chức năng Instant Search với CloudMagic trong Gmail:

Mọi dịch vụ và tính năng của Gmail đều đáp ứng tốt nhu cầu của người sử dụng, ngoại trừ việc thời gian tìm kiếm diễn ra hơi lâu, đặc biệt là khi bạn có nhiều email trong Inbox. Do vậy, hãy khắc phục vấn đề này bằng CloudMagic - 1 tiện ích mở rộng dành cho Firefox và Chrome, giúp người sử dụng nhanh chóng tìm được kết quả như ý với Instant Search. 

Tất cả những gì bạn cần làm là đưa ra 1 vài thông tin cần thiết cho quá trình này, nhấn Ctrl + / để chuyển vào “khu vực” tìm kiếm của CloudMagic, gõ từ khóa và lựa chọn kết quả phù hợp với nhu cầu của bạn.

4. Tìm kiếm ảnh nền nhanh chóng với Bing:

Google cho phép người dùng chỉ định rõ ràng độ phân giải đối với những bức ảnh trong kết quả tìm kiếm. Và các bạn có thể dựa vào tính năng này để tìm chính xác Wallpaper phù hợp với độ phân giải của màn hình. Ví dụ, nếu muốn tìm ảnh với từ khóa nature, với kích thước 1366 x 768 thì gõ như sau:

Còn trong lĩnh vực này, Bing lại tỏ ra vượt trội hơn với đôi chút lợi thế. Các bạn chỉ cần truy cập vàođây, nhập từ khóa tìm kiếm và chọn Size > Wallpapers từ bảng điều khiển bên trái với 3 lựa chọn chủ yếu là Small, Medium và Large. Nhưng chế độ này lại không hoạt động chuẩn xác nếu người dùng tiến hành tìm kiếm trên Dual Monitor.

5. Tìm các note dựa vào nguồn gốc với Evernote:

Nếu bạn là một người “nghiện” Evernote thì việc tìm kiếm các thông tin có liên quan sẽ đơn giản hơn rất nhiều vì công nghệ tích hợp mã nguồn mở bên trong ứng dụng:

Ví dụ, nếu bạn gõ từ khóa source:mobile.* thì hệ thống kết quả trả về sẽ được hiển thị đầy đủ dựa trên bất kỳ nguồn mobile client nào, hoặc với source:ms.app.* thì toàn bộ phần note hiển thị sẽ có liên quan đến các ứng dụng của Microsoft như Word, Excel... Một số thông tin mở rộng về hệ thống từ khóa tìm kiếm của Evernote, các bạn có thể tham khảo thêm tại đây.

6. Tìm kiếm đường dẫn chia sẻ qua mạng xã hội nhờ Trunk.ly:

Bạn thường xuyên làm việc và giao dịch trên Facebook, Twitter... và cảm thấy vô cùng khó khăn chi quản lý, giám sát những bài viết đã được đăng tải trên đây. Với Trunk.ly, mọi việc sẽ trở nên đơn giản hơn rất nhiều:

Tất cả những gì cần làm là truy cập vào đây, tạo mới 1 tài khoản và kết nối tới Facebook và Twitter. Ngay lập tức, ứng dụng này sẽ xác định rõ ràng tất cả những đường dẫn bạn đã từng chia sẻ. Hiện tại, Trunk.ly hỗ trợ Delicious, Instapaper, RSS feeds, Pinboard, Twitter và Facebook.

7. Tìm kiếm chính xác file và thư mục trong Windows:

Tính năng Search mặc định trong Windows thực hiện khá tốt công việc tìm kiếm giữa các phân vùng khác nhau, nhưng nếu người sử dụng không thể nhớ chính xác tên của thư mục hoặc file cần tìm thì phải làm thế nào? 

Rất đơn giản, nếu các bạn sử dụng thêm tham số kind: trong chuỗi từ khóa tìm kiếm. Ví dụ, khi gõ mp3 kind:folder, Windows sẽ chỉ hiển thị những thư mục có tên bao gồm mp3, tỉ lệ chính xác tuyệt đối.

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

(theo QTM)