Pages

Wednesday 29 February 2012

Reducing Error in validator XHTML template


To reduce the error in your template you can change your template from the Strict DOCTYPE to Transitional

Why do I suggest using Transitional? Because of Strict Doctype have tighter validation than using Transitional.

Some codes are considered valid if using Strict DOCTYPE, among others:
  1. <ul> and </ ul>.
    The use of the underscore declared invalid, and therefore in the form blogspot and wordpress not provided a button to make the bottom line / underline.


  2. target = "_blank"
    Open the link which when clicked is not declared invalid, therefore it is advisable to add the attribute target = "_blank" if you make a link if there is use Strict DOCTYPE.


  3. Border in the picture is not valid.

For that you change the template of the Strict DOCTYPE to Transitional

Ways to replace it are as follows:
1. First look for strict doctype the code below:


2. Replace with the code below:


That is all.. Enjoy!!

Wednesday 15 February 2012

Use the Advantages of SITEMAPS


The benefits blog Sitemap in fact is very much. Goal of putting the sitemap on every blog, whether wordpress or blogger will be seen below:

Creating a Reader Becoming Comfortable
Why say comfortable? Of course, since all three are in our blog visitors they will feel what we serve there. Another benefit of allowing users to any existing category on the blog, with one click they can see and find what they need. Another aim of the content or the blog site map would be helpful in selecting the title of the blog post. It's up to you just put a category or label is where aja, point readers to easily and clearly see the titles of posts so that visitors are not hard to find anymore. They will feel more comfortable instead.

Visitors will last a long time
To create a Visitor for a long time perched on the blog, it is necessary that his name alias blog content sitemap. We hope the visitors do not just read an article or post and then went away. But they also read the other. Hence the blog content is needed as a professional blogger who has many interesting articles that we present to visitors.

Your blog look more professional
YES!! This is a professional blog. Not every blog has a list of contents/sitemap. If you want to try, please browse in Google. Rarely they put the sitemap on the blog. Therefore, I recommend you to put up a list of contents/sitemap blog. The purpose is to make your blog look professional. Your attention now is on the convenience of visitors, so they feel their needs are met. Keep in mind! Purpose of writing articles is for visitors, not yourself. Thus, they would be more comfortable because you have given what they are looking for.

Increase the Adsense Income
If you do business adsense, it's up to both local and international, then you are very maximum target, visitors will click on Adsense that you put on your blog, so your income will increase. We talk to the ratio, when visitors are long on our blog adsense then you will be seen in a longer time. Adsense ads are usually fit with the existing article on the post. Opportunities in clicking on ads is a great opportunity. The more visitors that come across our blog, then chances will increase adsense click. So the dollar will always flow into your account.

That is little bit of benefits sitemap in Blog. This is all that I know so far.. Ordinary people also write Blog Content. If something is missing please share in comments field.

Creating a Google Gadget Translate Flag (Flag Icon)

As per published from the previous post, about How to customise your recent post (for Blogger), today, I'm going to show on how to add-on a google gadget. 

As we know, nowadays, people keep on blogwalking and this is an advantage for them (If they suddenly jump or get into my humble blog). Ahakkk!! Hurm.. Okay. This google gadget is about traslating the language in the webpage.

As usual, I will give the codes and just simply copy and paste the code given.


 Only 5 steps required:
  1. Login to Blogger.com
  2. Open the Dashboard Design Page Elements > Add a Gadgets
  3. Select HTML/Javascript
  4. Paste code into the box all the HTML/Javascript
  5. Save
Coding:

<style> .translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; border:0; padding-left:0px; } .translate:hover img { filter:alpha(opacity=50); -moz-opacity: 0.50; opacity: 0.50; border:0; } </style> <div style="text-align:center"> <a class="translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV2LfHKM16U6nW8Y6HWxGvLWzp4oHvSAAdrd_V5StfrGNICFg3sntb41nJZnCfJTY1QCoJ-MSi92QTn-brwMiUHJlTICH1VciLUOzKztFxRVm7JMbfjk1pcd9JEgux4wet1kcXj7qlEiYr/s144/uk-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <a class="translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizoYJwuk2oAd7K8Hb4AmBuoWd8qK0Re4xz8RRym9Ziohrp3ogu1Om70JobvLb8BP08TpD_X5t65D16PHX3L8cQOLeviUq2oLNoVWvmV2YJ3J6G7nBsqJnpRSDQLTYDEFRxvObS8eGIkQI_/s144/france-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <a class="translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOmJX8JrlrGnsoEN5Lx3Y8lq4i_Emxn6XYhvW1DNHkycZO2H2afZJaC0zL6IKZygYduKw8DJuw9Yk3Pajg-a_oIQ4BzuiGbnmOJaL8AJ_S8NywXirJXXnXHKggh8fzbOXENrp6nuB_0let/s144/german-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <a class="translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqOqo-Qu0KS67LavI1QQrol73CCyNj9BkXb08rUiEpIA_u_MbgCegfbXRT5HITJplS07E-hK7ivkQFccbZ22yqPsR3xgxenu8XzKt7uhEgG2HYiYzjXXfilCLl5txLlKqmSXq_iHP-xFTz/s144/spain-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <a class="translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmTmB0v7bVY4pMfi3JRUAsUfupI_gsJE6BgziBxQiKV1iGh5mtel3DiY9tANDmOarJ4jXwYEDz1X20kLHQIUvcyq99LQEPLzFLCDAMf_1T6byeZcLkr_LUUwfhh0uO-yHiKpcQa_iFMd2A/s144/italy-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <a class="translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh04QMFWwZnQmQGJS5eMsf3Bm1s0tJRSz_2GYXOr615AZy8xepkG1A7GzW_2kB0VRSsjZ0PzhccsMG8_m2c2GcIL6ougNkUvMGnnN837IURpZOODnEzZ3_ego7lpIruy6SYOwztVEHQBv3i/s144/dutch-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <br/><br/> <a class="translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM4i-X6LvN7-lsFJe6osaqzSEvNezq0_d7wYrnIS3y_WUySKk8kVLpI_N9sietw3KXQCJh4yDD4zRNW8TKqoPcsNwRsvj0i-hVca5Kdk3Hul4YO6Em1tzzG-fd8dQ3nrcMfYvYJiX_eLhr/s144/russian-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <a class="translate" href="#" target="_blank" rel="nofollow" title="Brazil" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Brazil" border="0" align="absbottom" title="Brazilian" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU2tBAHq1mhb6rh-LKsQut5EDYon0QfIHZPtZv9qviqS0fqAHt7HuYQiJVP1CMjxvnAZ6GWmxphAqSMgfNBcQngYfci8dqQLL2eH54_1xGBAQl-3zJ4sC8Hqm6cXmMg-KefyxkxfsYYBQM/s144/brazil-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <a class="translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMEtqIL8jeKzLrYnTl102SI4ipUfmSttgPxGlyG0PSSEs7iXHUAMrjczbgEUAjVVGb7UPXZz7IAipXnp_lmzKfIr-ZLo-pEAYUpZZ4ghdLGIE2xmL0EnAdsXKbejzbKRFRpogN06Fvy7J/s144/japan-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <a class="translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6OQfJIBjKnBJr2nqkzntstwHn1UDtv-NP9LQhM-uy1y4sbfk_7Roy_N-JvoVIS0QUATpNASEAHb2BfBzgfpQv3Xc2vlCMS7mZKU1LHBjq3wScUU6VdZzcpVwk59lZJ0MTR8kCLBw2mAJ1/s144/korean-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <a class="translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPo0sbIvRp_GzIXDtMC4a0QWnpLFp0BlPPQxMhv_DVvgQtKrX3KDPX6yCEnJhanCnad0zu_z27tkzgDko8zd2pwu2F4m189k6dId5TPAg96OiEpo9-lJGQHAYWgXmTWD8XMTjB3EtQX6lt/s144/arab-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <a class="translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6n0KkKh3JWx3J99k2SeiSAEMCuVmIWb0PU7oY926pE5iTNteobvRcH7gJoQ3zJ5ify9894n1Jgtg4oRzqm1h0Fvf8FMnIgdIzZan6JFwwA6mEXeRzDYAKl6soAOoE0LipiLhADyARAqTt/s144/china-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a> <div style="font-size:9px; padding:8px 0px 0px 0px"> <a href="http://ofthink.blogspot.com" title="translate widget"/>Translate Widget</a> by Google </div></div> 

Customs Recent Posts for Blogger

Recent Posts widget or Recent posts widget is important because it serves as a support blog navigation. Given a list of recent posts, visitors who come not from the main page (homepage) can immediately find out some recent posts from a blog. In addition, recent posts widget can be an offer to visitors blog to know the content of other postings from these blogs.

Recent post widget that I share this time and features a display which is quite interesting. Combination of script recent posts, auto scroll / spy list generate Blogger recent posts widget which has a great effect and may invite interested visitors. As a result, the look / design blog can also be increased in value by ditambahnya these recent posts widget. I've been using this widget and its role in increasing the number of pageviews blog is not in doubt.

Follow these steps and make sure no part missed:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:355px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:335px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

    <script language='javascript'> 
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 300;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 60;
thumbheight = 60;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "Reply(s)";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://ofthink.blogspot.com/";
limitspy=5
intervalspy=6000
</script>

<div id="spylist">
    <script type='text/javascript'>
//<![CDATA[
jQuery(function(){jQuery("ul.spy").simpleSpy(limitspy,intervalspy).bind("mouseenter",function(){jQuery(this).trigger("stop")}).bind("mouseleave",function(){jQuery(this).trigger("start")})});(function(e){e.fn.simpleSpy=function(f,g){f=f||4;g=g||5000;return this.each(function(){var l=e(this),k=true,i=[],m=f,o=0,h=l.find("> li:first").height();l.find("> li").each(function(){i.push("<li>"+e(this).html()+"</li>")});o=i.length;l.wrap('<div class="spyWrapper" />').parent().css({height:h*f});l.find("> li").filter(":gt("+(f-1)+")").remove();l.bind("stop",function(){k=false}).bind("start",function(){k=true});function n(){if(k){var p=e(i[m]).css({height:0,opacity:0,display:"none"}).prependTo(l);l.find("> li:last").animate({opacity:0},1000,function(){p.animate({height:h},1000).animate({opacity:1},1000);e(this).remove()});m++;if(m>=o){m=0}}setTimeout(n,g)}n()})}})(jQuery);function showrecentposts(z){document.write('<ul class="spy">');j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var o=0;o<numposts;o++){var w=z.feed.entry[o];var g=w.title.$t;var f;var p;if(o==z.feed.entry.length){break}for(var l=0;l<w.link.length;l++){if(w.link[l].rel=="alternate"){p=w.link[l].href;break}}for(var l=0;l<w.link.length;l++){if(w.link[l].rel=="replies"&&w.link[l].type=="text/html"){f=w.link[l].title.split(" ")[0];break}}if("content" in w){var r=w.content.$t}else{if("summary" in w){var r=w.summary.$t}else{var r=""}}postdate=w.published.$t;if(j>imgr.length-1){j=0}img[o]=imgr[j];s=r;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){img[o]=d}cmtext=(text!="no")?'<i><font color="'+acolor+'">('+f+" "+text+")</font></i>":"";var q=[1,2,3,4,5,6,7,8,9,10,11,12];var x=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var u=postdate.split("-")[2].substring(0,2);var h=postdate.split("-")[1];var t=postdate.split("-")[0];for(var e=0;e<q.length;e++){if(parseInt(h)==q[e]){h=x[e];break}}var n=(showPostDate)?'<i><font color="'+acolor+'"> ('+u+" "+h+" "+t+")</font></i>":"";g=(aBold)?"<b>"+g+"</b>":g;var v='<li><a href="'+p+'"><img src="'+img[o]+'" width="'+thumbwidth+'" height="'+thumbheight+'" class="recent-thumb"/></a><a href="'+p+'" class="recent-link">'+g+'</a><div class="spydate">'+n+'</div><div class="spycomment">'+cmtext+"</div>";document.write(v);j++}document.write("</ul>")}document.write('<script src="'+home_page+"feeds/posts/default?max-results="+numposts+'&orderby=published&alt=json-in-script&callback=showrecentposts"><\/script>'); 
//]]>
</script>
</div>

Important Notes:
  1. Host your own image and replace it. http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg
  2. Change http://ofthink.blogspot.com/ to your url. Make sure there is a slash mark (/) on the back of blog url.
  3. Open the Dashboard > Design > Page Elements > Add a Gadgets.
  4. Select HTML/Javascript.
  5. Paste code into the box all the HTML / Javascript.
  6. Save.
Customise your "Recent Post Widget"

To adjust the appearance of recent blog post with the template, note and substitute the following few basic points before putting the script:

boxwidth = 300 is the width of the widget in pixels (px), change the value according to the width of the sidebar.

text = "Reply (s)" is a text on the back of the number of comments, parts Reply (s) you want, for example: comments, comment (s), etc..

numposts = 10 is the number of recent posts I will be crawling, replace its value as desired.

limitspy = 5 is the number of new posts in one view, change its value as desired.

intervalspy = 6000 is the scroll speed / spy in milisecond (ms), change its value to regulate how fast.



You are DONE!