Add a Cool Feed Icon and Subscription Email Form To The Sidebar of Your Blogs (ll)

As I had promised in my previous post, I am now sharing the trick of adding a beautiful subscription form to the sidebar of your blogs. Check out my email form just below the RSS Feed Icon at my sidebar on your right..

A Subscription Email form is more important than a RSS feed Icon itself. People often love to receive your post Updates in their email inbox rather than in a reader. So make sure you make your Email From as eye appealing and eye catching as possible. So today we will again learn how to plant the TNT of an Email form, so lets get to work!

Follow these steps,

• Log into your feedburner account
• Click on the Publicize button and then click on Email Subscriptions link as shown below,

• Then drag down the page until you see a HTML code, as shown below

• Copy the HTML code for the email form and paste it in a WordPad or Notepad. The  code may look like the one below,

<form style="border:1px solid #ccc;padding:3px;text-align:center;" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=TntByStc', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p>Enter your email address:</p><p><input type="text" style="width:140px" name="email"/></p><input type="hidden" value="TntByStc" name="uri"/><input type="hidden" name="loc" value="en_US"/><input type="submit" value="Subscribe" /><p>Delivered by <a href="http://feedburner.google.com" target="_blank">FeedBurner</a></p></form>

Please search for the Green and Red texts as shown above in the HTML code that you just pasted in a notepad or WordPad.
Note that the red text in your code will be something like this,
http://feedburner.google.com/fb/a/mailverify?uri=Your-FeeD-Title
The end part of the URL above will contain your feed title, so look carefully for this URL in the code that you pasted in notePad

• Now Log into your Blogger account and go to Layout > Page Elements

Then Click on Add a Gadget

Then Choose HTML/JavaScript

• Now Copy and paste the code below into HTML/JavaScript widget.

 
<div style="border: 1px solid DodgerBlue; padding: 5mm;">
<center><img src="URL of Email Icon"/></center>
<span style="font-weight: bold;font-size:small;">Subscribe by E-mail & receive free updates of these cool Tips N Tricks straight to your inbox!</span>
<form action="http://feedburner.google.com/fb/a/mailverify" style="padding: 3px; text-align: center;" target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=TntByStc', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><center style="font-weight: normal">Enter your email address:</center><p><center><input type="text" style="width:140px" name="email"/></p></center><center><input type="hidden" value="TntByStc" name="uri"/><input type="hidden" name="loc" value="en_US"/><input type="submit" value="Subscribe" /></form></center>

NT:- The Code in your notepad will be used only to get some info out of it. Our main code is the code above.
Please adjust the code according to your preferences in the following way,

1. DodgerBlue : This refers to the colour of the frame/outline surrounding the Email form, You can change it to any colour. For example, White, Black, Red , Green etc.
2. URL of Email Icon : This refers to the URL of your Email Icon. Please first choose a Email Icon of your choice by clicking here Once you have download your Email Icon, upload it to Photobucket and get the URL for it. Then simply replace the text URL of Email Icon with your Email Icon URL.
3. http://feedburner.google.com/fb/a/mailverify : Replace this text with a similar URL in your code that you had copied in a notepad.
4. http://feedburner.google.com/fb/a/mailverify?uri=TntByStc : Replace this URL with the URL in the notepad code.
5. The bolded Black Text refers to the text that appears below your Email Icon and above Email form. You can change it to anything that suits your blog topic.
6. TntByStc: Replace this text with your Feed Title. I hope you know what’s your feed title if not then read this post
7. Subscribe : This is the text that appears on the Email button. You can change it to anything you like. For Instance: Submit, Hit Me!, Join Me! etc.

Once you have adjusted the code according to your preferences, simply click the Save button in the HTML/JavaScript Widget.
Now visit your blog to see a pro looking Subscription Email Form hanging on your sidebar :)
Just like the one below,

I hope it works for you. Enjoy!

Read More

Recent Comments with Avatar Widget

51

15/07/2011 Thời lượng đọc: 2:58

Tiện ích Nhận xét mới nhất có Avatar (Recent Comments with Avatar Widget) có thể nói là một trong những tiện ích khó hoàn thiện nhất đối với blogspot. Gần đây blogger Fan Dung đã nghĩ ra cách kết hợp PHP để lấy Avatar cho tiện ích Nhận xét mới nhất, tuy nhiên khuyết điểm lớn vẫn là tốc độ load khá chậm, một vấn đề không dễ khắc phục.

Trong lúc chờ Blogger có những cải tiến trong thời gian tới, mình đã phát triển từ script của Fandung.com để tạo tiện ích Nhận xét mới nhất có Avatar với tính năng lấy Avatar riêng cho người nhận xét với tư cách: OpenID, Tên/URL, Nặc danh, Blogger. Riêng đối với người nhận xét với tư cách đăng nhập tài khoản Blogger, hiện tại mình chưa tìm ra cách để lấy Avatar tự động (vừa tự động vừa load nhanh) cho nên phần này mình Add Avatar thủ công (ở đây đã Add Avatar cho một số người nhận xét thường xuyên trên các blogspot phổ biến hiện nay, bạn có thể tự nghiên cứu và Add thêm Avatar vào). Cho dù hơi thủ công song hiệu quả đem lại cho tiện ích vẫn là tốc độ load nhanh.

Hy vọng trong thời gian tới các cao thủ sẽ cùng nhau hợp lực để hoàn thiện tiện ích Nhận xét mới nhất có Avatar.

Bạn có thể xem Demo trên phần sidebar của Thủ thuật Blogger.

Để cài đặt tiện ích này, bạn chỉ cần đặt đoạn code bên dưới vào một tiện ích HTML/Javascript.

