Wednesday, December 26, 2007

Tạo Navigation Bar

Rất nhiều blogger sử dụng những thanh menu nằm ngang để giúp cho người đọc dễ dàng tìm kiếm thông tin mà họ muốn. Nhiều Template đã có sẵn những dạng menu này, nhưng thay đổi mầu sắc, kích cỡ như thế nào ? Hay có thể thay đổi các dòng chữ trên menu bằng các hình ảnh được không?
Trong bài viết này tôi sẽ đề cập tới những vấn đề đó.


1) Tạo một Navigation Bar đơn giản:(xem hình)


Bạn vào Edit HTML và nhớ là phải lưu mẫu trước. Trong bảng mã, bạn hãy tìm :

/* Header

và chèn đoạn mã dưới đây vào phía sau nó

#Crazyboy ul li{
list-style-type: none;
display:inline;
margin:0px;
padding:30px;
border:0px solid;
}

Navigation Bar có thể được thay đổi vị trí thông qua mã margin và padding. Hãy đọc bài viết Tìm Hiểu Margin Và Padding

Bây giờ bạn cần tìm đoạn mã sau:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='ADSENSE TIPS ' type='Header'/>
</b:section>
</div>

(bạn cần lưu ý nội dung giữa 2 thẻ <div id='header-wrapper'> và </div> ở mỗi template là khác nhau nên bạn chỉ cần tìm đoạn mã có 2 thẻ trên là được)
và chèn ngay dưới nó đoạn mã sau:



<div id='Crazyboy'>
<ul>
<li><a href="URL of Home page">Home</a></li>
<li><a href="URL of Home page">Music</a></li>
<li><a href="URL of Home page">Books</a></li>
<li><a href="URL of Home page">About Me</a></li>
<li><a href="mailto:EMAIL ADDRESS">Contact</a></li>
</ul></div>

Bạn có thể thay nhưng dòng mầu xanh, mầu đỏ và mầu tím. Dòng mầu đỏ là những chữ sẽ hiển thị trên Navigation Bar (thanh menu). Bạn thay thế dong mầu xanh bằng các đường link khác. Dòng mầu tím là địa chỉ mail của bạn.

2) Thêm hiệu ứng các hiệu ứng:
Bạn có thể thêm các hiệu ứng bằng cách chèn ngay dưới đoạn mã này:

#Crazyboy ul li{
list-style-type: none;
display:inline;
margin:0px;
padding:30px;
border:0px solid;
}

đoạn mã sau:

#Crazyboy li a{
color:#dfffed;
}

#Crazyboy li a:visited {
color: #57E964;
}

#Crazyboy li a:hover {
color: #F88017;
background: #ffff66;
}


Nếu muốn thay đổi mầu sắc, bạn tra mã mầu trong bảng mầu thập lục và thay thế vào các dong mầu vàng. Click vào đây để lấy bảng mã mầu thập lục.

Sau khi làm xong bạn sẽ thấy :



3) Chèn hình ảnh thay thế cho các chữ trên Navigation Bar:

Chỉ thay thế đoạn mã


<div id='Crazyboy'>
<ul>
<li><a href="URL Home page">Home</a></li>
<li><a href="URL Music">Music</a></li>
<li><a href="URL Books">Books</a></li>
<li><a href="URL About">About Me</a></li>
<li><a href="mailto:EMAIL ADDRESS">Contact</a></li>
</ul></div>

bằng đoạn mã :

<div id='Crazyboy'>
<ul>
<li><a href="URL Home page"><img src="URL image"/></a></li>
<li><a href="URL Music page"gt;<img src="URL image"/></a></li>
<li><a href="URL Books page"><img src="URL image"/></a></li>
<li><a href="URL Profile page"><img src="URL image"/></a></li>
<li><a href="mailto:EMAIL ADDRESS"><img src="URL image"/></a></li>
</ul></div>

Bạn thay thế dòng mầu xanh bằng các đường link đến các bài viết hoặc label, thay thế dòng mầu đỏ bằng các đường link đến hình ảnh.

Vậy là bạn đã có một Navigation Bar rồi đó.

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!

No comments: