Saturday, January 12, 2008

Recent Post & Recent Comment với Google Gadget

Có thể bạn đã quen thuộc với những Recent Comment hay Recent Post được tạo bằng cách đưa feed lên một số trang web và chuyển chúng sang các code javascript. Nhưng cách đó có thể sẽ khiến bạn gặp các lỗi font như :các chữ tiếng việt đều chuyển thành các ô vuông...Vậy phải giải quyết vấn đề đó thế nào? Google Gadget là giải pháp tối ưu nhất.

Bạn hãy tới http://code.google.com/apis/gadgets/docs/gs.html và trong bảng Popular Gadgets bạn chọn Feeds in Tabs. Bạn có thể thấybảng code của Feeds in Tabs sẽ xuất hiện ngay phía dưới.

Bạn hãy xem những đoạn code đầu tiên:

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs title="__UP_title__"
directory_title="Feeds in Tabs"
description="Read up to four Atom or RSS feeds from within a single gadget using tabs. Feed titles and descriptions are optionally included and can be turned off. Customize the font-size and text for tab titles. Fetch 3-12 entries per feed including summaries if available."
author="Daniel L."
author_email="daniel.feedback+feedstabs@gmail.com"
author_affiliation="Google Inc."
author_location="Mountain View, CA"
screenshot="/ig/modules/feeds_tabs.png"
thumbnail="/ig/modules/feeds_tabs-thm.png"
height="250"
scrolling="false"
singleton="false">
<Require feature="dynamic-height"/>
<Require feature="setprefs"/>
<Require feature="tabs"/>
<Require feature="analytics"/>
</ModulePrefs>


<ModulePrefs title: tiêu đề của Gadget (Bạn hãy xóa dòng này nếu bạn không muốn nó xuất hiện)
directory_title : tên của Gadget đó khi đưa lên directory của Google (bạn có thể bỏ phần này)
description: Bạn điền blog description của mình vào đây (không bắt buộc)
author: tên bạn
author_email: địa chỉ email của bạn
author_affiliation: tên blog
author_location: Nơi ở của bạn
(đây là những thông tin đi kèm gadget này khi bạn đưa nó lên directory của Google, bạn có thể bỏ trống những chỗ đó cũng được)

height: chiều dài của Gadget (đơn vị px)
scrolling: nếu bạn muốn đưa nhiều bài viết vào đây nhưng không muốn gadget có chiều dài quá lớn bạn hãy thay "false" thành "true"- gadget của bạn lúc này đã có thêm 1 thanh trượt dọc. Bạn có thể click vào preview để xem.

Đoạn code tiếp theo:

<UserPref name="title" display_name="Gadget Title" default_value="Feeds in Tabs"/>
<UserPref name="tabFontSize" display_name="Tab Font Size" default_value="0.7em"/>
<UserPref name="showFeedDesc" display_name="Feed Descriptions" datatype="bool" default_value="true"/>
<UserPref name="feed1"
display_name="Feed 1: URL"
datatype="string"
default_value="http://groups.google.com/group/Google-Gadgets-API/feed/
atom_v1_0_topics.xml"/>
<UserPref name="feedTitle1" display_name="Feed 1: Title" datatype="string" default_value="Gadgets API"/>
.....................
<UserPref name="entries" display_name="# of Entries" datatype="enum" default_value="3">


Ở bảng trên, tôi chỉ đưa ra 1 tab chứa feed và sẽ hướng dẫn các bạn cách thay đổi, các bạn có thể làm tương tự với các 3 tab còn lại. Trong bảng này bạn chỉ cần quan tâm đến những đoạn code sau:

  • <UserPref name="feed1"
display_name="Feed 1: URL"
datatype="string"
default_value="http://groups.google.com/group/Google-Gadgets-API/feed/
atom_v1_0_topics.xml"
/>

default_value=" bạn điền feed của blog vào đây". Ví dụ: tôi sẽ đưa feed của label Adsense-VN vào đây. Đây là địa chỉ feed của tôi:

http://crazyboy89.blogspot.com/feeds/posts/default/-/Adsense-VN


  • <UserPref name="feedTitle1" display_name="Feed 1: Title" datatype="string" default_value="Gadgets API"/>

default_value=" Bạn điền tên tab đó vào đây" . Ở đây tôi lấy tên là :Adsense-VN

  • <UserPref name="entries" display_name="# of Entries" datatype="enum" default_value="3">

default_value=" Bạn điền số bài viết bạn muốn xuất hiện trong Gadget này". Bạn chỉ nên đưa từ 15 bài trở xuống nếu bạn đưa qua nhiều sẽ làm chậm tốc độ load blog.


Đoạn code tiếp theo:

