NTN Kiến Thức

Tiện ích bài viết mới nhất từ Bloglisst hoặc Popular Posts của blogger đã không còn xa lạ với chúng ta nữa. Các tiện ích này hầu như chỉ được tùy biến đơn điệu và chưa trang trí gì được . Namkna từng giới thiệu cách Làm đẹp tiện ích Popular Posts với hiệu ứng tooltip của fandung. Hôm nay namkna sẽ thêm style mới với hiệu ứng (tooltips) vào cho 2 tiện ích này càng vượt trội hơn. Ảnh Demo. 1.Bloglist ( bài viết mới nhất ): Với cách tùy biến gọn gàng và đẹp mắt , với tốc độ vượt trội vì no Javascript . Ngoài ra, nó rất đơn giản và dễ dùng. Đăng nhập Blogger, vào Page Elements >> Add a Gadget chọn Blog List. Tại mục Title, bạn hãy đề là Bài viết mới nhất. Tick chọn vào các mục Title of most recent item, Snippet of most recent item, Thumbnail of most recent item. Nhấn ADD TO LIST. Sau đó dán vào mục Add by URL với địa chỉ sau đây: http:// namkna .blogspot.com/feeds/posts/default/?start-index=1 or http:// namkna .com/feeds/posts/default/?start-index=1 Cho tên miền tùy chỉnh B...

Như các bạn đã biết, tiện ích này có 3 chế độ hiển thị khác nhau. Và trong 3 chế độ này đa phần mọi người thường dùng cách hiển thị ảnh thumnnail và tiêu đề vì cách này nhìn tương đối nhất. Với cách hiển thị đầy đủ (gồm : tiêu đề, ảnh thumbnail và trích dẫn), thì cách này thường chiếm nhiều không gian của blog, do đó mà ít người dùng. Hôm nay mình sẽ áp dụng hiệu ứng tooltips cho tiện ích này, để có thể hiển thị đầy đủ nhất nôi dung của tiện ích này mà không tốn nhiều không gian của blog Với áp dụng này, phần trích dẫn của tiện ích sẽ hiển thị khi ta rê chuột vào tiêu đề của bài viết. Việc làm này cũng ko ảnh hưởng nhiều đến việc load tiện ích, do tooltips cũng khá nhẹ, vì thế các bạn có thể an tâm về tốc độ load. Ở đây mình sẽ hướng dẫn 2 cách hiển thị với tooltips. Cách 1 : Hiển thị tiêu đề và ảnh thumnail, phần trích dẫn sẽ hiển thị khi rê chuột vào tiêu đề. Cách 2 : Chỉ hiển thị tiêu đề, khi rê chuột sẽ hiển thị ảnh thumbnail và trích dẫn Sau đây là hướng dẫn: 1. Đầu tiên ...

Chắc hẳn mỗi người dùng Blogger đều tạo phân trang (page navigation) để blog tải nhanh và trông gọn gàng hơn. Tuy nhiên khi click vào tên nhãn ở widget label hay là ở thanh trạng thái breadcrumb của mỗi bài đăng thì số bài đăng hiển thị trên 1 trang lại lên đến 20 theo mặc định. Thực ra việc hiển thị số bài đăng trên 1 trang là thêm vào sau địa chỉ dòng ?&max-results=5 để ngắt trang. Vì vậy để sửa lỗi này ta chỉ việc thay tất cả dòng: expr:href='data:label.url' thành: expr:href='data:label.url + "?&max-results= 5 "' Thay 5 thành số bài đăng bạn muốn hiển thị trên 1 trang. Chúc thành công!

Chúng ta đều biết Blogger đã có tính năng tạo trang tĩnh (static_page) giúp người dùng tạo các trang chuyên biệt như trang giới thiệu (About), trang liên hệ ( Contact )… Đặc trưng của các trang tĩnh là không được duyệt hiển thị trên trang chính (kiểu trang index gồm trang chủ, trang nhãn và trang lưu trữ). Tuy nhiên Blogger giới hạn số trang tĩnh tối đa được tạo cho mỗi blogspot là 10 trang . Dường như con số này quá khiêm tốn so với nhu cầu sử dụng của bạn. Nào là trang nén CSS, trang mã hóa, trang mã màu, trang liên kết, trang sản phẩm, trang dịch vụ, trang diễn đàn, trang liên hệ, trang giới thiệu, trang góp ý, trang lưu bút … Tính ngót ra cũng đến trên dưới hai chục trang như vậy. Thế thì làm sao để thỏa mãn nhu cầu tạo trang riêng biệt như thế. Bạn có thể xem DEMO (Chú ý ở tiện ích Recent Posts có hiển thị 2 bài viết đầu tiên thuộc 1 nhãn song đến trang chủ thì không nhìn thấy chúng nữa). Lời giải đáp lại đụng đến các lệnh điều kiện trong cấu trúc XML của Templa...

Thực ra việc ẩn bài viết ở trang chủ ta phải dùng một thủ thuật khác với thủ thuật ẩn widget , nếu dùng thủ thuật ẩn widget thì bài viết không được ẩn hoàn toàn. Vì thế mình sẽ dùng CSS kết hợp lệnh <b:if> để ẩn nó. Đây là thủ thuật đơn giả nên mình sẽ không post hình minh họa kết quả. Trước tiên thực hiện bạn phải xác định id của widget " Bài đăng trên blog ", thông thường nó đều có id là " Blog1 ". ( xem trong code template ( mở rộng mẫu tiện ích ) ) Xem hình họa : Sau khi xác định đc id này, ta thực hiện các bước sau: 1. Vào bố cục 2. Vào chỉnh sửa code HTML 3. Chèn đoạn code bên dưới vào sau dòng code ]]></b:skin> <style> <b:if cond='data:blog.url == data:blog.homepageUrl'> # Blog1 { display:none; visibility:hidden; } </b:if> </style> 4. save template. Chúc các bạn thành công. Theo:Fandung .

Đôi khi việc ẩn nhận xét cho một hoặc một số trang nhất định cũng là cần thiết cho blogspot, ví dụ khi bạn muốn tạo một trang chuyên biệt như nâng cấp Search box của blogspot ,... (không cần đến phần nhận xét, trong trường hợp dùng hết 10 trang tĩnh) hoặc việc ẩn nhận xét trên tất cả các trang tĩnh cũng là một nhu cầu cho blogspot. Thông thường để thực hiện điều này, trước đây có blogger thường thực hiện như sau. Để ẩn nhận xét cho một bài viết nào đó, thì đặt code như sau vào sau dòng ]]></b:skin> trong Template. <b:if cond='data:blog.url == " URL_bài viết "'> <style type="text/css"> #comments {display:none} </style> </b:if> Nếu muốn ẩn phần nhận xét cho nhiều bài khác nhau thì dùng code như bên dưới : <b:if cond='data:blog.url == " URL_bài viết 1 "'> <b:if cond='data:blog.url == " URL_bài viết 2 "'> <b:if cond='data:blog.url == " URL_bài viết 3 "'...

Đối với Blogspot, khi bạn muốn thêm một tiện ích liệt kê các trang web hoặc blog mà bạn ưa thích thì bạn thường dùng đến tiện ích LinkList. Tính năng của tiện ích này rất đơn điệu, bạn chỉ có thể tùy biến CSS cho các liên kết. Qua bài viết này, mình sẽ giúp bạn sáng tạo thêm một chút, thêm favicon cho các liên kết của tiện ích LinkList. Kể từ khi Blogger tích hợp tính năng Favicon thì một liên kết favicon của blogspot có dạng như sau: http://tenblogcuaban.blogspot.com/favicon.ico Theo quy tắc phổ biến, liên kết favicon của một website (được xây dựng trên các nền tảng Wordpress, Joomla, …) có dạng như sau: http://www.tenwebsite.com/favicon.ico . Bây giờ hãy xem xét cấu trúc XML của một tiện ích LinkList. Trước tiên Đăng nhập Blogger, vào Design >> Page Elements. Thêm một tiện ích LinkList rồi lần lượt thêm địa chỉ (URL) và tên trang tương ứng cho các liên kết ưa thích mà bạn muốn tạo. Sau đó vào Edit HTML chọn Expand Widget Templates. Dùng từ khóa LinkList để tìm đến ...

Trước đây, tôi có chia sẻ với các bạn một số mẫu đồng hồ đẹp (xem TẠI ĐÂY ), kỳ này tôi chia sẻ thêm với các mẫu đồng hồ có kèm theo lịch, mời các bạn xem các mẫu phía dưới. Thích mẫu nào thì các bạn cứ việc lấy Code bên dưới và dán vào Blog của bạn.  - Cách thực hiện: Vào Thiết Kế - Phần tử trang - Thêm Tiện ích - HTML/JavarScrip và Pate code vào.  Mẫu 1: <embed allowscriptaccess="always" flashvars="bannerWidth=250&amp;bannerHeight=100&amp;bannerSID=http://img.uu1001.cn/x3/2011-11-10/06-54/2011-11-10_1ddc0b2b56b24e3c38dfb39a7d04f97d_0.xml&amp;bannerXML=&amp;bannerLink=http%3A%2F%2F&amp;dataSource=&amp;bid=26402587&amp;appSource=default" id="26402587" name="26402587" quality="high" src="http://img.uu1001.cn/bcv3.swf?v=20111012" type="application/x-shockwave-flash" wmode="transparent" height="100" width="250"> Mẫu 2: <embed allowscriptaccess="...

Dưới đây là một số mẫu banner  để trang trí cho blog, ứng với mỗi mẫu là code của nó, các mẫu này có kích thước 1000px X 250px. Nếu thích mẫu nào các bạn chỉ cần đăng nhập vào blog > chọn Thiết kế > chọn thêm tiện ích HTML/Javacript rồi copy code phía dưới các mẫu tương ứng dán vào và bấm lưu lại là xong. Mẫu 1: <embed bgcolor="#FFFFFF" height="250" width="930" pluginspage="http://www.macromedia.com/go/getflashplayer" src="https://1025630998240328736-a-1802744773732722657-s-sites.googlegroups.com/site/dungheineken/1.swf?attachauth=ANoY7cqSynaNVJMBxFoCO6vjtepbJQxcDL9Pw1npaOeol55QvrjJbcNHG_qZoBJ2kx1_HTRWGaDYumnqpIbJ6ZGiG2cnsa5zhRFM-wsseB7UILBHXwVovNwUGUbxhTpDH7ai5YYkrpicOF-jnmDRXHfLP3wAKAHmNIDDmqciVtsdri43d8o4CPaWIiB6xuSzVHb5A0tJdd8J&attredirects=0 " type="application/x-shockwave-flash" ><br /> </embed><br /> Mẫu 2: <embed bgcolor="#FFFFFF" height="250" width=...