Did you see recent post with thumbnail? If yes then you definitely want to add in your blog. Yes you can.
Here are step for that.
1. Log in to your Blogger account.
2. Click Layout >> Page Element.
3. Click on Add Gadget and add below code in it.
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://img195.imageshack.us/img195/7350/blocko.gif";
imgr[1] = "http://img195.imageshack.us/img195/7350/blocko.gif";
imgr[2] = "http://img195.imageshack.us/img195/7350/blocko.gif";
imgr[3] = "http://img195.imageshack.us/img195/7350/blocko.gif";
imgr[4] = "http://img195.imageshack.us/img195/7350/blocko.gif";
showRandomImg = true;
boxwidth = 298;
cellspacing = 8;
borderColor = "#000000";
bgTD = "#000000";
thumbwidth = 40;
thumbheight = 40;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 7;
home_page = "http://.blogspot.com/";
</script>
<script src="http://socheate.googlepages.com/recentposts_thumbnail.js" type="text/javascript"></script>
Change green text with your choice of height and width and blue text with your blog name like http://yourname.blogspot.com
4. Move your Widget as your choice and save it. You are done.
What is next to do?
If you didn't subscribe at then do it now. So, you will not loose any update on this blog.
Sunday, July 12, 2009
Recent Post Thumbnails Widget - Blogger Tweak

Friday, July 10, 2009
How to Put Adsense Inside Your Post (for Blogger or Blogspot)

Adsense inside the post can be considered to increase or optimize your adsense revenue. It certainly can increase your CTR (Click Through Rate). Adsense, there are alternatives to put it inside posting, below the page title (like in this post) or below your article, and you can also set your adsense alignment (right or left). Many blogger or blogspot users experienced difficulties, especially new user to put adsense inside the posting. Well.. it is not too difficult, in this post I will show you the easy way to put adsense inside your post. Just follow this steps to put adsense inside blog post (implement this technique if your blog has "read more..." feature).
1. Get Your Adsense Code
Firstly, log in to your adesense account and create new ads. It is up to you about the ad size, but it is better if you choose large rectangle ads format. Okay now you have the adsense code. You can not put your adsense code directly, you need to "parse the adsense code", how?? Just go to http://blogcrowds.com/resources/parse_html.php ,paste your code and click "Parse". Now select the parse result and copy it.
2. Put Your Adsense Code
Go to blogger.com and log in to your account. Now go to "layout section", edit html. Click "Expand template widget" and find this code
If you want to put adsense below the article, paste the adsense parse result below this tag
If you want to put adsense above the article (below the page title), paste the adsense parse result above this tag <data:post.body/> or <p><data:post.body/></p> . You need to position it before you save your template. Wrap your adsense parse code with
For Example :<div style='float: alignment left or right (choose one)?;'>
<script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxxxxx";
google_ad_host = "pub-1599271086004685";
/* 336x280, created 5/25/09 */
google_ad_slot = "9262982660";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
<p><data:post.body/></p>
3. Save and Confirm
Done !!! See the result... :)
Saturday, June 27, 2009
Customizing Blogger post Navigation script

Blogger Blogs have default post navigation script which allows user to navigate between posts.It consists of ” older posts” , “Newer posts” and ” Home page” link. Since it’s default , no CSS codings are added for the navigation script. So in this post I will explain how to modify the script and to add background images and then aligning the older posts and newer posts links properly.
Know the script codes
Before explaining how to customize the codes , I would like to explain the tags involved in the blogger templates which control the blogger post navigation script.
CSS codes
Firstly, let us see the default code included in minima or Rounders blogger template.
float: $startSide;
margin-$startSide: 13px;
}
#blog-pager-older-link {
float: $endSide;
margin-$endSide: 13px;
}
#blog-pager {
text-align: center;
}
instead of startside and endside we can have left and right respectively.
#blog-pager-newer-link : this code contains the css necessary for newer posts link
#blog-pager-older-link : this code contains the css necessary for older posts link
and #blog-pager controls the contains necessary for Home page links.
If you are using custom blogger template , then you will find something like this :
#blog-pager-newer-link {
padding-left : 20px;
border : none;
float : left;
}
#blog-pager-older-link {
float : right;
padding-right : 20px;
border : none;
}
#blog-pager {
padding : 0 15px 0;
text-align : center;
}
.blog-pager a {
color : #cc0000;
}
.blog-pager a:hover {
color : #cc0000;
}
XML tags which shows the post navigation links
Now let us see the default tags included in the blogger templates which shows post navigation links.To see this tag , you need to check ” expand widget templates” option in EDIT HTML page of the blogger template.
There you can find the following tag
<div class=’blog-pager’ id=’blog-pager’>
<b:if cond=’data:newerPageUrl’>
<span id=’blog-pager-newer-link’>
<a class=’blog-pager-newer-link’ expr:href=’data:newerPageUrl’ expr:id=’data:widget.instanceId + "_blog-pager-newer-link"’ expr:title=’data:newerPageTitle’><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond=’data:olderPageUrl’>
<span id=’blog-pager-older-link’>
<a class=’blog-pager-older-link’ expr:href=’data:olderPageUrl’ expr:id=’data:widget.instanceId + "_blog-pager-older-link"’ expr:title=’data:olderPageTitle’><data:olderPageTitle/></a>
</span>
</b:if>
<b:if cond=’data:blog.homepageUrl != data:blog.url’>
<a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>
<b:else/>
<b:if cond=’data:newerPageUrl’>
<a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>
</b:if>
</b:if>
</div>
<div class=’clear’/>
</b:includable>
As mentioned in the CSS codes itself,
- <b:if cond=’data:newerPageUrl’> contains the code to show newer post links.
- <b:if cond=’data:olderPageUrl’> contains the code necessary to show older posts link.
- <b:if cond=’data:blog.homepageUrl != data:blog.url’> will contain the code necessary to show Home Page Link.
Hope now you know about the code which controls the Older post and Newer post links for post navigation. Now let us see how to customize this script to suit our blogger template.
Adding background image along with text
Let us see how to add Background image to the text Older Posts and Newer Posts.
Go to EDIT HTML SUBTAB and then search this following code or similar.
float: $startSide;
margin-$startSide: 13px;
}
#blog-pager-older-link {
float: $endSide;
margin-$endSide: 13px;
}
#blog-pager {
text-align: center;
}
Now replace the whole code with
#blog-pager-newer-link {
background : url(http://i43.tinypic.com/11bro1s.jpg) no-repeat left 0%;
padding-left : 20px;
border : none;
float : left;
}
#blog-pager-older-link {
float : right;
background : url(http://i44.tinypic.com/2n6dirp.jpg) no-repeat right 0%;
padding-right : 20px;
border : none;
}
#blog-pager {
padding : 0 15px 0;
text-align : center;
}
.blog-pager a {
color : #cc0000;
}
.blog-pager a:hover {
color : #cc0000;
}
In that you can change the background images and then customize the color of the text. That’s it now save your template , you can find something like this :
Replace Image with Background images
To replace the “older posts” , ” Newer Posts” and “Home” text with background images , follow these simple steps.
replace the css code for blog post navigation widget with this code
#blog-pager-newer-link {
padding-left : 20px;
border : none;
float : left;
}
#blog-pager-older-link {
float : right;
padding-right : 20px;
border : none;
}
#blog-pager{
padding:50px 10px 10px 10px;
text-align:center;
}
.blog-pager a{
color:#A10000
}
.blog-pager a:hover{
color:#15FFED
}
and then save your template. Now check ” Expand Widget Templates” option and now replace the
<div class=’blog-pager’ id=’blog-pager’>
<b:if cond=’data:newerPageUrl’>
<span id=’blog-pager-newer-link’>
<a class=’blog-pager-newer-link’ expr:href=’data:newerPageUrl’ expr:id=’data:widget.instanceId + "_blog-pager-newer-link"’ expr:title=’data:newerPageTitle’><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond=’data:olderPageUrl’>
<span id=’blog-pager-older-link’>
<a class=’blog-pager-older-link’ expr:href=’data:olderPageUrl’ expr:id=’data:widget.instanceId + "_blog-pager-older-link"’ expr:title=’data:olderPageTitle’><data:olderPageTitle/></a>
</span>
</b:if>
<b:if cond=’data:blog.homepageUrl != data:blog.url’>
<a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>
<b:else/>
<b:if cond=’data:newerPageUrl’>
<a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>
</b:if>
</b:if>
</div>
<div class=’clear’/>
</b:includable>
with this code
<div class=’blog-pager’ id=’blog-pager’>
<b:if cond=’data:newerPageUrl’>
<span id=’blog-pager-newer-link’>
<a class=’blog-pager-newer-link’ expr:href=’data:newerPageUrl’ expr:id=’data:widget.instanceId + "_blog-pager-newer-link"’ expr:title=’data:newerPageTitle’><img alt=’techieblogger.com’ src=’http://i69.photobucket.com/albums/i42/queenofdreamsz/NextIcon.gif’ title=’Newer Post’/></a>
</span>
</b:if>
<b:if cond=’data:olderPageUrl’>
<span id=’blog-pager-older-link’>
<a class=’blog-pager-older-link’ expr:href=’data:olderPageUrl’ expr:id=’data:widget.instanceId + "_blog-pager-older-link"’ expr:title=’data:olderPageTitle’><img alt=’Techie Blogger’ src=’http://i69.photobucket.com/albums/i42/queenofdreamsz/BackIcon.gif’ title=’Older Post’/></a>
</span>
</b:if>
<b:if cond=’data:blog.homepageUrl != data:blog.url’>
<a class=’home-link’ expr:href=’data:blog.homepageUrl’><img alt=’Techie Blogger’ src=’http://i85.photobucket.com/albums/k47/bongmalove/icon/home.gif’ title=’Home Page’/></a>
<b:else/>
<b:if cond=’data:newerPageUrl’>
<a class=’home-link’ expr:href=’data:blog.homepageUrl’><img alt=’Techie Blogger’ src=’http://i85.photobucket.com/albums/k47/bongmalove/icon/home.gif’ title=’Home Page’/></a>
</b:if>
</b:if>
</div>
<div class=’clear’/>
</b:includable>
You can change the images included with your own blog navigation images. After that save your template and check your blog. You can find a blog navigation links something like this :

Show blog post navigation above posts title
You can also show the blog post navigation script above post title too. In order to implement this hack , go to EDIT HTML page of your blog and check ” EXPAND WIDGET TEMPLATES” option. Now search this tag in your template.
- <b:includable id=’main’ var=’top’>
Now paste the following code immediately below it
<b:include name=’nextprev’/>
Troubleshooting problems with blog post navigation script
Few might have noticed that the Blog post navigation links will be misaligned sometimes. Newer post , Older post and Home page links will get together. So it means that the CSS codes are missing for the file. To overcome this problem , just copy and paste the corresponding CSS code you need above ]]></b:skin> .
Blog post navigation missing
Sometimes the blog post navigation may be missing in your blog. It’s because the blog post navigation code may be missing in your template. To overcome this problem , search this tag in your template with ” expand widget templates” option enabled.
<b:include name=’nextprev’/>
if the tag is missing , then add the above tag in your template below <b:includable id=’main’ var=’top’> as shown in the image.
Hope this post will be helpful for all blogger newbies. If you need any other customization then feel free to ask in comment form below.
Popularity: 7%
Wednesday, June 3, 2009
Auto hide or Remove the Navigation Bar
រៀបធ្វើឱ្យ Navbar
លោកអ្នកអាចធ្វើតាមរបៀបខាងក្រោមនេះតាមលំដាប់
ប្រសិនជាអ្នកមិនដឹងអំពីរៀបមិទវាចោល, សូមធ្វើតាមវិធីខាងក្រោមៈ
If you wonder how to remove the blogger beta navbar, this is the way to do it:
1-ចូរអ្នកចូលក្នុងបញ្ជីរបស់អ្នកសិន
1. Login to your blogger beta account.
2. Open the “Layout” for your blog.
-រួចចូល Layout
3. Click the “Edit HTML” link.
-ចុចលើ Edit HTML
4. Copy this code:
-សូមចម្លងកូដនេះ
5-សូមបន្លែមកូដនេះ ទៅក្នុងកូដប្លុករបស់អ្នក
Add this code into your blog (in THML)
Remember : This hack is for Blogger Beta, for the old blogger use this
Thursday, May 28, 2009
Google translation Widget for Blogger - Translate any website in English to 25 other languages
You can add this widget either in sidebars or below each post.
Code for Google Translation Widget :
The widget will be like the illustration below, please point your mouse over the flag-images so that you will find the blur effect as an attracted result:
If you are interested in installing the widget, then you should do the steps as follow:
- Login to blogger with your ID
- Click Layout
- Click Page Element tab
- Click Add A Gadget
- Click the sign plus (+) for HTML/JavaScript
Copy this this code
<p≶<style≶ .google_translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; border:0; } .google_translate:hover img { filter:alpha(opacity=30); -moz-opacity: 0.30; opacity: 0.30; border:0; } .google_translatextra:hover img { filter:alpha(opacity=0.30); -moz-opacity: 0.30; opacity: 0.30; border:0; }</style≶</p≶
<div style="padding:10px 10px 10px 10px;text-align:center;">
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Car&hl=en&ie=UTF8'); return false;" title="Translate English to Arabic"><img border="0" style="cursor:pointer; cursor:hand;" alt="Translate English to Arabic" width="24" src="http://i263.photobucket.com/albums/ii150/mohamedrias/Arabic_Flag.png" height="18" title="Translate English to Arabic"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cbg&hl=en&ie=UTF8'); return false;" title="Translate English to Bulgarian"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Arabic" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Bulgarian_Flag.png" height="18" title="Translate to Bulgarian"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Czh-CN&hl=en&ie=UTF8'); return false;" title="Translate to Chinese (Simplified) BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-Chinese (Simplified) BETA" src="http://i263.photobucket.com/albums/ii150/mohamedrias/_chinese_s.png" height="18" title="Translate to Chinese (Simplified) BETA"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Czh-TW&hl=en&ie=UTF8'); return false;" title="Translate English to Traditional Chinese"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Arabic" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Mandarin_Flag.png" height="18" title="Translate to traditional Chinese"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Chr&hl=en&ie=UTF8'); return false;" title="Translate English to Croatian"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Croatian" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Croatian_Flag.png" height="18" title="Translate to Croatian"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Ccs&hl=en&ie=UTF8'); return false;" title="Translate English to Czech"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Czech" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Czech_Flag.png" height="18" title="Translate to Czech"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cda&hl=en&ie=UTF8'); return false;" title="Translate English to Danish"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to danish" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Danish_Flag.png" height="18" title="Translate to Danish"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cnl&hl=en&ie=UTF8'); return false;" title="Translate English to Dutch"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Dutch" src="http://i40.photobucket.com/albums/e208/winglord01/nederlands.gif" height="18" title="Translate to Dutch"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cfi&hl=en&ie=UTF8'); return false;" title="Translate English to Finnish"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Finnish" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Finnish_Flag.png" height="18" title="Translate to Finnish"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cfr&hl=en&ie=UTF8'); return false;" title="Translate English to French"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to French" src="http://i18.photobucket.com/albums/b120/pdhinderlie/Web%20Stuff/Flags/flag_fr.gif" height="18" title="Translate to French"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cde&hl=en&ie=UTF8'); return false;" title="Translate English to German"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to German" src="http://i263.photobucket.com/albums/ii150/mohamedrias/_german_s.png" height="18" title="Translate English to German"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cel&hl=en&ie=UTF8'); return false;" title="Translate English to Greek"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Greek" src="http://i18.photobucket.com/albums/b120/pdhinderlie/Web%20Stuff/Flags/flag_gr.gif" height="18" title="Translate to Greek"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Chi&hl=en&ie=UTF8'); return false;" title="Translate English to Hindi"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Hindi" src="http://i323.photobucket.com/albums/nn467/techbookmark/hindi.png" height="18" title="Translate to Hindi"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cit&hl=en&ie=UTF8'); return false;" title="Google-Translate-English to Italian"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt=" Translate English to Italian" src="http://i263.photobucket.com/albums/ii150/mohamedrias/_italian_s.png" height="18" title=" Translate English to Italian"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cja&hl=en&ie=UTF8'); return false;" title="Google-Translate-English to Japanese BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Japanese BETA" src="http://i187.photobucket.com/albums/x307/Mafishioso/_japanese_s.png" height="18" title="Translate English to Japanese BETA"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cko&hl=en&ie=UTF8'); return false;" title=" Translate English to Korean BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Korean BETA" src="http://i263.photobucket.com/albums/ii150/mohamedrias/_korean_s.png" height="18" title="Translate English to Korean BETA"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cno&hl=en&ie=UTF8'); return false;" title="Translate English to Norwegian"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Norwegian" src="http://i536.photobucket.com/albums/ff328/pmhrid/norway_flag.png" height="18" title="Translate to Norwegian"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cpl&hl=en&ie=UTF8'); return false;" title="Translate English to Polish"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Polish" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Polish_Flag.png" height="18" title="Translate to Polish"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cpt&hl=en&ie=UTF8'); return false;" title="Translate English to Portuguese"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Portuguese" src="http://i18.photobucket.com/albums/b120/pdhinderlie/Web%20Stuff/Flags/flag_pt.gif" height="18" title="Translate to Portuguese"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cro&hl=en&ie=UTF8'); return false;" title="Translate English to Romanian"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Romanian" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Romansh_Flag.png" height="18" title="Translate to Romanian"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cru&hl=en&ie=UTF8'); return false;" title="Translate English to Russian"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Russian" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Russian_Flag.png" height="18" title="Translate to Russian"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Cru&hl=en&ie=UTF8'); return false;" title=" Translate English to Russian BETA "><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Russian BETA " src="http://i263.photobucket.com/albums/ii150/mohamedrias/_russian_s.png" height="18" title=" Translate English to Russian BETA "/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Ces&hl=en&ie=UTF8'); return false;" title="Translate English to Spanish"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Spanish" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Spanish_Flag.png" height="18" title="Translate English to Spanish"/></a>
<a class="google_translate" target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=en%7Csv&hl=en&ie=UTF8'); return false;" title="Translate English to Swedish"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Translate English to Swedish" src="http://i166.photobucket.com/albums/u106/language_forum/Languages/Swedish_Flag.png" height="18" title="Translate to Swedish"/></a>
<div style="display:none;">
<small><a href="http://www.yuljet.blogspot.com" target="_blank">Grab this widget</a></small></div>
</div>
Thursday, May 21, 2009
Adsense integration now easier than ever with Blogger's Monetize tab
Have you noticed the new "Monetize" tab at the top of your Blogger dashboard?
Google's Adsense program is a simple solution which many Bloggers use to monetize their sites. For some time now, Blogger have made it easy for us to include Adsense ads in the sidebar (as a page element) and around blog posts (as an option in the Layout>Page Elements section, when you click the "Edit" link for your blog posts).
If you have already configured Adsense in your blog by adding an Adsense page element to the layout, or enabling ads between posts, by clicking on the Monetize tab you will be able to see statistics for your earnings, like this:
On this page, there are also links to view your Adsense Payment History, earnings reports and to switch the account associated with this particular blog. You can also choose to "remove ads" from all aspects of your Blogger layout at the click of a button.
For those who have not yet chosen to monetize their sites with Adsense, or who have configured Adsense manually in their templates, you will see a page like this instead:
This means that your Adsense account has not been associated with this blog. No earnings reports will be displayed, even if - like me - you have manually configured Adsense by adding the required JavaScript to your Blogger template code.
For those of you yet to add Adsense to your layout, simply choose one of the ad-layout options most suitable for your needs anc click the "Next" button. You may be required to set up an Adsense account (or associate an existing account with your Blogger profile), after which your ads will be immediately placed in your layout. Then when you visit the Monetize tab, you will be able to see details of your Adsense earnings for the ads you have placed in your layout.
What you need to know about Adsense monetization and the new Monetize tab
Although Blogger have made it very easy for members to add Adsense to their blogs, not every applicant will be successful in getting their own Adsense account.Adsense reviews all applicants to the program before agreeing to (or denying) a new account. In order to apply for an Adsense account, you must be over 18 years old and have a website which complies with Adsense policies. If you post any questionable content on your site, you really should check these policies to ensure your site complies before submitting your application.
Also, the reports displayed on the Monetize tab will only show page views and earnings from the time that you connected your Adsense account with this blog. If you have previously linked your Adsense account with your Blogger profile, it seems the "All Time" earnings will display earnings from today onwards (one of my blogs uses an Adsense Page Element, but is only displaying earnings from today).
A new channel in your Adsense account for each Blogger blog you monetize
If you log into your Adsense account, you will notice a new channel has been set up for each of your blogs, which contains the URL of your blog in the title.The information from this channel is what's used to present the earnings data for the Monetize section of each blog you write.
Not yet an ideal solution for everyone...
I am very happy to see that the Blogger team have put such effort towards integrating all of the Google services we Bloggers currently use. However, I am a little disappointed at some aspects of this new feature.For my own blogs, I have added Adsense manually, by editing the Blogger template and inserting ad codes where I would like them to be displayed. For this reason, I am unable to see any reports on the Monetize tab. In fact, it appears as though I have not set Adsense up at all.
Also, the earnings displayed on the Monetize page will only include the earnings for this particular blog, not your total earnings from any different sites operated.
However, these are small issues, and perhaps these issues will not affect most other Blogger users.
What do you think?
Will this new "Monetize" dashboard feature make it easier for you to connect your Adsense account with your blogs? How well do you think this feature performs so far?Please feel free to leave your comments and suggestions below.
Thursday, April 23, 2009
How to resize image in Home Page at Magazine Template R.1.2
How can we resize the image in home page of magazine Template magazine R.1.2 ?
If you feel uncomfortable with the image size in home page at magazine Template R.1.2, you can resize it as follow:
Login to blogger with your ID
Click Layout
Click Edit HTML
Find this code :
.post-body img{
max-width:70px;
padding:1px;
float:left;
margin:0 5px 1px 0;
border: 1px solid #cadaef;
}
Focus to the code:
max-width:70px;
Change the pixel with the higher one, suggested to change not more than 300px, e.g.:
max-width:300px;
The code will be as below:
.post-body img{
max-width:300px;
padding:1px;
float:left;
margin:0 5px 1px 0;
border: 1px solid #cadaef;
}
Click Save template
Done
Additional Note:
Max-width means the width of image displayed. It is easy, right?
Happy trying!
Tuesday, March 24, 2009
Audio Player Blogspot & Wordpress
For Wordpress:
Once installed, this plugin allows you to insert mp3 audio files into your posts and pages. Use the following syntax:
[audio:name_of_mp3_file.mp3]
This code will insert a flash player and will load the file named name_of_mp3_file.mp3 located in your audio files folder. You can store your audio files anywhere in the web root as long as you update the path in the plugin’s options panel. The default is /audio
.
You can also use absolute paths to link to files on other servers:
[audio:http://www.somedomain.com/path/to/name_of_mp3_file.mp3]
Audio Player can also play a sequence of audio clips. Use commas to separate the files:
[audio:name_of_mp3_file1.mp3,name_of_mp3_file2.mp3,name_of_mp3_file3.mp3]
Examples
Default colour scheme
Custom colour scheme
if not support Click here to Download Flash player
Colour scheme
The entire player colour scheme is customisable. Use the Audio Player options panel in your WP admin to set the colour scheme of your player. You can also change the colours per player instance by using runtime options. Here are the colours that you can set:
Runtime options
Use these if you want to use a different colour scheme for a particular player instance. You can also make the player open automatically or loop the loaded clip. You can pass a number of options to a player instance. To do this use the following syntax:
[audio:name_of_mp3_file.mp3|option1=value|option2=value]
Option | Effect |
---|---|
autostart=yes | The player will automatically open and start to play the track (default value is no) |
loop=yes | The track will be looped indefinitely (default value is no) |
bg=0xHHHHHH | Background colour option (where HHHHHH is a valid hexadecimal colour value such as FFFFFF or 009933) |
leftbg=0xHHHHHH | Left background colour |
rightbg=0xHHHHHH | Right background colour |
rightbghover=0xHHHHHH | Right background colour (hover) |
lefticon=0xHHHHHH | Left icon colour |
righticon=0xHHHHHH | Right icon colour |
righticonhover=0xHHHHHH | Right icon colour (hover) |
text=0xHHHHHH | Text colour |
slider=0xHHHHHH | Slider colour |
loader=0xHHHHHH | Loader bar colour |
track=0xHHHHHH | Progress track colour |
border=0xHHHHHH | Progress track border colour |
This will set the main background colour of the player to black and automatically start the player when the page loads.
For Blogspot:
Copy this code:
Audio Player 2.0 beta
Custom colour scheme
Examples
if not support Click here to Download Flash player
Default colour scheme
Other Style with



Saturday, March 21, 2009
How do I put a picture into the caption of a picture on Website

នៅ ក្រោម លំនៅ ឋាន មាន កី តម្បាញ សំរាប់ ត្បាញ ហូល (រូបថត ៖ ធា)

A caption to an image on Post is a short text message that appears below the image and clarifies its import. Most captions draw attention to something in the image that is not obvious, such as its relevance to the text. For complex images or images whose relationship to the text is unclear, the caption can be one or two short sentences, rarely three. Writing good captions is difficult, and the examples below may be helpful. Along with the title, the lead, and section headings, captions are the most commonly read words in an article, so they should be succinct and informative.
: search this line ]]></b:skin> and add this CSS code above that line.
border: 1px solid #DDDDDD;
text-align: center;
background-color: #EEEEEE;
padding: 4px 0px 5px 0px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.wp-caption img {
margin: 0px 0px 5px 0px;
padding: 0px;
border: 0px;
}
.wp-caption p.wp-caption-text {
margin: 0px;
padding: 0px 0px 0px 0px;
font-size: 11px;
font-weight: normal;
line-height: 12px;
}
When you want to put Photo with Caption you should write like this:
<p class="wp-caption-text">Khmer Dress(Photo by:sss)</p>
</div>
Tuesday, March 17, 2009
how to Add "Read More" in blogger!
Read this first
put READ MORE... in you blog. it can make your blog faster than before and now I have some Style to share you.
How to do:
1
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
.readmore a { width:69px; height:24px; text-indent:-9009px; background:transparent url(http://farm4.static.flickr.com/3556/3363478306_c76cd05a4f_o.gif) top no-repeat; float: right; margin-top: -19px; margin-right: 3px; }
.readmore a:hover { background: url(http://farm4.static.flickr.com/3556/3363478306_c76cd05a4f_o.gif) bottom no-repeat; }
</style>
2
Add this code below <data:post.body/> like this:
<span class='readmore'><a expr:href='data:post.url'>Read more!</a></span>
Or you can change picture:
Green:
Blue:
Sunday, October 12, 2008
Related Posts Widget For Blogger with CSS
Thats it , now look at the page , it will look like this

: search this line <p><data:post.body/></p> . (<p><data:post.body/></p> Then_the_related_posts_script_here) and paste the following script the code just below:
<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<!-- *****************http://hoctro.blogspot.com*****Jan,2007****************** -->
<!-- *****************Related Articles by Labels - Take Two****************** -->
<!--
Modified by JackBook.Com to make it easier to use.
1. Now, users don't need to change anything to use this widget. just copy and paste, and done!
2. The current article will also be listed, now it's no more.
-->
<div class='widget-content'>
<h3>Related Posts by Categories</h3>
<div id='data2007'/><br/><br/>
<div id='hoctro'>
You want it? <u><a href='http://yuljet.blogspot.com/2008/10/related-posts-widget-for-blogger-with.html'>Click here</a></u> | <u><a href='http://www.yuljet.blogspot.com/' title='Related Posts on Blogger. Read More?'>Yul Jet</a></u>
</div>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>
Save your template. refresh your blog, and Done.
That’s all. Enjoy!
Note; Related Posts is a list of all posts related to some article based on the labels. And because this uses Javascript, if you want to create a list of posts related by content, it might be pretty hard to do currently.
Wednesday, October 8, 2008
Error code bX-jdokxi - i can't change my template!
Have you ever got the error code bX-jdokxi when you try to change template?
Any of you who have tried to change Blogger templates or moved around your blog’s page elements have probably seen the dreaded Blogger “bX-xxxxxx” cryptic error message.
It’s frustrating enough to see an error message after trying to make what seems like a trivial change to your blog and how can you fix the problem if you’re given an error code instead of a actionable error message like “template is incorrect on line xx”? Blogger’s support area doesn’t even give you information on what each error means and how to resolve it so if you want their help you need to post a message and wait 12+ hours for someone at Google support to respond. You would think Google would spend some more time and resources to improve their error messages and Blogger support.
So the main question is what does the error message actually mean and how can you fix it now?
For me, I was able to fix it by making a few changes but there was no exact science as to how I did it.
Use Fire Fox rather than Internet Explorer when you're having
trouble with a template.Make a backup of the code in each of your gadgets or widgets, so
you can put them back later, then remove all of them.Before attempting to upload a template, make sure the "Expand
Widget Template" box is UNchecked.There are far less problems if you can get the template as a txt
file rather than xml. With a txt file you can just paste it in,
rather
than having to upload it.Install one of Blogger's templates. Then try again.If you're using an xml file, don't paste it. Save it on your harddrive, and then on the template page, use "Browse" to find it on your computer. Then click "Upload."
For the Last ways and the Best way to Fix this error you should Revert to Classic Template:
Layout => Edit HTML => Revert to Classic Template
Customize Design => UPGRADE YOUR TEMPLATE => SAVE TEMPLATE
Layout => Edit HTML (Install with a new template).
Now I think you can change with a new template you like, without any error code.
Saturday, October 4, 2008
Unicode Khmer can use even without font?
"Khmer Unicode" by KhmerOS
Khmer Software Initiative (KhmerOS), National Information Communications Technology Development Authority (NIDA), and Open Institute joined to create a project for developing OpenSource software that can accommodate Khmer Unicode-based fonts. Khmer Unicode is a part of their project, but it has not yet widely utilized or built-in as part internet browsers or software applications. It is, however, gradually becoming popular among users/developers in Cambodia. Khmer Unicode has been developed to use in platforms such as:
- OpenOffice (Word Processing),
- OpenSUSE (Linux based Operation System),
- Khmer Email Application (Thunderbird-based email application),
- Mekhala (FireFox-based Internet Browser)
But now Khmer Unicode Font have been widely utilized with Microsoft Internet Explorer 7 but it has not yet widely utilized or built-in as part Internet Explorer 6 Service Pack 1 and Mozilla | Firefox web browser .
If your MS Window XP has Service Pack 2 installed, you can view this Blog, Khmermp3.stie90.com, All Colde for site, RFA and Khmer3G, in Khmer via Internet Exploer 6.0 or higher. In this case, My Blog and these sites utilizes WEFT to have the pages viewed in Khmer even without Khmer Unicode installed.
ឥឡូវនេះសម្រេចហើយសូមជួយទះដៃឲ្យខ្ញុំម្ដងទៀតមក!
-ថ្ងៃនេះថ្ងៃជាវេលាល្អ | ថ្ងៃដែលសាទរត្រេកអរក្រៃ |
ថ្ងៃនេះខ្ញុំបានសម្រេចក្ដី | ប្រាថ្នាច្រើនថ្ងៃនោះបានហើយ។ |
-ជាមោទភាពដ៏ក្រៃលែង | ព្រោះអីក្នុងទ្រូងបានធូរស្បើយ |
សេចក្ដីប្រាថ្នាសម្រេចហើយ | ឱមិត្រយើងអើយ ជួយទះដៃ។ |
-កុំសើចកុំយំនិងខ្ញុំណា! | សុំសើចមួយគ្រាកុំថាអី |
ព្រោះខ្ញុំអរពេកណាមិត្រថ្លៃ | ទើបបានកើតក្ដីរំជួលធំ។ |
-ព្រះពុទ្ធត្រាស់ថាការតស៊ូ | មិនឆាប់មិនយូរឲ្យតែខំ |
ពិតជាសម្រេចបំណងធំ | ពិតដូចជាខ្ញុំបានថ្ងៃនេះ។ |
ឥឡូនេះ យើងអាចដាក់អក្សរខ្មែរយូនីកូដ បានហើយជាមួយ MS Window XP has Service Pack 2 តែមិនអាចប្រើជាមួយ MS Window XP has Service Pack 1, Internet Explorer 6 Service Pack 1 ឬក៏ Mozilla | Firefox web browser បានទេ។
ខ្ញុំបានស្រាវជ្រាវ ហើយបានដើរសួរគេឯង ដើម្បីធ្វើឲ្យអក្សរយូនីកូដខ្មែរ ប្រើបានជាមួយអ៊ិនធើនែត ដោយមិនចាំបាច់ប្រើ Font នៅក្នងគ្រឿង។ ទើបថ្ងៃនេះ ខ្ញុំបានសម្រេចហើយ ដាក់បានដោយមិនចាំបាច់មានអក្សរក្នុងគ្រឿងទេ។ ដោយបានបង អានីន (Khmer3G) គាត់បានឲ្យ មកខ្ញុំៗ ក៏ធ្វើសាកមើលក៏ចេញដូចសេចក្ដីប្រាថ្នាមែន។
សង្ឃឹមថា នៅថ្ងៃណាមួយ អក្សរខ្មែរ ពិតជាអាចប្រើបានជាមួយ Mozilla | Firefox web browser ហើយជាពិសេស google.com/adsense នឹងទទួលស្គាល់ពុម្ពអក្សរយូនីកូដនេះ ជាមិនខានឡើយ។
ប្រសិនជាអ្នកចង់ធ្វើប្លុករបស់អ្នកអាចដាក់អក្សរយូនីកូដដោយមិនចាំបាច់ប្រើ អក្សរនោះគឺ
វិធីធ្វើ គឺយើងធ្វើដូចជា ការធ្វើអក្សរលីមូនដែរ គ្រាន់តែលោកអ្នកត្រូវទាញយកម៉ូត អក្សរនេះ សិន
1- Download this Kh System font first.
ហើយបន្ទាប់មកធ្វើដូចជា របៀបធ្វើអក្សរអញ្ចឹងដែរ