<EnumValue value="3"/>
<EnumValue value="4"/>
............
<UserPref name="summaries" display_name="Summaries" datatype="enum" default_value="-1">
...............
<UserPref name="selectedTab" datatype="hidden"/>
<Content type="html"><![CDATA[

Bạn có thể quy định số chữ của bài viết sẽ hiện trong Gadget thông qua đoạn code:
<UserPref name="summaries" display_name="Summaries" datatype="enum" default_value="200">

Bạn có thể thay giá trị trong code mầu đỏ. Nếu bạn không muốn hiện bài viết bạn điền giá trị "-1"
Nếu bạn muốn hiện toàn bộ bài viết bạn điền giá trị "0". Còn các giá trị từ "1" trở lên sẽ quy định số chữ tương ứng của bài viết sẽ xuất hiện.

Tiếp theo là các code CSS :

<style type="text/css">>
.tablib_table {
font-size: __UP_tabFontSize__;
.......
</style>

.tablib_table :

Font-size: quy định cỡ chữ trong các tab, đơn vị px hoặc em.
Bạn có thể thêm các đặc tính margin và padding, background...vào đây.

.tablib_selected, .tablib_unselected :

Width: chiều rộng các tab, đơn px hoặc %.

.statusLabel:quy định các đặc tính của dong thông báo ( click vào 1 tab bạn sẽ thấy hiện lên dòng thông báo: loading)

.feedHeader: phần header của gadget được mô tả ở đây (nó nằm ngay dưới các tab và trên các bài viết)
Các đặc tính bổ sung: color (mầu chữ), font-weight (kiểu chữ): bold/ lighter/normal/..., font-style: italic/normal....

.feedHeader .feedTitle: đây là đoạn code quy định đặc tính blog title của bạn.
Bạn cũng có thể thêm các đặc tính như trên vào đây.

.feedHeader .feedAuthor: đây là code quy định các đặc tính của tên tác giả

.feedList , .feedList li :bạn có thể thay đổi các đặc tính các bài viết của mình tại đây.

.feedList li div.entryTimestamp :đây là code của thời gian đăng bài. Bạn có thể bỏ nó nếu muốn.

Nhưng đoạn code còn lại là những code Javascript, bạn không cần quan tâm đến nó nhiều.
Sau khi đã chỉnh sửa xong bạn preview trước sau đó save lại. Trong menu "FILE" bạn chọn pulish và chọn Add to a webpage. Trang mới sẽ hiện ra, bạn có thể thay đổi Gadget của mình tại đây. Cuối cùng là "Get the code", bạn copy code này và paste vào 1 widget HTML trong Page element.

Vậy là bạn đã có 1 Recent post cho mình rồi đó. Còn đối với Recent comment, bạn chỉ cần thay
http://crazyboy89.blogspot.com/feeds/posts/default/-/Adsense-VN

bằng:

http://crazyboy89.blogspot.com/feeds/comments/default

Bạn chỉ cần 1 tab Recent Comment thôi (nếu bạn muốn có 4 tab thì có thể giữ nguyên code đó), vì vậy hãy tìm trong bảng code đó và xóa toàn bộ những code liên quan đến những tab còn lại. Chúc các bạn thành công.

Cám ơn các bạn đã theo dõi bài viết. Mong sẽ nhận được nhiều ý kiến đóng góp từ các bạn để giúp hoàn thiện nội dung bài viết hơn..
Chúc các bạn có 1 ngày vui vẻ!










AdSense Earning = Impression-count x Click-though-rate x Cost-per-click x smart-pricing-factor.impression count is basically referring to increase your traffic. It means the number of times AdSense secret block is displayed.Click-through-rate (CTR) is ratio of clicks per impressions. It can range from 0.1% to 30%, but most commonly around 1% to 10%.Cost-per-click (CPC) is the earning money you get per click. While traditionally it refers to the amount advertisers pay for each click, it can also mean the amount publishers get for each click.Smart-pricing is AdSense method to determine how valuable clicks from your site is worth. If clicks on your site doesn’t provide good value to advertisers, e.g. from visitors’ geo-location that seldom translate to sales, you will only get a fraction of the supposed CPC.Don’t encourage your visitors to click on ads. The only acceptable text is “Sponsored Links” and “Advertisements”.When in doubt don’t hesitate to contact the AdSense team. They are very helpful.Use Overture Bid Tool and Search Engine Keyword Tool to find suitable keyword.Submit your URL to search engines for crawling.Google is not the only search engine. Optimize for different engines as well. You are very likely to face less competition than in Google.Search engines are where most of your new visitors come from. Learn a bit about Search Engine Optimization, or pay people to do it. Doing it yourself will save yourself from troubles created by not-so-honorable SEO (Search Engine Optimizer).Try 300×250 medium rectangle, 336×280 large rectangle, or 160×600 wide skyscraper ad formats. These are the best performing AdSense ad formats.Wrap the AdSense block around your content.AdSense have both CPM (cost per thousand impressions) and CPC (cost per click) ads, and will choose the one it thinks can perform better.Adsense tips have in here.SearchAdSense Tipson Google. Most webmasters continuously try to optimize their AdSense and many are more than willing to share their result.You can get help of other AdSense pulishers at AdSense Help Group.Remove the “Advertise on this sitefrom your AdSense block until your site is big enough to attract real advertisers. This will help to clear off many MFA (made-for-adsense) sites. You can disable it from AdSense account setting.Use AdSense Competitive Ads Filter to remove irrelevant ads.Try variations of AdSense colors, format, position on different pages to make it more unpredictable for your visitors.Watch your AdSense tips earning. Notify AdSense hack Team if you find anything suspicious. Your competitors might try to sabotage your account, or your well-meaning friend keep on clicking on the ads thinking they are helping you.Use Google AdSense section targeting to help AdSense deliver more relevant ads.Let earning money!money!


1 comment:

cong ty bao ve said...

Phần này khá đơn giản và dễ sử dụng nữa. Mình có cài cho trang của mình là trang bảo vệ và thấy chạy ok lắm.