<style type="text/css">
img.rcavatar-photo {
float:left;
margin-right:7px;
border:solid #ddd 1px;
padding:1px;
height:50px;
width:50px;
}
.rcavatar-content {float:left;margin:0;width:220px}
</style>
<script type="text/javascript">
var cm_num = 7; // Số nhận xét được hiển thị
var cm_desc = 65; // Số ký tự thể hiện độ dài nhận xét
var homepage = "http://huynh-nhat-ha.blogspot.com"; // Bạn cần thay tên blogspot
var cm_avatar = new Array();
cm_avatar['admin'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiYSL-BRlvCnqavtYL3r7w1xZBLQityIy2Pu-R_WzWYxNRzI_Kf4RYc1Uh5GAqVxcjeW3nJfDcerMF53TD7Sfc7sWYGAuE5Pae2D2VcD_Jcc07BpnBwHFaj_yByTSCWOKqHBGyCfKeX3s/s45/hnhico.JPG"; // Bạn cần thay URL_avatar_của bạn
</script>
<script type="text/javascript">
// Recent Comments with Avatar Widget Styled by Bloggerism
// This widget is developed from the origin script by Fandung.com (Many thanks to Fandung.com)
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'';
}

function showRCommentsAvatar(json){
var entry = json.feed.entry;
var str = "<div id=\"rcommentwg\"><table><tbody>";
var month = [1,2,3,4,5,6,7,8,9,10,11,12];
var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
for(var i=0; i < cm_num; i++){
var avatarUrl = entry[i].author[0].uri;
var avatarT = "";
cm_avatar['blogger'] = "http://sites.google.com/site/ngonngulaptrinhvn/files/blogger.gif";
cm_avatar['openid'] = "http://sites.google.com/site/ngonngulaptrinhvn/files/openid.gif";
cm_avatar['livej'] = "http://sites.google.com/site/ngonngulaptrinhvn/files/lj.gif";
cm_avatar['wp'] = "http://sites.google.com/site/ngonngulaptrinhvn/files/wp.gif";
cm_avatar['typekey'] = "http://sites.google.com/site/ngonngulaptrinhvn/files/typkey.gif";
cm_avatar['aim'] = "http://sites.google.com/site/ngonngulaptrinhvn/files/aim.gif";
cm_avatar['anon'] = "http://sites.google.com/site/ngonngulaptrinhvn/files/anon.gif";
cm_avatar['URL'] = "http://4.bp.blogspot.com/-V3oK-eTJsUY/ThRxbiluYHI/AAAAAAAAAEQ/NvbhzoGYjCk/s1600/OpenID.jpg";
cm_avatar['fandung'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgK_466YrqdstSFybdg4HZgUzCy8-hxHH0C-He13eGBepCP7S2EV9ft6_O0RIzJELbvUwMID-Gw-8xcdtIUQ3KX5B1ndaIAAUkszq0liQ2DvabjbrUrWCYJAKn0r1TGG5oz9gZWxN6FVS0/s45/avatar100.png";
cm_avatar['duypham'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5-qhVUlHgksD54NDjKiuD4qz-OAm3QYj55EWjoB-u6nyMCYnvfd5dKyDqZmgUm4M7AQaKLySGpoqK3Vzwf91esl_mKYRc9r4pPXqR1bsOuNN6kaBw0e_q6Lnzeb7R_OBJEkb_d1A5MsU/s45/duypham.jpg";
cm_avatar['vietutd'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqaxUCFuvEcPmTfQCehNd86Fm-igTNVgAMo4v4iMWA4aJwjn3prMNy69atT53RBZ9phx1tcFz28hk1CcyAWXn5DErlD1C-dHw_NuoInHF-jONHJqrzHynlHG2t_yXubP5DWhqHCb9Xer4T/s45/images%3Fq=tbn:-1iWiTbjJUd_dM:b";
cm_avatar['ngonluanhoblog'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDox7Xr993EaThrmfVlUdjjPqM3kA6Mt6a1ZvReAs7pUytZ2-wDY1rRDjB4N1VW3VPCWXNctGV9LOBrmHhtD6Glbqq6voExKxcMHaIWWL5qGhjCujvfwTSFLNKgUd9et4GLKTkhzMGOxI/s45/tl-Jesus1.gif";
cm_avatar['noctblog'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxxOnQHh8HpPyDzvRVXEGPWY3JY6-axQINL1JUNNBVXlvJne3WnOVi9pS2vTy70z9wyzLYLmJDtDcJvOy0lJzXZO1bPR1ahcS1SlMYD-nPK5_N-x8J1Zh1DzsxFSafx7wXiD5mFIJe3Oc/s45/noct.png";
cm_avatar['pikarock'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDLub_Jns3h3LSK9Tqnpi0aYP1C3N0FKMys7DIKu-wO-9SBcc5nSycaStV1g24fkecPHVbORe_xQOzJ3wnV-0KZgcw5KF9KhRnzITuVT7P0yeEQJkdbyrrHxZyT5sG8wz1Y4Z9usbfAu0/s45/Death_Metal_by_funkyalien.jpg";
cm_avatar['ngankvn'] = "http://3.bp.blogspot.com/-gZgBoAFMErw/ThCak4Gh8MI/AAAAAAAAAFU/8cScPH7OWUE/s45/favavatar.png";
cm_avatar['linkfoci'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjaG2fE3I-iGYQ1UIqwUXUimT_DhFpGoR88gf_wezGepCh2wD-qLdZZf1RB9reuKIZi-oStrP8qJttOt_5BfM2sXOdjHBfDniWCt9LPuXBuROE_YE9EgWJf0c2msgjAYBRyDrjK37t0Cc/s45/llogo.PNG";
cm_avatar['peace1981'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy68vag5NSxOz4jvF4A3gagh1KT3HnahjWn-TEoW_G7wjSjm4YODUaG14aevPNMX_kXS3DErQoVnS1IaAsIGGAFUYNVziussb74pfKLAw6Nv_juFJX09CqwYo8XA_A0rIVhdorSLIbgT_c/s45/mrBinh-2.jpgG";
cm_avatar['lamkan'] = "http://1.bp.blogspot.com/-uhdosx9r8E4/Thvt9mN9F5I/AAAAAAAAAig/wGvXuo6hcPM/s220-h/8.jpg";
cm_avatar['ngoctri'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzZZ4nAGUEBEL1_P-FawGfOwBsci3XUmoR6VJdotTuU3gHvtFA934tXaHWzSmS6WEn5u0_iDQgVN4n6aZMW8SxEqbW_y7vy7pxEvGpzqItQwaiRWMS6C2s4Gqjioe3Zp9EUkHh_qO9G_nV/s45/75.gif";
cm_avatar['choiblogtk'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYk0bdzeKbkNZGtVkONe4ec4XtQ30ehXBkZWlm4nkKF5_z1455vhtwAgE1F-7zEEnTKUlZ1Manedn8kL_rZ1zIYGBcq1JC35_ZQ5M53WWdTPZ6rQAYPEeGZQ7kSaQlqk4zgVQ02wD-WRRQ/s45/choiblog.tk.jpg";
cm_avatar['jack'] = "http://2.bp.blogspot.com/-koOIGb0xFdU/TWVDOW5lbUI/AAAAAAAAADE/cBWa_NXPIs4/s45/ok.jpg";
cm_avatar['maythy'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNWLP6YsCNCXvtfSzOiLBayYqBnDyVd9Ep8CtTvuhiDTEc-w38wyej7WJqqGZUOVOZ44xndSDBwRYl-6sM840e8oT98fSNLJWxzPNrJR1U9NdG3PtXpk0mktGa5D2MQcvU7i-puhnw_JY/s45/Avatar_Bocap.jpg";
cm_avatar['minhquan'] = "http://4.bp.blogspot.com/-8XgvqA_zNT4/Tdh9_v0jdBI/AAAAAAAAA84/USnRmzoNm4M/s45/Co%25252BBa%25252BLa%25252B%2525252";
cm_avatar['tiennguyen'] = "http://3.bp.blogspot.com/-Tnh6MGeZ7VY/TYoBQZdJODI/AAAAAAAAAuo/SV1sn4Kd3VQ/s45/profile.png";
cm_avatar['docchieublog'] = "http://2.bp.blogspot.com/-6vyfD1QBaz4/TejppnGNqPI/AAAAAAAAAQI/oOnBiA5noWI/s45/truong-sa-hoang-sa-la-cua-viet-nam.jpg";
cm_avatar['meoblog'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiysu3meL_JrkbkUb3OjSF9DQ0-oaRXzIbg9ReLb_se2HRbK0nZYxM44pQMb3juEh6qXIDIg5dmB7JtY9vcuYbPgiX4CFM-FB2HwI8jb7TqEGF0Yc4kbPbiRoWmqqT9XutsIWSFjjCN1DQo/s45/meoblog_logo.jpg";
cm_avatar['dnh'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijliTsWU82F70s2cl2k2CKJWKrHuiYmmfrQUPVk-E8EcF7tnTvZnInO7PcOBo4GfbfDFBNRmYmK0AnMpXqGn2xN4BDsea148Gx3u9hoKUuuS5Hfte1rljAKw1PBS6hoC4dYTTu97h6NJI/s45/tem_phu_thuy_%252525286%25252529.jpg ";
cm_avatar['quocvinh'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWNWsLQK51dsOhUEv9Na2d_DYCjUJ2xu5R2KenEyx4R3dj-ZeegTY0bO6iRR0JlgZbeQmo6JAZ8x08DSR-PfUnB-nc9Dfdk_m8JqXtguh4hZG4YiZgXKTYtNptcVAhgByCe8WC9FFK-x_s/s45/Picture%25252B003.jpg";
cm_avatar['yolks'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdJKXjLgd3fw-lB3uOtTat9zzaVHGRB63SxQlPo6WiFD_llWk7F5uyaukFa938KPpKb2Y5MFkMszFIPf0e_rQs5XdkZ5ELsxy9gG3q-de71PiSIJpZxquLpgGucTG6JNHjz8NGP52F-5g/s45/IMG_1431.jpg";
cm_avatar['ruabien'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjntPSACJXtMLn88MmuGOdxYY1GNsdB4B-2kFptZmnmmOxv-bliHDn9kiUuT7waQUdTv07JbG_A9_rRTin6cffbDPtR1m9biVMh-hMIEGoZGXgk4m6HfeXXXzEEk1RfKRXz7UsTPEtM8Eo/s45/avatar1.jpg";
cm_avatar['dakewo'] = "http://3.bp.blogspot.com/-gncJREes8_Q/Tf8Nylw_KqI/AAAAAAAAAA0/xwYwCcVp9aI/s45/avatar.jpg";
cm_avatar['friends-pc'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9yHonN3CaV8zR6TI-0bmMAU5AVU20lYF6mx0JfqGebZWtmwWSOBxW4hxWl01R2tADQE24R4sfPjmQfGwuBVObX0L4V2BrCvUHey1B4wCwgOO6RTrVDQk820e0Aqjw_EyDUkNvxmuVDLGT/s45/1799078.gif";
cm_avatar['ltvinhtrung'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyOa73W9PrE__3tE1FMbp_u3nuuVg0qxy4ogZO8r_iy1Yk_HN314YUBX13YpNkIBjMIxKVjTLWbRF58UHGvfJSlO9aZoh6JGfJn2kY5NrBum9TXQxZNirV2HiwUmJ0sp1DBfupGcXInx9u/s45/3-14.jpg";
cm_avatar['kenbin'] = "http://2.bp.blogspot.com/-aac8p5V1dNc/TYH4l373ywI/AAAAAAAAASI/s62YDZRz6n8/s45/kenbin.jpg";
cm_avatar['tronghieudo'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHASt2VaTlxvSOl7IIC59p_fv3ax3ENPGZxFLhBFsiAguCljw8mx6BqUPxloKcgy48pUeQLlOZQYK_wdbA0AZ7ZDEgMP8OoQI9EiOLLxlE0iFKeqrqGhHN_vR1wwiAO9-15TPq5qwnX9Q/s45/favavatar.png";
cm_avatar['NAD'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQRJGE_7tMIgSXc5VABiKYA_SCbWpu0t2lPFM6hq7EjYIoz8DUZdxkzysbTVBKp6BvFqQL9VITjaC0xDnKrYVn8gfVy3p3rwY3BA0GGaE-9dEp1qMb5Ruoer-AbtO9hs10AjoSGGfFar4/s45/1.jpg";
cm_avatar['sieudan'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_OIn9OaXw4czjnQSnlfegWIqB7kfT0pjSCDta3xwLy94dlPQ-zZVLkkUU2O1HWB4yqt-TKd_Ei7hTrPSJ197fO2Nuy3g5PNsAc71uM32cT8B0hXb46YcMHMMx6cdgxf9NZEluSifz9Ra3/s45/sm7green29.gif";
cm_avatar['FPT'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjI0byho_c3t8NbqkTm40USSJxtLntLhs4OT1jzwYnDLPUU5d2mXRrzEPZhWbHONdtThhJXGySRAv9V4boJUw3LSa1tjTf9agMY9w-TeiuxmssrRhJB0oZz01-R1zkwmSRmGcxuTSPq39U/s45/fdt.png";
cm_avatar['dvdhay'] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYC-UYQBF36HVwHZceu9Pn_93gBtyT3BemNM2tbz2d4BJUTtDeKo0hUACiIXi5DnAoAjs47t1HkrThKpP7UxpQMXoYzjsZIxwZWCQNiux9XKsJS3zRTxwg81TkGlLitlh_5nMklk_SWRA/s45/lion.gif";
cm_avatar['flyindream'] = "http://2.bp.blogspot.com/-G796keL4VAs/TgX-hHMaw8I/AAAAAAAAAAs/KRa1KXgpXPE/s45/jpg.JPG";
cm_avatar['CAA'] = "http://1.bp.blogspot.com/-9NHDqwvuezE/TfnQEA2NE2I/AAAAAAAAAHo/ReGrW3wZjeE/s45/caaavatar.jpg";
cm_avatar['ngvanquyet'] = "http://2.bp.blogspot.com/-C2YHmn0Froc/Tdt5qjpSyrI/AAAAAAAAAAw/OwDh0hcIpxI/s45/avui%25252B%252525282%25252529.jpg";
if(avatarUrl != undefined) {
if(avatarUrl.$t.match("openid.net")) { avatarT = cm_avatar['openid'] ;}
else if(avatarUrl.$t.match("livejournal.com")) { avatarT = cm_avatar['livej'] ;}
else if(avatarUrl.$t.match("wordpress.com")) { avatarT = cm_avatar['wp'] ;}
else if(avatarUrl.$t.match("typekey.com")) { avatarT = cm_avatar['typekey'] ;}
else if(avatarUrl.$t.match("aol.com")) { avatarT = cm_avatar['aim'] ;}
else { avatarT = cm_avatar['URL'] ;}
} else { avatarT = cm_avatar['anon'] ;}

if((avatarUrl != undefined)&&(avatarUrl.$t.match("blogger.com"))) {

if(avatarUrl.$t.match("00819429141342166010")) { avatarT = cm_avatar['admin'] ;}

else if(avatarUrl.$t.match("04749296400753058357")) { avatarT = cm_avatar['fandung'] ;}
else if(avatarUrl.$t.match("03406573641353342194")) { avatarT = cm_avatar['duypham'] ;}
else if(avatarUrl.$t.match("03463239749923138128")) { avatarT = cm_avatar['vietutd'] ;}
else if(avatarUrl.$t.match("00394797142582927042")) { avatarT = cm_avatar['ngonluanhoblog'] ;}
else if(avatarUrl.$t.match("07667678827100174942")) { avatarT = cm_avatar['noctblog'] ;}
else if(avatarUrl.$t.match("17934661533414417935")) { avatarT = cm_avatar['pikarock'] ;}
else if(avatarUrl.$t.match("08081804098876491411")) { avatarT = cm_avatar['ngankvn'] ;}
else if(avatarUrl.$t.match("09150363550015559876")) { avatarT = cm_avatar['linkfoci'] ;}
else if(avatarUrl.$t.match("08159474113157885933")) { avatarT = cm_avatar['peace1981'] ;}
else if(avatarUrl.$t.match("08859270718754508893")) { avatarT = cm_avatar['lamkan'] ;}
else if(avatarUrl.$t.match("11488199157704379781")) { avatarT = cm_avatar['ngoctri'] ;}
else if(avatarUrl.$t.match("17175170721363050062")) { avatarT = cm_avatar['choiblogtk'] ;}
else if(avatarUrl.$t.match("13455864297260715381")) { avatarT = cm_avatar['jack'] ;}
else if(avatarUrl.$t.match("17461453341115540341")) { avatarT = cm_avatar['maythy'] ;}
else if(avatarUrl.$t.match("09625147383808730119")) { avatarT = cm_avatar['minhquan'] ;}
else if(avatarUrl.$t.match("00694403864029897588")) { avatarT = cm_avatar['tiennguyen'] ;}
else if(avatarUrl.$t.match("17188553889409828971")) { avatarT = cm_avatar['docchieublog'] ;}
else if(avatarUrl.$t.match("15435536641465159793")) { avatarT = cm_avatar['meoblog'] ;}
else if(avatarUrl.$t.match("13598836957495328298")) { avatarT = cm_avatar['dnh'] ;}
else if(avatarUrl.$t.match("14277559706768218175")) { avatarT = cm_avatar['quocvinh'] ;}
else if(avatarUrl.$t.match("12370263214001932442")) { avatarT = cm_avatar['yolks'] ;}
else if(avatarUrl.$t.match("11167880363909195136")) { avatarT = cm_avatar['ruabien'] ;}
else if(avatarUrl.$t.match("08759870998954144571")) { avatarT = cm_avatar['dakewo'] ;}
else if(avatarUrl.$t.match("12666334461939360660")) { avatarT = cm_avatar['friends-pc'] ;}
else if(avatarUrl.$t.match("12625548826737813579")) { avatarT = cm_avatar['ltvinhtrung'] ;}
else if(avatarUrl.$t.match("02896728987986345766")) { avatarT = cm_avatar['kenbin'] ;}
else if(avatarUrl.$t.match("15051849591008262422")) { avatarT = cm_avatar['tronghieudo'] ;}
else if(avatarUrl.$t.match("14270963672740050413")) { avatarT = cm_avatar['NAD'] ;}
else if(avatarUrl.$t.match("11191465825758763667")) { avatarT = cm_avatar['sieudan'] ;}
else if(avatarUrl.$t.match("18218312420172917571")) { avatarT = cm_avatar['FPT'] ;}
else if(avatarUrl.$t.match("13461135698133561032")) { avatarT = cm_avatar['dvdhay'] ;}
else if(avatarUrl.$t.match("13302728342955214164")) { avatarT = cm_avatar['flyindream'] ;}
else if(avatarUrl.$t.match("14332535104546283291")) { avatarT = cm_avatar['CAA'] ;}
else if(avatarUrl.$t.match("12411025187254704157")) { avatarT = cm_avatar['ngvanquyet'] ;}
else { avatarT = cm_avatar['blogger'] ;}
}

var imgprofile ='<img class="rcavatar-photo" align="top" src="'+ avatarT +'" />';
str += '<tr>';
str += '<td width="56" valign="top">'+imgprofile+'</td>';
var pdate = entry[i].published.$t;
var m = parseInt(pdate.substring(5,7));
for(var j=0; j<month.length;j++){
if(m==month[j]){
m = month2[j]; break;
}
}
str += '<td valign="top"><div class="rcavatar-content"><div class="rcavatar-author"><a href="' + entry[i].link
[2].href + '"><b>' + entry[i].author[0].name.$t+'</b></a> - <i><a href="' + entry[i].link[2].href + '">'+ pdate.substring(11,16) + '-' + pdate.substring(8,10) + '/' + pdate.substring(5,7) + '/' + pdate.substring(2,4)+'</a></i></div><div class="rcavatar-sum">'+ removeHtmlTag(entry[i].summary.$t,cm_desc)+ ' ... </div></div></td>';

str += '</tr>';

}

str = str + '</tbody></table></div>';
document.write(str);
}
</script>
<script type="text/javascript">
document.write("<script type=\"text/javascript\" src=\""+homepage+"/feeds/comments/summary?max-results="+cm_num+"&alt=json-in-script&callback=showRCommentsAvatar\"><\/script>");
</script>

Việc bạn cần làm là điều chỉnh theo các điểm chú thích được đánh dấu màu xanh trong đoạn code ở trên. Ở phần CSS chỉnh số 220 cho tương thích với chiều rộng phần chứa nội dung nhận xét khi áp dụng trên blogspot của bạn.

Tại dòng

if(avatarUrl.$t.match("00819429141342166010")) { avatarT = cm_avatar['admin'] ;}

Thay chuỗi số được đánh dấu màu đỏ bằng chuỗi số Profile ID của bạn.

Hy vọng bạn có thể tạm thời hài lòng với tiện ích này.

Nguồn Huynhnhatha.Blogspot.com

Read More

Unique Style Page Number Navigation for Blogger

In this post im gonna explain how to add  unique style page number navigation  for  blogger. Most of page number navigation are not working  properly and you have go though the template code to add to your blog. Actually its bit hard to who are new to blog /blogspot. Therefore, you  can add this navigation bar without going  though your theme code.Just add it as widget. Easy huh? And its looks  attractive too. Lets give a try.This Page number navigation bar work properly with every browsers.

You may like these articles

     How to add number navigation widget
     Attractive Numbered Page Navigation Widget
     Colorful Numbered Page Navigation Widget

How to add Unique Page Number Navigation for Blogger

1. Log in to blogger account and Click drop down.

2. Now select "Layout" Like Below.

3. Click Add Gadget and select 'HTML/Javascript

4. Paste below code.

<style type='text/css'>

.blog-pager,#blog-pager{font-family:"Times New Roman", Times, serif;font-weight:normal;font-size:12px;width:700px;padding:17px;} 
.showpageNum a,.showpage a {background: rgb(15, 124, 241);color:#FFF; margin-right:.6em;text-decoration:none;font-size:15px;font-weight:bold;line-height:0;text-align:center;padding:7px 13px 7px;-moz-border-radius:36px;-webkit-border-radius:8px;border-radius:8px;} 
.showpageNum a:hover,.showpage a:hover {background: rgb(0, 49, 247); color:#000000; margin-right:.6em;text-decoration:none;font-size:15px;font-weight:bold;line-height:0;text-align:center;padding:7px 13px 7px;-moz-border-radius:36px;-webkit-border-radius:12px;border-radius:12px;}
.showpageOf{margin:0 8px 0 0;font-family:'Coming Soon', cursive;text-decoration:none;font-size:100%;}
.showpagePoint {background: rgb(0, 49, 247); color:#FFF; margin-right:.6em;text-decoration:none;font-size:15px;font-style:italic;line-height:0;text-align:center;padding:7px 13px 7px;-moz-border-radius:36px;-webkit-border-radius:8px;border-radius:8px;}

</style>

<script type='text/javascript'>

var home_page_url = location.href;

var pageCount=1;
var displayPageNum=3;
var upPageWord ='Previous';
var downPageWord ='Next';

function showpageCount(json) {
var thisUrl = home_page_url;
var htmlMap = new Array();
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

for(var i=0, post; post = json.feed.entry[i]; i++) {

var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);

var title = post.title.$t;

if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
  thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'&max-results='+pageCount;
}
}
itemCount++;
}
for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
 upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}else{
 upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}
fFlag++;
}
if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
  html += '<span class="showpageNum"><a href="/">1</a></span>';

}else{
 html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}
if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}}}
if(thisNum>1){
html = ''+upPageHtml+' '+html +' ';
}
html = '<div class="showpageArea"><span  class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;
if(thisNum<(postNum-1)){
html += downPageHtml;
}
if(postNum==1) postNum++;
html += '</div>';
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");
if(postNum <= 2){
html ='';
}
for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}
if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}}
function showpageCount2(json) {

var thisUrl = home_page_url;
var htmlMap = new Array();
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';
var thisUrl = home_page_url;

for(var i=0, post; post = json.feed.entry[i]; i++) {

var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);

var title = post.title.$t;

if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
 thisNum = postNum;
}
if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'&max-results='+pageCount;
}}itemCount++;}
for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
 upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
 upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}fFlag++;}
if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
 html = labelHtml+'1</a></span>';
}else{
 html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}}
if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}}}
if(thisNum>1){
if(!isLablePage){
html = ''+upPageHtml+' '+html +' ';
}else{
html = ''+upPageHtml+' '+html +' ';
}}
html = '<div class="showpageArea"><span  class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;
if(thisNum<(postNum-1)){
html += downPageHtml;
}
if(postNum==1) postNum++;
html += '</div>';
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");
if(postNum <= 2){
html ='';
}
for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}
if(pageArea&&pageArea.length>0){
html ='';
}
if(blogPager){
blogPager.innerHTML = html;
}}
</script>
<script type='text/javascript'>
var thisUrl = home_page_url;
if (thisUrl.indexOf("/search/label/")!=-1){
if (thisUrl.indexOf("?updated-max")!=-1){
var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"));
}else{
var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"));
}}
var home_page = "/";
if (thisUrl.indexOf("?q=")==-1){
if (thisUrl.indexOf("/search/label/")==-1){
document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ><\/script>')
}else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ><\/script>')
}}
</script>
</script>

5. Now save your HTML/Javascript'. That's all.
If you have any problem regarding to this page Number Navigation Tutorial, just leave a comment.

Nguồn BloggerTrix

Read More

Thiết kế Blogger Template từ A tới Z (Phần 1) - Cấu trúc cơ bản

Bài viết hướng dẫn về Blogger Template thì đi đâu cũng thấy, rất rất nhiều blog đều có hướng dẫn về cách thức tạo, nhưng đa phần là khó hiểu. Bản thân blog mình cũng có một bài viết "Hướng dẫn thiết kế Blogger Template đơn giản" nhưng mà ngẫm lại kĩ thì cũng không đúng với tiêu đề cho lắm. Bài đó hướng dẫn các bạn cách mà các bạn có một Blogger Template và chỉnh sửa nó.

Dạo này cũng nhiều bạn (nhiều là khoảng 3 4 bạn :D) có nhắn tin qua mail cho mình nhờ mình viết bài viết hướng dẫn chi tiết và cụ thế hơn cách thiết kế Blogger Template hoàn chỉnh. Do đó thì bài viết này mình xin cố gắng hơn cái bài kia hướng dẫn các bạn tạo dựng "thiết kế" một Blogger Template hoàn thiện nhất có thể.

Vẫn lưu ý như  bài trước nhé, bạn không nắm HTML và CSS thì hoàn toàn sẽ không thế nắm bắt được. Vì mình không giải thích 2 đưa này mà mình hướng dẫn làm thế nào để tạo ra được một Blogger Template.

Tìm hiểu về Blogger Template

Blogger Template bây giờ sử dụng một ngôn ngữ lập trình đơn giản có tên là XML.Tính cho tới thời điểm hiện tại thì Blogger XML đang được chia ra làm 2 phiên bản, phiên bản "v1" là phiên bản thường được sử dụng nhất hiện nay, nếu trong template của bạn tại thẻ mở "html" ở đầu có thuộc tính sau b:version='2' và class='v2' thì có nghĩ là bạn đang ở phiên bản 2 còn lại nếu không có có nghĩa bạn đăng ở phiên bản 1.

Sự khác nhau giữa 2 phiên bản này thế nào?

Đây là câu hỏi mà chắc chưa ai từng giải thích cho các bạn, theo như nghiên cứu cá nhân của mình trong vòng một năm qua mình rút ra được như sau.

Đối với Blogger XML v1

Bạn được cung cấp những nhu cầu cơ bản cho việc thiết kế Blogger Template như phần css mặc định căn chỉnh những tiện ích (widget) có trên blog và bạn có thể thêm vào tùy chỉnh cho Template như "màu sắc" & "font chữ" của một đối tượng trong phần thiết lập năng cao của blog. Phần thiết lập năng cao bạn có thể tìm thấy tại "Mẫu » Tủy chỉnh".

Đối với Blogger XML v2

Tương tự như phiên bản một, nhưng có nhiều tính năng nâng cao hơn và phần css căn chỉnh cho các widget khác so với v1 (theo cảm nhận thì mình thích xài css của v1 hơn). Nhưng tính năng nâng cao hơn bạn có thể làm là, căn chỉnh "chiều rộng" cho đối tượng có trong phần thiết lập nâng cao. Ngoài ra thì bạn còn có thể tùy biến layout của cả template cho người dùng lựa chọn tại phần thiết lập nữa (nhưng cái này rất rất khó, và cần rất nhiều thời gian để thực hiện).

Cấu trúc cơ bản của Blogger Template

Sau đây là cấu trúc cơ bản của một Blogger template và lời giải thích sơ của mình tại bài viết hướng dẫn đầu của mình trong việc thiết kế Blogger Template

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE html>

<html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>  <!-- xóa 2 thuộc tính quyết định v2 để trờ về v1 -->


<head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <b:include data='blog' name='all-head-content'/>

    <title><data:blog.pageTitle/></title>

    <b:skin><![CDATA[   ]]></b:skin>

    <b:template-skin><![CDATA[   ]]></b:template-skin>  <!-- Chỉ có ở v2 -->

</head>


<body>

    <b:section class='main' id='main' showaddelement='no'><b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/></b:section>

</body>


</html>

ở đây mình sẽ giải thích những thành phần cơ bản như sau, đầu tiên "<b:include data='blog' name='all-head-content'/>" theo mình thì bạn nên tham khảo qua bài viết trước đây của mình "Tạo và sử dụng thẻ includable trong Blogger" để hiểu includable và include là gì trước. Đây là lời gọi "hàm" giúp lấy ra toàn bộ thông tin mặc định mà Blogger cung cấp cho chúng, những mặc định Blogger đã giấu hàm imcludable đi nên bạn không có quyền thay tác động vào nó. Nhưng bạn vẫn có thể tự viết lại nó.

Tiếp theo 2 loại thẻ "b:skin" và "b:template-skin" là phần căn chỉnh css cho Blogger XML, nó sẽ tự động được chuyển qua thẻ "style" khi xuất hiện với người dùng. Thế tại sao không dùng thẻ "style" luôn, 2 thẻ này thêm vào chi vậy? Đây chính là cái đặc biệt bên trong 2 thẻ này, bạn có thể tạo ra một giải giá trị để áp dụng cho thẻ css, nhưng giá trị này có thể được người dùng sử dụng trong phần thiết lập nâng cáo mà mình đã nói ở gần đầu bài.

Tới "section" và "widget" mình đã có dịp giải thích về 2 đối tượng này ở bài "Hướng dẫn thiết kế template Blogger đơn giản" bạn hãy tham khảo qua để nắm cơ bản, mình sẽ giải thích chi tiết hơn từng widget ở các phần tiếp theo, nó nằm ở khoảng giữa bài viết nhé.

Kết lại

Tạm dừng tại đây nhé, đây là phần đầu tiên trong serial bài viết hướng dẫn thiết kế Blogger Template của mình, mình đã giới thiệu cơ bản cho các bạn biết về ngôn ngữ lập trình của Blogger là Blogger XML và cấu trúc cơ bản của nó. Trong phần sau ta sẽ tiếp tục tìm hiểu chi tiết hơn về những cái mà mình đã giải thích một cách tóm gọn ở trên, mời các bạn đón xem.

P/S: Các bạn có thể tham khảo trước các bài về Blogger XML của mình, đặc biệt là bài về data nhé, nếu các bạn hiểu thì mình tin chã cần tới những bài viết tiếp theo của mình nữa đâu :D

Xem tiếp phần 1 : Cấu trúc cơ bản

Xem thêm phần 2 : TÌm hiểu về thẻ <b:skin>

Xem tiếp phần 3: Tìm hiểu về Blogger XML

Xem tiếp phần 4:  Cách thức hoạt động của một Widget

Bạn có thể xem thêm các bài:

• Những Code Thông Dụng Cho Blogspot
• Cách thêm tiện ích (widget) vào vị trí bất kỳ trong blogspot
• Code tạo hình nền và chia cột cho bài viết Blog
• Thủ thuật tạo chữ chuyển  động cho Blogspot
• Hướng Dẫn Thiết Kế Template Blogger
• Tìm hiểu về thẻ META trong HTML

Read More

Tạo Floating banner (Quảng cáo trượt) cho Blog và website

Hôm nay mình sẽ hướng dẫn các bạn tạo quảng cáo trượt (floating banner), một trong những loại hình banner được ưa thích của các admin cũng như của khách hàng bởi tính hiệu quả cao của nó.

Kiểu float này giống kiểu trượt quảng cáo của Admicro mà các bạn có thể gặp ở các trang Vtc.vn, Kenh14.vn  đang áp dụng kiểu quảng cáo dạng trượt này. 

Hướng dẫn làm quảng cáo Float trên sidebar theo chiều xem trang của khách truy cập

• 1. Đăng nhập Blogger 
• 2. Vào Mẫu, chọn chỉnh sửa HTML
• 3. Chèn code bên dưới vào  sau thẻ  <head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'"type="text/javascript">

</script>

Nếu bạn nào trong template đã có file jquery.min.js rồi thì bạn bỏ qua bước 3 này

• 4. Save template lại và mở tab Bố cục>Thêm tiện ích (Nơi bạn muốn chèn quảng cáo ) 
• 5. Thêm 1 HTML/Javascript và chèn code bên dưới vào nó

Thêm vào đoạn code sau :

<style type='text/css'>
#floatDivWrapper {font-size:11px}
#floatDiv.fixed {position:fixed;top:30px}

</style>

<script type='text/javascript'>//<![CDATA[
$(document).ready(function(){var documentHeight=$(document).height();if(documentHeight>2500){
//$("#floatDivWrapper").css('position','fixed');$("#floatDiv").css({'position':'fixed','top':30});
var bottomHeight=1200;var msie6=$.browser=='msie'&&$.browser.version<7;if(!msie6){var top=$('#floatDiv').offset().top-parseFloat($('#floatDiv').css('margin-top').replace(/auto/,0));$(window).scroll(function(event){var y=$(this).scrollTop();if(y>=top&&y<=(documentHeight-bottomHeight)){$('#floatDiv').addClass('fixed')}else{$('#floatDiv').removeClass('fixed')}})}}});
//]]></script>
<script type='text/javascript'>//<![CDATA[
var s=true;function doBlink(){$('.blink').css('display',function(index,val){s=!s;return (s)?'block':'none';})}
$(document).ready(function() {setInterval("doBlink()",0)});
//]]></script>

<div class='widget HTML' id='floatDiv'>

Chèn nột dung muốn hiển thị

</div>

• 6.Lưu và xem kết quả

Chú ý một số thông số để tuỳ chỉnh :

 + top:30px : Khoảng cách của widget Ads với lề trên của trang web,thường đặt là 0.Nếu bạn nào có menu header cố định thì sẽ thay đổi cho widget dãn xuống phù hợp(bachkhoamedia là 30)

+ documentH>1000 : Thông số này có nghĩa là nếu bài viết của bạn dài quá 1000px thì widget sẽ float, còn nếu bài viết có height nhỏ hơn 1000px thì widget sẽ không float

+bottomHeight=1400 : Thông số này quy định chiều cao tối thiểu mà widget có thể xuống được.Khi cách lè dưới 1400px thì widget sẽ tự động trượt lên trên. Các bạn chỉnh sử thông số này sao cho phù hợp nhất với footer của các bạn.

Chúc các bạn thành công !
Nguồn chép:

http://htrin.blogspot.com/

Read More

Hướng dẫn đăng ký và sử dụng FeedBurner cho Blogger

Cho dù dùng Blogspot hay Wordpress, các admin hay sử dụng dịch vụ Feedburner cho phép đăng ký nhận tin qua email hay tự động đăng bài viết lên mạng xã hội như Twitter, Facebook.

1. FeedBurner là gì?

Feedburner bản chất là một dịch vụ tiện ích cho blog của bạn theo dõi những người đăng ký vào blog của bạn sử dụng RSS. RSS là một công nghệ web có nghĩa là "cung cấp thông tin thực sự đơn giản" ..., đó chỉ có nghĩa đó là một công nghệ cho phép các chương trình khác nhau bám vào trang web của bạn (blog) và lấy nội dung của bạn.

FeedBurner là sản phẩm nguồn cấp dữ liệu miễn phí được Google mua lại vào năm 2007, giúp nhà xuất bản phân tích, tối ưu hoá, quảng bá, và kiếm thu nhập quảng cáo từ các nguồn cấp dữ liệu RSS của họ.

FeedBurner có rất nhiều tác dụng đặc biệt là trong quá trình thiết kế của một trang Web, hiện nây rất nhiều tiện ích yêu cầu phải có feed mới có thể chạy được. 

Read More

Tạo nhãn Tag trên đầu trang bài đăng trong Blogspot

Xin cáo lỗi cùng các bạn, Admin đang trong quá trình tu chỉnh bài viết

Sorry,You are trying to reach an invalid page...!

Click here to go to Homepage 

Have a nice Day...

Read More

Random Ad Banners Widget For Blogger

Random Ad Banners Widget For Blogger

In most blogs which are selling ad spots you often have seen random Ad banners appearing when the page is refreshed. Ever wondered how to show random Ad Banners in Blogger? In today's tutorial we will learn how to create a Random Banner Widget for blogger which will show random Ad banners when a visitor visits a new page on your blog. Using this widget you can display as many Ad banners on a Sponsor Area as you want!

This widget is exactly similar to our previous 125 by 125 AD Banner Widget and in fact it is the most awaited one and have been requested several times by our readers. Just last night I succeeded in creating a simple Java script that uses Array of images and thus displays random images on Page refresh. 

Lets have a demo of the widget before jumping to the tutorial. Note:- Refresh the page to see new Ad banners.

Live Demo

How To Add Random Ad Banner Widget To Your Blogs?

Simply follow these steps,

1. Go To Blogger > Design > Page Elements
2. Choose HTML/JavaScript Widget
3. And Paste the following code inside it,

<div align="center">
<table border="0"  cellpadding="2" cellspacing="6" width="265" bgcolor="#ffffff">
<tbody><tr>
<td><center>
<!--  BANNER#1  -->
< script language="JavaScript">
images = new Array(2);
images[0] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-1' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";
images[1] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-2' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";
index = Math.floor(Math.random() * images.length);
document.write(images[index]);
</script>
< /center></td>
< td><center>
<!--  BANNER#2  -->
< script language="JavaScript">
images = new Array(2);
images[0] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-1' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";
images[1] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-2' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";
index = Math.floor(Math.random() * images.length);
document.write(images[index]);
</script>
< /center></td>
</tr>
<tr>
< td><center>
<!--  BANNER#3  -->
< script language="JavaScript">
images = new Array(2);
images[0] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-1' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";
images[1] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-2' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";
index = Math.floor(Math.random() * images.length);
document.write(images[index]);
</script>
< /center></td>
< td><center>
<!--  BANNER#4  -->
< script language="JavaScript">
images = new Array(2);
images[0] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-1' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";
images[1] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-2' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";
index = Math.floor(Math.random() * images.length);
document.write(images[index]);
</script>
< /td></center>
< /tr>
< /tbody></table>
< table border="0" bordercolor="#0084ce" cellpadding="2" cellspacing="6" width="265" bgcolor="#ffffff">
<tbody>
      <tr>
       <td><center><a href="URL OF ADVERTISER" rel="nofollow"><img width="265" height="37" border="0" alt="Advertise Now!" src="file:///C:/Documents%20and%20Settings/Mohammad/Desktop/ADVERTISE-HERE.gif" /></a></center></td>
      </tr>
    </tbody></table>
< /div>

MAKE THE FOLLOWING CHANGES:-
1.  Replace URL OF ADVERTISER with the website link of the advertiser
2.  Replace URL OF BANNER’S IMAGE-1  and URL OF BANNER’S IMAGE-2 with the Image links of the Advertiser’s banners
3.  Replace AD DESCRIPTION with some information related to the Ad. The description appears on mouse hover.
4.  If you want to increase the distance between the ad blocks then edit width="265"
Now after making the necessary customization view your blog to see a beautiful 125 by 125 Banner widget that will change Banners on every different page.

Download Animated AD Banners

To ad spice to the widget may be you will prefer some of our previously designed animated banners -> Animated 125 by 125 AD Banners
Do let me know how did you find this new and useful widget. Take care! :D

Tài liệu tham khảo thêm

Tạo Banner Quảng Cáo tự động thay đổi cho Web - Blog

Thủ thuật tạo banner Quảng cáo tự động thay đổi cho blogspot

Tạo Floating banner (Quảng cáo trượt) cho Blog và website
Code tạo banner quãng cáo trượt dọc 2 bên blog - Web

Thủ thuật tạo Banner tự động thay đổi cho Blogger
Chèn Banner flash cho blogger
Công cụ chuyển đổi URL (link) Google drive thành link host

Nguồn My Blogger Trick

Read More