tag:blogger.com,1999:blog-36572006940838444892024-03-13T21:56:13.642+07:00Blogger TutorialJaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.comBlogger274125tag:blogger.com,1999:blog-3657200694083844489.post-88254444443321995672013-03-08T17:29:00.001+07:002013-03-08T17:29:37.192+07:00Responsive Templates<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiL4rzf3_VgwZO0pc6s2jaYlcUctVuwup6XQLhTuJ8-nYB1r8ehBw2I7BvkUP9-ay1TjVMkW188F1mdlslMk5U_yK6Ay0viiHPONvvpnxunzc8Mdhe0aFSusHqR8kZhgcrQANWqPGU0DI/s1600/Responsive+Templates.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiL4rzf3_VgwZO0pc6s2jaYlcUctVuwup6XQLhTuJ8-nYB1r8ehBw2I7BvkUP9-ay1TjVMkW188F1mdlslMk5U_yK6Ay0viiHPONvvpnxunzc8Mdhe0aFSusHqR8kZhgcrQANWqPGU0DI/s1600/Responsive+Templates.jpg" /></a></div>
Tahun 2013 ini sepertinya adalah tahun template dengan responsive design. Meskipun blog dengan platform wordpress dan joomla sudah beberapa lama mengenal desain responsive ini, namun blogger/blogspot tentu saja tidak kalah dalam urusan ini. Meskipun terbilang masih minim, namun yakin saja, tahun 2013 ini bakalan banyak publikasi template dengan responsive design.<br />
<br />
Template yang satu ini buatan Borneo Templates. Desainnya sederhana, namun memiliki tampilan yang elegant dan nampak professional. Berikut adalah link demo Responsive Template ini : <a href="http://responsive-templates.blogspot.com/" target="_blank"><b>DEMO</b></a>. Dan untuk mendownloadnya, silahkan langsung saja menuju ke TKP : <a href="http://www.borneotemplates.com/2013/03/responsive-templates.html"><b>DOWNLOAD</b></a>.<br />
<br />
Penulis : Herdiansyah Hamzah<br />
Blog : <b><a href="http://www.herdi.web.id/">www.herdi.web.id</a></b>Herdiansyahhttp://www.blogger.com/profile/06354055742027741845noreply@blogger.com70tag:blogger.com,1999:blog-3657200694083844489.post-4509315227890541902012-04-09T23:00:00.001+07:002012-04-09T23:07:44.941+07:00Bestores Template: Toko Online Blogspot Ala Boogle<div class="wlWriterHeaderFooter" style="float:none; margin:0px; padding:0px 0px 0px 0px;"><a title="Post on Google Buzz" class="google-buzz-button" href="http://www.google.com/buzz/post" data-button-style="normal-count" data-url="http://catalog-tutorial.blogspot.com/2012/04/bestores-template-toko-online-blogspot.html"></a><script type="text/javascript" src="http://www.google.com/buzz/api/button.js"></script></div><p>Template yang satu ini sudah lama tersimpan di dashboard blogger. Mungkin sekitar 2 tahun yang lalu saya buat template tersebut, namun sampai saat ini belum sempat rampung 100 persen juga. petama karena malas, kedua karena malas dan ketiga karena malas juga.</p> <p>Konsep templatenya lebih kepada toko online blogspot tapi ala boogle, tentu saja inspirasinya seperti biasa, yakni  hasil surfing dari beberapa web dan membandingkan beberapa layout kemudian mengambil salah satunya yang tentu menarik menurut kaca mata saya, terutama tertarik karena warna dasar dark (hitam) memjadikan layoutnya sangat eklusif untuk sebuah blog toko online, cocok untuk memajang beberapa produk sendiri, untuk produk reseller atau memajang produk-produk dari <strong>Amazon</strong> dan <strong>Clikbank</strong>.</p> <p>Antar muka atau layout templatenya di bagi ke dalam 3 halaman yang berbeda, dengan tekniknya masing-masing ( tidak ada kolom sidebar dan kotak komentar .ket):</p> <ol> <li>Home / Halaman Depan / Beranda. </li> <li>Halaman Jenis Produk </li> <li>Halaman Sub / bagian jenis Produk. </li> <li>Halaman Postingan / Artikel produk </li> </ol> <h3>Home / Halaman Depan / Beranda</h3> <p>Pada halaman ini saya menggunakan tehnik image map – dimana judul-judul tulisan dalam gambar seperti tulisan <strong>#Mens Leather Jaket, #T shirt Distro </strong>merupakan sebuah link/tautan untuk produk yang bersangkutan, dan di gabungkan dengan intro image ( tutorialnya pernah saya jelaskan).</p> <p>Preview :  <a href="http://bestores.blogspot.com/" target="_blank">Bestores Toko Online Blogspot</a></p> <p> </p> <p><a href="http://bestores.blogspot.com/"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="toko online" border="0" alt="toko online" src="http://lh6.ggpht.com/-oUYF8RWkGqU/T4MHZCUWJ3I/AAAAAAAAHAA/52P25FyuuVY/toko%252520online.png?imgmax=800" width="600" height="322" /></a> </p> <p> </p> <h3>Halaman Jenis Produk</h3> <p>Memangfaatkan tab menu yang di arahkan ke halaman search indek label ( tutorialnya pernah saya jelaskan ), juga pencarianya hanya menampilkan judul produk dan image only ( gambar doang ).</p> <p>Preview : <a href="http://goo.gl/gP5Xe" target="_blank">Halaman Produk</a></p> <p> </p> <p><a href="http://goo.gl/gP5Xe"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="blog toko online" border="0" alt="blog toko online" src="http://lh5.ggpht.com/-hT-gMVQONDQ/T4MHdk3n_YI/AAAAAAAAHAE/s9oOhIzQeVg/blog%252520toko%252520online.png?imgmax=800" width="600" height="335" /></a> </p> <p> </p> <h3>Halaman Sub / Bagian Jenis Produk</h3> <p>Halaman ini hampir sama dengan tehnik sebelumnya, namun pencariannya lebih ke pada label yang specifik. contoh saya membuat label <strong>Mens - Leather Jaket Gallery</strong>, <strong>T-Shirt Gallery</strong>, <strong>Women’s Leather Jaket Gallery</strong>.</p> <p>Preview Halaman Label : <a href="http://goo.gl/2Qnmf" target="_blank">Mans Leather Jaket Gallery</a></p> <p> </p> <p><a href="http://goo.gl/2Qnmf"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="blog-toko-online" border="0" alt="blog-toko-online" src="http://lh6.ggpht.com/-dCNBU32uiAY/T4MHnpR0IpI/AAAAAAAAHAI/c2ZoQmBbjQ8/blog-toko-online.jpg?imgmax=800" width="600" height="370" /></a> </p> <p> </p> <p>Preview Halaman Label : <a href="http://goo.gl/YCbJB" target="_blank">T-Shirt Gallery</a></p> <p> </p> <p><a href="http://goo.gl/YCbJB"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="blog-toko-online2" border="0" alt="blog-toko-online2" src="http://lh3.ggpht.com/-UM0dk6DDBCM/T4MHqB1Tw_I/AAAAAAAAHAM/CQmluBLyxM0/blog-toko-online2.jpg?imgmax=800" width="600" height="370" /></a> </p> <p> </p> <p> </p> <h3>Halaman Postingan / Artikel produk</h3> <p>Untuk halaman postingan saya bagi ke dalam 2 kolom ( tutorialnya pernah sy jelaskan ), kolom pertama bagian kanan merupakan gambar produknya, kolom kedua bagian kiri merupakan keterangan produk berikut harga dan tombol pemesanan.</p> <p>Preview : <a href="http://goo.gl/8YI8n" target="_blank">Boogle T-Shirt</a></p> <p> </p> <p><a href="http://goo.gl/8YI8n"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="blog-toko-online3" border="0" alt="blog-toko-online3" src="http://lh5.ggpht.com/-SZFauRc7yuA/T4MHsqt3E0I/AAAAAAAAHAQ/Zd0ny6G086s/blog-toko-online3.jpg?imgmax=800" width="600" height="471" /></a> </p> <p> </p> <h3>Akhirul Kalam</h3> <p>Seperti telah di sebutkan, karena malas template tersebut sampai sekarang belum rampung sepenuhnya masih ada beberapa yang perlu di tambahkan, terutama sekali karena rumitnya membuat postingan dan label gallery. </p> <p>Ani Lenok - sebenarnya template ini premium alias berbayar ( hehe ujung-ujung nya jualan ), dengan harga …  $$$</p> <p>Happy Blogging .. </p> <p>hauh sudah lama tidak nulis buat update post.. cape juga ternyata :)</p> <p>* sorix jika bhs lingginya jelek maklum terjemahan di c embahe</p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com163tag:blogger.com,1999:blog-3657200694083844489.post-85607785128908414052012-01-10T04:36:00.000+07:002012-01-10T04:36:09.075+07:00Borneo Press Premium Blogger TemplateSelesai juga satu template premium dengan platform blogspot. Template ini diberi nama "<b>Borneo Press</b>", mengingat template ini memang didesain dan dipublikasikan di <a href="http://www.borneotemplates.com/"><b>Borneo Templates</b></a>. Desain template ini sangat sederhana, namun kesannya tetap professional, karena dilengkapi dengan beberapa fasilitas yang terbilang baru. Yang paling menarik adalah fasilitas widget featured slideshow yang berjalan secara otomatis, tanpa perlu memasukkan kode lagi secara manual seperti widget slideshow pada umumnya.
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie8LEbe90pSsWJS0-zszMbYs_WrkLOX57nCZ33YIgxKBFibTBC-rhamiQ9bn38z8DZnui-QMcqUIMmmM6RQObWWZpuHET9z0pEIM6Tp-LGP2SG6wW9gL2eXAMFXZaDNhvk7-O6Hshe-ZU/s1600/Borneo+Press+on+Boogle.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie8LEbe90pSsWJS0-zszMbYs_WrkLOX57nCZ33YIgxKBFibTBC-rhamiQ9bn38z8DZnui-QMcqUIMmmM6RQObWWZpuHET9z0pEIM6Tp-LGP2SG6wW9gL2eXAMFXZaDNhvk7-O6Hshe-ZU/s1600/Borneo+Press+on+Boogle.png" /></a></div>
Berikut live demo dari template ini : <a href="http://borneo-press.blogspot.com/" target="_blank"><span style="font-size: large;"><b>LIVE DEMO</b></span></a><span style="font-size: large;"><b> </b></span><br />
<br />
Jika Anda berminat untuk menggunakan template ini, silahkan order langsung melalui alamat url link ini :<a href="http://www.borneotemplates.com/2012/01/borneo-press.html" target="_blank"><b>Borneo Press Template</b></a>.<br />
<br />
<b>Penulis</b> : Herdiansyah Hamzah<br />
<b>Blog</b> : <a href="http://www.herdiansyah.net/">www.herdiansyah.net</a>Herdiansyahhttp://www.blogger.com/profile/06354055742027741845noreply@blogger.com146tag:blogger.com,1999:blog-3657200694083844489.post-89743198420967293542011-11-18T14:03:00.001+07:002011-11-18T14:04:52.684+07:00Yahoo News Slider<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtGMxpk196ZTwtqBU3GGr1late7njqXz0UOAwlVuDgWQZEPt5j0sfF76W-f6ZLubctJywZ5EzWxJ_U6WEGrq9mInE08tY113EVRDLSfmhjEIMbkRzw3kRqcL7fMpZzogWaCs7TLRUjb8Y/s1600/Yahoo+News+Slider.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtGMxpk196ZTwtqBU3GGr1late7njqXz0UOAwlVuDgWQZEPt5j0sfF76W-f6ZLubctJywZ5EzWxJ_U6WEGrq9mInE08tY113EVRDLSfmhjEIMbkRzw3kRqcL7fMpZzogWaCs7TLRUjb8Y/s1600/Yahoo+News+Slider.jpg" /></a></div>
Sebenarnya widget ini sudah agak lama terparkir, hanya saja baru saat ini sempat dibuat tutorialnya. Yahoo News Slider, mungkin ini penyebutan yang agak tepat, mengingat widget ini memang diadopsi dari content slider news yang terdapat di situs <a href="http://www.yahoo.com/"><b>yahoo</b></a>. Untuk melihat demo dari Yahoo News Slider ini, silahkan buka link berikut : <a href="http://yahoo-news-slider.blogspot.com/" TARGET="_blank"><b>LIVE DEMO</b></a>.<br />
<br />
Berikut tutorial singkat cara memasang Yahoo News Slider di Blog Anda :<br />
<br />
<b>Pertama</b>, buka tab edit HTML blog Anda (tidak perlu dicentang), lalu masukkan kode CSS di bawah ini tepat sebelum kode ]]></b:skin> :<br />
<br />
<div style="background-color: #f6f6f6; border: 1px solid rgb(204, 204, 204); height: 140px; overflow: auto; padding: 5px 15px; width: 92%;">
/* Yahoo Slider Wrapper
----------------------------------------------- */
div.jqans-wrapper {-x-system-font:none;font-family:arial,helvetica,clean,sans-serif;font-size:12px;font-size-adjust:none;font-stretch:normal;font-style:normal;font-variant:normal;font-weight:normal;line-height:1.231;color:#666666;}
div.jqans-wrapper img {border: 0;}
div.jqans-wrapper ul,div.jqans-wrapper li,div.jqans-wrapper h1,div.jqans-wrapper p {list-style:none;margin: 0;padding: 0;}
div.jqans-wrapper {list-style:none;position: relative;overflow: hidden;}
div.jqans-wrapper ul {position: relative;left: 0;width: auto;list-style-type: none;overflow: hidden;z-index: 1;}
div.jqans-wrapper li {list-style:none;float: left;display: inline;}
/* Yahoo Slider Content
----------------------------------------------- */
div.jqans-wrapper.default .jqans-stories ul, div.jqans-wrapper.default .jqans-stories li {height: 110px;}
div.jqans-wrapper.default .jqans-stories-selector ul, div.jqans-wrapper.default .jqans-stories-selector li {height: 10px;}
div.jqans-wrapper.default, div.jqans-wrapper.default .jqans-container {width: 428px;background:#fff;}
div.jqans-wrapper.default li {width: 107px;}
div.jqans-wrapper.default a {text-decoration: none;font-weight: normal;color: #363636;outline: none;}
div.jqans-wrapper.default strong {color: #000;}
/* wrapper */
div.jqans-wrapper.default {border: 1px solid #ccc;border-width: 1px 1px 0 1px;margin: 0 0 0.5em;}
/* container */
div.jqans-wrapper.default .jqans-container {min-height: 270px;text-align: center;padding-top: 4px;}
div.jqans-wrapper.default .jqans-container a {font-weight: bold;color:#000;}
div.jqans-wrapper.default .jqans-container img {width:418px;height:200px;}
/* headline */
div.jqans-wrapper.default .jqans-headline {text-align: left;margin-left:10px;margin-bottom: 4px;font:normal 13px Arial;}
div.jqans-wrapper.default .jqans-content h1 {text-align:left;color:#16387c;margin: 1px 9px;font:bold 18px Arial;letter-spacing:-.0001em;line-height:1.1em; height:22px;overflow:hidden;}
div.jqans-wrapper.default .jqans-content p {text-align: left;color: #333;margin: 1px 9px;font:normal 12px Arial;line-height:1.3em;height:30px;overflow:hidden;}
/* stories */
div.jqans-wrapper.default .jqans-stories {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr30_2hXBDjS1SPnr6cqhlr1JZYsVPIX1C-qiZw2OcEUaGlfoUIRJykloIkOTIayp_hk2RbK5ZxssaU5Ls8tWt7fqqRvt9QGW5Fo0s-TOm_E4dHMX7JCEikQrBpscKUopp2Dw1nCDAKew/s1600/bg_stories.gif);background-repeat: repeat-x;background-position: top left;}
div.jqans-wrapper.default .jqans-stories li {overflow: hidden;text-align: center;font-size: 11px;color: #fff;line-height:1.2em;}
div.jqans-wrapper.default .jqans-stories li.selected {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXMGRodSc0Sm7Zh4NReaY5YlftuzoGO-yVye8lEciB3E3sKgLg-OwcmDhwyt00CFiu_TXAiHEnnUjJ-1LGF_H4C3tM7IWglQWTwKcJ2xU-qZx1yOhWAjdB-4ZXnARXJ0dAoxYXCKMnZUY/s1600/bg_selected.gif);background-repeat: no-repeat;background-position: top center;}
div.jqans-wrapper.default .jqans-stories li.selected a {color:#fff;}
div.jqans-wrapper.default .jqans-stories li img {margin-top: 22px;width:92px; height:45px;border-right:1px solid #fff;border-bottom:1px solid #fff;border-left:1px solid #555;border-top:1px solid #555;}
div.jqans-wrapper.default .jqans-stories li p {display: none;}
div.jqans-wrapper.default .jqans-stories li h3 {margin:0;padding:1px 10px;color:#000;
font-size:11px;font-weight:normal;font-family:Arial;height:28px;overflow:hidden;line-height:1.2em;}
div.jqans-wrapper.default .jqans-stories-selector li.selected div {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXMGRodSc0Sm7Zh4NReaY5YlftuzoGO-yVye8lEciB3E3sKgLg-OwcmDhwyt00CFiu_TXAiHEnnUjJ-1LGF_H4C3tM7IWglQWTwKcJ2xU-qZx1yOhWAjdB-4ZXnARXJ0dAoxYXCKMnZUY/s1600/bg_selected.gif);background-repeat: no-repeat;background-position: top center;}
/* pagination */
div.jqans-wrapper.default .jqans-pagination {border: 1px solid #ccc;border-width: 1px 0;margin: 0;padding: 4px 4px 4px 4px;background: #f2f2f2;text-align: left;clear: both;width: 420px;overflow: hidden;}
div.jqans-wrapper.default .jqans-pagination-count {float: left;font:normal 11px Arial;color:#666;}
div.jqans-wrapper.default .jqans-pagination-controls {float: right;}
div.jqans-wrapper.default .jqans-pagination-controls a {display: inline-block;width: 22px;height: 13px;text-indent: -9999px;background: no-repeat bottom center;*float:left;}
div.jqans-wrapper.default .jqans-pagination-controls-back a {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJq_AyoqyYIGaIhuqkgMTN6UrSWtsNYmM4SvUQaXn7ZwchJE1VJQS_v4-93Pup1q0kMvjuGPbZ35sCFd6tBhpRpxnrD6yIA7kz4Zlz6DvldFzSNtImnyKvZCytJ1PozItjtcN4tnpRApE/s1600/previous.gif);}
div.jqans-wrapper.default .jqans-pagination-controls-next a {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCILxmoIWMV0W5IeeuGjiZEPzTbHCp5Yb3f-Qmk62EEcZF3TpEAApOudIbdMoy7rn3RKucamlbha-Ym27nXRvWPXrFhHXJAJrSNcOSs2xHMJsbFKjKm5QAm-kXjXd9gYUAf_roVg1eeWE/s1600/next.gif);}
</div>
<b><br /></b><br />
<b>Kedua</b>, Anda harus memasukkan javascript code berikut setelah kode ]]></b:skin> :<br />
<br />
<div style="background-color: #f6f6f6; border: 1px solid rgb(204, 204, 204); height: 140px; overflow: auto; padding: 5px 15px; width: 92%;">
<script src='http://themestoday.googlecode.com/files/jquery.min.js'/>
<script type='text/javascript'>
//<![CDATA[
(function(a){a.fn.accessNews=function(b){var c={title:"TODAY - ",subtitle:"Choose the Trending Topics Today", slideBy:4,speed:"normal",slideShowInterval:3000,slideShowDelay:3000,theme:"default",continuousPaging:true,contentTitle:"h3",contentSubTitle:"abbr",contentDescription:"p",onLoad:null,onComplete:null};return this.each(function(){b=jQuery.extend(c,b);var k=jQuery(this);var h=k.children();var i;var j;var f;var e={_wrapper:'<div class="jqans-wrapper '+b.theme+'"></div>',_container:'<div class="jqans-container"></div>',_headline:jQuery("<div class='jqans-headline'></div>").html(["<p><strong>",b.title,"</strong> ",b.subtitle,"</p>"].join("")),_content:jQuery("<div class='jqans-content'></div>"),_stories:'<div class="jqans-stories"></div>',_first:jQuery(h[0]),init:function(){if(b.onLoad){b.onLoad.call(a(this))}k.wrap(this._wrapper);k.before(this._container);var l=(h.length*this._first.outerWidth(true));k.css("width",l);if(b.title.length){this.append(this._headline)}this.append(this._content);this.selector(l);this.set(0);d.init();g.init();k.wrap(this._stories);if(b.onComplete){b.onComplete.call(a(this))}},selector:function(n){var m="";for(var l=1;l<=h.length;l++){m+="<li><div/></li>"}var p=jQuery('<div class="jqans-stories-selector"></div>');p.append("<ul>"+m+"</ul>");j=jQuery(p.find("ul"));f=j.children();p.css("width",n);k.before(p)},append:function(l){this.get().append(l)},get:function(){return k.parents("div.jqans-wrapper").find("div.jqans-container")},set:function(n){var o=this.get();var r=jQuery(h[n]);var m=jQuery(f[n]);var q=jQuery("div.jqans-content",o);var p=jQuery("<img></img>");var l=jQuery("<div></div>");var s=jQuery(b.contentTitle+" a",r).attr("title")||jQuery(b.contentTitle,r).text();p.attr("src",jQuery("img",r).attr("longdesc")||jQuery("img",r).attr("src"));l.html("<h1>"+s+"</h1><p>"+jQuery(b.contentDescription,r).html()+"</p>");q.empty();q.append(p);q.append(l);h.removeClass("selected");r.addClass("selected");f.removeClass("selected");m.addClass("selected")}};var d={loaded:false,_animating:false,_totalPages:0,_currentPage:1,_storyWidth:0,_slideByWidth:0,init:function(){if(h.length>b.slideBy){this._totalPages=Math.ceil(h.length/b.slideBy);this._storyWidth=jQuery(h[0]).outerWidth(true);this._slideByWidth=this._storyWidth*b.slideBy;this.draw();this.loaded=true}},draw:function(){var n=jQuery('<div class="jqans-pagination"></div>').html(['<div class="jqans-pagination-count"><span class="jqans-pagination-count-start">1</span> - <span class="jqans-pagination-count-end">',b.slideBy,'</span> of <span class="jqans-pagination-count-total">',h.length,'</span> Featured News</div><div class="jqans-pagination-controls"><span class="jqans-pagination-controls-back"><a href="#" title="Back">&lt;&lt; Back</a></span><span class="jqans-pagination-controls-next"><a href="#" title="Next">Next &gt;&gt;</a></span></div>'].join(""));k.after(n);var m=jQuery(".jqans-pagination-controls-next > a",n);var l=jQuery(".jqans-pagination-controls-back > a",n);m.click(function(){var o=d._currentPage+1;d.to(o);return false});l.click(function(){var o=d._currentPage-1;d.to(o);return false})},to:function(p){if(this._animating){return}this._animating=true;var q=k.parent("div").next(".jqans-pagination");var l=jQuery(".jqans-pagination-count-start",q);var s=jQuery(".jqans-pagination-count-end",q);if(p>this._totalPages){p=b.continuousPaging?1:this._totalPages}if(p<1){p=b.continuousPaging?this._totalPages:1}var r=(p*b.slideBy)-b.slideBy;var n=(p*b.slideBy);if(n>h.length){n=h.length}var o=parseInt(k.css("left"));var m=(p*this._slideByWidth)-this._slideByWidth;l.html(r+1);s.html(n);o=(m*-1);k.animate({left:o},b.speed);j.animate({left:o},b.speed);e.set(r);this._currentPage=p;this._animating=false}};var g={init:function(){this.attach();this.off();i=setTimeout(function(){g.on()},b.slideShowDelay)},on:function(){this.off();i=setInterval(function(){g.slide()},b.slideShowInterval)},off:function(){clearInterval(i)},slide:function(){var o=jQuery("li.selected",k);var m=o.next("li");var n=0;if(!m.length){m=jQuery(h[0]);n=1}var p=h.index(m);if(d.loaded){var l=(p)%b.slideBy;if(l===0){n=(Math.ceil(p/b.slideBy))+1}if(n>0){d.to(n)}}e.set(p)},attach:function(){var l=jQuery(k).parent("div.jqans-wrapper");l.hover(function(){g.off()},function(){g.on()})}};e.init();h.hover(function(){e.set(h.index(this))},function(){})})}})(jQuery);
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function() {jQuery(&#39;#newsslider&#39;).accessNews({});
jQuery(&#39;#newsslider2&#39;).accessNews({title : &quot;BREAKING NEWS:&quot;, subtitle:&quot;stories from the internet&quot;, speed : &quot;slow&quot;, slideBy : 4, slideShowInterval: 100000, slideShowDelay: 100000});});
</script>
</div>
<br />
Langkah terakhir, silahkan save lalu tambahkan kode javascript berikut di elemen halaman yang Anda diinginkan :<br />
<br />
<div style="background-color: #f6f6f6; border: 1px solid rgb(204, 204, 204); height: 140px; overflow: auto; padding: 5px 15px; width: 92%;">
<ul id="newsslider">
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDXwjllysmycYjBlbiTa8B5vLcQH0Fm9r5uMYQI072OYoJzRO-jQK-bGRiIlVlfgW1UaUvx1ssHVxfLnjvbv3BNYlDrpnb8ouvf7FKibcpE2Sl2Z2eAg7xAcdpaEe_4jDbyjoCMZByFQ4/s1600/Facebook+Mark+Zuckerberg.jpg"/></a>
<h3><a href="#">Facebook Has Lost 6 million Users in U.S</a></h3>
<p>Independent monitoring sites showed that the Inside Facebook has lost 6 million users in the U.S. and 100,000 users... <a href="#"> more &raquo; </a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhxVpEnyttH_6yf7HXbsdREH9tcZuOC5qYCO8zN3C48OV4IjDZcGOkVHNRR1_gsuhl6PbesQf-SzzXH6uqLptRpzcD47q1gMsx3Bxr3HK4yY6xtVSLfJ599v_M4CSfu2eCcVVzh7y09-E/s1600/Rossi+Crash.jpg"/></a>
<h3><a href="#">Rossi wasn't trying to pass Stoner</a></h3>
<p>Valentino Rossi says he was not even trying to overtake Casey Stoner when he took the Honda rider out of second in the Spanish..... <a href="#">more &raquo;</a></p>
</li>
<li>
<a class="title" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO1vNT0bPPdn1Flb4ljxVQh3acxmkwknYhcFmN3oK70o_bfmtoRiu-mlTfx7svsVXybG0BcHYMpZC0Qcq0KG0Up0Xxi81K3rdZNz-ax9UJEQOgrumMQU0srOmbyTauIzU48KLpOp-v5dI/s1600/Muammar+Gaddafi.jpg" /></a>
<h3><a href="#">Gadhafi Attacks Continue Despite Coalition Bombing</a></h3>
<p>Forces loyal to Moammar Gadhafi resumed attacks on Libya’s third-largest city early Thursday despite aerial bombardments.... <a href="#">Gadhafi Attacks &raquo;</a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg63pWCLlsMCFkGlKPUw3RzyPkkdFAgz8kUADlDpyb5PW3e3ShgIYbm-2lcAJzZKTTFVskOJUliRDiE6Kc92s6uzdwgDcsJioz2al8p_KjTUuKTXZllNqY9e8hgA58svXNYSeyMzeUf6jw/s1600/Japan+Tsunami.jpg"/></a>
<h3><a href="#">Developments in Japan's Earthquake, Tsunami and Nuclear Crisis</a></h3>
<p>Highly radioactive water has been found seeping into the Pacific Ocean from a newly discovered crack in a maintenance pit on the edge.... <a href="#">Japan Crisis &raquo; </a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDXwjllysmycYjBlbiTa8B5vLcQH0Fm9r5uMYQI072OYoJzRO-jQK-bGRiIlVlfgW1UaUvx1ssHVxfLnjvbv3BNYlDrpnb8ouvf7FKibcpE2Sl2Z2eAg7xAcdpaEe_4jDbyjoCMZByFQ4/s1600/Facebook+Mark+Zuckerberg.jpg"/></a>
<h3><a href="#">Facebook and Skype Discussing Potential Partnership</a></h3>
<p>Facebook Inc., the world’s biggest social-networking company, is holding talks with Skype Technologies SA about offering... <a href="#"> Fecebook Discussion &raquo; </a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8Y1QGl_Gq8uub8YIKzdgM1M0F7H4rtJKacF8abR4OpPKDV1ZG73STWZMNX0WcOlmO6mxpfOgMyYGr_GTKfYYGjI0fgpQCrxkcnNaNirHPBZTrAa51QR3KFHf9Z_nI6-Xr3XUOEdV3Fgw/s1600/Carlos+Slim+Picture.jpg"/></a>
<h3><a href="#">10 Top List of Richest People in the World</a></h3>
<p>Forbes, a leading source for reliable business news and financial information, make a new released list of richest people in the world.... <a href="#">Richest People &raquo;</a></p>
</li>
<li>
<a class="title" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO1vNT0bPPdn1Flb4ljxVQh3acxmkwknYhcFmN3oK70o_bfmtoRiu-mlTfx7svsVXybG0BcHYMpZC0Qcq0KG0Up0Xxi81K3rdZNz-ax9UJEQOgrumMQU0srOmbyTauIzU48KLpOp-v5dI/s1600/Muammar+Gaddafi.jpg" /></a>
<h3><a href="#">Gadhafi Attacks Continue Despite Coalition Bombing</a></h3>
<p>Forces loyal to Moammar Gadhafi resumed attacks on Libya’s third-largest city early Thursday despite aerial bombardments.... <a href="#">Gadhafi Attacks &raquo;</a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg63pWCLlsMCFkGlKPUw3RzyPkkdFAgz8kUADlDpyb5PW3e3ShgIYbm-2lcAJzZKTTFVskOJUliRDiE6Kc92s6uzdwgDcsJioz2al8p_KjTUuKTXZllNqY9e8hgA58svXNYSeyMzeUf6jw/s1600/Japan+Tsunami.jpg"/></a>
<h3><a href="#">Developments in Japan's Earthquake, Tsunami and Nuclear Crisis</a></h3>
<p>Highly radioactive water has been found seeping into the Pacific Ocean from a newly discovered crack in a maintenance pit on the edge.... <a href="#">Japan Crisis &raquo; </a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDXwjllysmycYjBlbiTa8B5vLcQH0Fm9r5uMYQI072OYoJzRO-jQK-bGRiIlVlfgW1UaUvx1ssHVxfLnjvbv3BNYlDrpnb8ouvf7FKibcpE2Sl2Z2eAg7xAcdpaEe_4jDbyjoCMZByFQ4/s1600/Facebook+Mark+Zuckerberg.jpg"/></a>
<h3><a href="#">Facebook and Skype Discussing Potential Partnership</a></h3>
<p>Facebook Inc., the world’s biggest social-networking company, is holding talks with Skype Technologies SA about offering... <a href="#"> Fecebook Discussion &raquo; </a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8Y1QGl_Gq8uub8YIKzdgM1M0F7H4rtJKacF8abR4OpPKDV1ZG73STWZMNX0WcOlmO6mxpfOgMyYGr_GTKfYYGjI0fgpQCrxkcnNaNirHPBZTrAa51QR3KFHf9Z_nI6-Xr3XUOEdV3Fgw/s1600/Carlos+Slim+Picture.jpg"/></a>
<h3><a href="#">10 Top List of Richest People in the World</a></h3>
<p>Forbes, a leading source for reliable business news and financial information, make a new released list of richest people in the world.... <a href="#">Richest People &raquo;</a></p>
</li>
<li>
<a class="title" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO1vNT0bPPdn1Flb4ljxVQh3acxmkwknYhcFmN3oK70o_bfmtoRiu-mlTfx7svsVXybG0BcHYMpZC0Qcq0KG0Up0Xxi81K3rdZNz-ax9UJEQOgrumMQU0srOmbyTauIzU48KLpOp-v5dI/s1600/Muammar+Gaddafi.jpg" /></a>
<h3><a href="#">Gadhafi Attacks Continue Despite Coalition Bombing</a></h3>
<p>Forces loyal to Moammar Gadhafi resumed attacks on Libya’s third-largest city early Thursday despite aerial bombardments.... <a href="#">Gadhafi Attacks &raquo;</a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg63pWCLlsMCFkGlKPUw3RzyPkkdFAgz8kUADlDpyb5PW3e3ShgIYbm-2lcAJzZKTTFVskOJUliRDiE6Kc92s6uzdwgDcsJioz2al8p_KjTUuKTXZllNqY9e8hgA58svXNYSeyMzeUf6jw/s1600/Japan+Tsunami.jpg"/></a>
<h3><a href="#">Developments in Japan's Earthquake, Tsunami and Nuclear Crisis</a></h3>
<p>Highly radioactive water has been found seeping into the Pacific Ocean from a newly discovered crack in a maintenance pit on the edge.... <a href="#">Japan Crisis &raquo; </a></p>
</li>
</ul>
</div>
<br />
Selesai, silahkan lihat hasilnya.Herdiansyahhttp://www.blogger.com/profile/06354055742027741845noreply@blogger.com67tag:blogger.com,1999:blog-3657200694083844489.post-91467837021877670592011-10-31T16:23:00.000+07:002011-10-31T16:23:14.447+07:00Cara Memasang Google Plus WidgetGoogle Plus merupakan jejaring sosial punya Mbah <a href="http://www.google.co.id/">Google</a>. Memang harus diakui, Google Plus ini tidak sefamiliar Facebook, twitter, dan lainnya (paling tidak untuk saat ini). Nah, untuk memudahkan Anda membangun jaringan atau circle di Google Plus, ada baiknya Anda meletakkan widget Google Plus di blog Anda. Berikut langkah-langkah yang harus Anda lakukan :<br />
<br />
<b>Pertama</b>, Anda terlebih dahulu harus masuk kehalaman Google Plus, lalu ambil ID Google Plus Anda. Berikut contoh ID Google Plus : https://plus.google.com/u/0/<b style="color: #cc0000;">107027008490478634206</b>/posts. ID Google Plus adalah bagian yang berwarna merah.<br />
<br />
<b>Kedua</b>, masuk terlebih dahulu ke alamat url ini : <b><a href="http://widgetsplus.com/" target="_blank">Widget Plus</a></b>. Setelah itu, klik <b>Get Widget</b> seperti gambar dibawah ini :<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhr8O4eXzJewW8dKpVoOs3ai2Brt_JPx-qsgzBkWBHaS766aQ65hCoNtOMqhWb01hBQgSXbVFrdDoYtN5w43O64ey_rdRUQjVxDHA3i9GrLCiChb1X8r7OIAnu0WbvnbayzuEa3E063LtE/s1600/Google+Plus+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhr8O4eXzJewW8dKpVoOs3ai2Brt_JPx-qsgzBkWBHaS766aQ65hCoNtOMqhWb01hBQgSXbVFrdDoYtN5w43O64ey_rdRUQjVxDHA3i9GrLCiChb1X8r7OIAnu0WbvnbayzuEa3E063LtE/s1600/Google+Plus+1.png" /></a></div>
Ketiga, masukkan ID Google Plus Anda di bagian yang diminta, lalu tekan Get Code.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlDIx_0_h1J8zqZ4ORRRtPCCg28M4OB9ly6fI_uca2b871k5PlLpX0xpXzw87Fr3mYoCT1ZALbpp4CcTwHsYxmBxu7GNNir9_sZhR8JsPWm3OnCxNro8US6eqGdRBTXakcESu5Xurx5lo/s1600/Google+Plus+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlDIx_0_h1J8zqZ4ORRRtPCCg28M4OB9ly6fI_uca2b871k5PlLpX0xpXzw87Fr3mYoCT1ZALbpp4CcTwHsYxmBxu7GNNir9_sZhR8JsPWm3OnCxNro8US6eqGdRBTXakcESu5Xurx5lo/s1600/Google+Plus+2.png" /></a></div>
Selesai, silahkan ambil script code, lalu simpan di sidebar atau kolom lain diblog Anda. Selamat mencoba dan semoga sukses mambangun jaringan dengan Google Plus Anda.Herdiansyahhttp://www.blogger.com/profile/06354055742027741845noreply@blogger.com71tag:blogger.com,1999:blog-3657200694083844489.post-77069525881286862482010-12-03T14:28:00.001+07:002010-12-03T14:28:53.796+07:00Celebration untuk komentar 500 + 5<p>Alhamdulillah .. trim’s buat all blogger yang telah mendukung dengan meninggalkan jejak-nya pada postingan “ <a title="submit webmastertool" href="http://catalog-tutorial.blogspot.com/2008/02/mendaftarkan-blog-ke-search-engine.html">mendaftarkan blog di search google</a> “. Tentu saja tulisan tersebut terlalu basic kalau  berbicara tentang seo yang medan-nya sangat luas untuk di bahas. – konon karena seo lebih dominan mesin yang bekerjanya, maka perlu di lawan atau di imbangi dengan mesin ( sebuah tool seo ) juga. Anda boleh percaya atau tidak.. karena bagi saya sendiri seo merupakan wilayah yang masih abu-abu untuk di raba. -</p> <p>Ok trim’s sekali buat kalian.</p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com54tag:blogger.com,1999:blog-3657200694083844489.post-62149391177716894492010-11-05T21:30:00.001+07:002010-11-05T21:47:59.657+07:00Trik Jitu Mempercepat Loding Blog<p>Trik jitu menambah atau menaikan peforma blog ( <strong>kecepatan loding blog</strong> ) ini sebenarnya sangat simple, sepele dan logis. Namun justru itu kadang hal hal  yang sepele suka luput untuk kita perhatikan. </p> <p>Apa yang saya maksud kan di sini ialah ; jika kita mempunyai banyak file javascript, sering kali yang kita lakukan menyimpan dengan url ter-sendiri ( url file javascript -nya berbeda-beda ) walaupun tempat penyimpananya sama. maka yang terjadi saat loding blog, browser akan meminta dan menerima javascript satu persatu dengan cara dicicil. Tidak demikian halnya jika kita <font style="background-color: #ffcccc">mengabungkan file-file</font>  javascript tersebut dalam satu file dan dalam satu url, maka secara logika browser akan menerima paket javascript yang kita miliki secara bersamaan. Sangat simple, sepele dan logis bukan ?</p> <p>Cara seperti  di atas  telah saya aplikasikan pada blog ini dan terbukti menambah score sampai 4 (empat) bit di <a title="yslow" href="http://catalog-tutorial.blogspot.com/2009/11/optimasi-speed-blog-untuk-peringkat-di.html">Yslow</a>  </p> <h3>Trik Jitu</h3> <p>Jika anda peduli dengan blog ke sayangan anda. Mari kita praktekan sekarang juga.</p> <blockquote> <p>»  Gunakan browser <strong>Firefox</strong>, kemudian unduh dan  install pengaya { add-ons ) <strong><a href="https://addons.mozilla.org/en-US/firefox/addon/1843/" target="_blank">FireBug</a></strong> dan <strong><a title="yslow" href="https://addons.mozilla.org/en-US/firefox/addon/5369/" target="_blank">Yslow</a></strong>. ( sesuia kan dengan versi Firefox anda ).</p> </blockquote> <blockquote> <p>»  Setelah keduanya terinstall klik ikon Firebug di pojok kanan bawah browser ( icon mirip binatang  kecoa ).</p> </blockquote> <blockquote> <p>» Dalam tab menu pilih menu <strong>Yslow</strong>, kemudian klik <strong>Grade</strong> untuk mengetahui nilai status score blog kita ( ingat score anda berapa ).</p> </blockquote> <blockquote> <p>» Masih dalam Yslow, kemudian klik menu <strong>Tool</strong>. Setelah itu pilih dan klik tulisan <strong>All JS Minified</strong> ( tool compres javascript).</p> </blockquote> <blockquote> <p>» Dalam jendela yang terbuka banyak javascript yang telah di compres, pilih javascript yang ingin anda gabungkan. copy paste ke dalam <strong>program notepad</strong>. kemudian save as ke dalam format <strong>file  JS</strong> ( contoh pada kolom <strong>file name</strong> di isi :  <strong>myscript.JS</strong> . kemudian pada Sa<strong>ve as Type</strong> pilih <strong>All File</strong> ).</p> </blockquote> <blockquote> <p>» Upload file javascript tersebut ke tempat biasa anda menyimpanya. ( saran saya simpan di <strong><a title="menyimpan javascript di code google" href="http://catalog-tutorial.blogspot.com/2009/05/mana-tahaaan.html" target="_blank">Code Google</a></strong> ).</p> </blockquote> <blockquote> <p>»  Sebelum mengganti dan menghapus javascript lama dengan file javacsript yang baru, di backup dulu terutama url javascript.</p> </blockquote> <blockquote> <p>» Setelah beres dan tidak ada masalah, coba test kembali peforma blog anda di Yslow – klik Grade, dan perhatikan berapa bit score angkanya, berapa score perubahannya.. dan laporkan di sini kepada saya.. heheheh..</p></blockquote> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com79tag:blogger.com,1999:blog-3657200694083844489.post-24691362542622493082010-11-03T23:22:00.001+07:002010-11-03T23:22:47.972+07:00Dapat License Grade A Dari Yslow<p>Entah ke masukan malaikat apa, akhir-akhir ini saya gemar sekali untuk mengecek beberapa blog yang saya miliki dengan <a title="yslow" href="http://catalog-tutorial.blogspot.com/2009/11/optimasi-speed-blog-untuk-peringkat-di.html">yslow</a> dan page speed, – tool yang mengecek peforma kecepatan loding blog. </p> <p>Seperti kejadian empat hari yang lalu saat merenovasi blog “<a title="optimasi speed loding" href="http://jaloee.blogspot.com/2010/10/page-speed-89-yslow-81.html">be’loon</a>” ini ,  tak lupa dan tak bosannya saya untuk selalu cek peformanya dengan bantuan kedua tool tersebut secara real time. kegemaran baru ini tidak ada hubunganya dengan SEO – <a title="site performance" href="http://catalog-tutorial.blogspot.com/2009/11/optimasi-speed-blog-untuk-peringkat-di.html">PageRank</a> , karena menurut saya backlink berkualitas masih merupakan garda terdepan dan utama untuk mempengaruhi PageRank.</p> <p>Mungkin satu hal kenapa saya merasa betah dengan menggunakan kedua tool tersebut, pertama karena merupakan materi baru yang di pelajari dan kedua menjadi tantangan untuk membuat blog yang ramah terhadap waktu namun tetap menampilkan desain yang berkarakter – menurut penilaian saya tentunya.</p> <p>Namun sayang nya kegemaran ini tidak mungkin bagi saya dan pengguna blosgpot untuk mencapai nilai puncak, atau dengan kata lain mendapatkan lisensi Grade A dari Yslow ( score 90 +.. ). Kendalanya bukan libido yang selalu ingin menghadirkan gambar pada setiap blog yang saya miliki , namun template bawa-an dari blogspot pada dasarnya sudah memilki masalah – ini menurut pendapat saya -. Terutama untuk masalah pada standarisasi validasitas markah W3C. – kejadiaanya hampir sama dengan produk google - page speed versi 1.7.1  pada minify html nya ( reperensi compres css-nya ) yang ternyata banyak di keluhkan karena berbenturan dengan validasi via W3C. </p> <p>Kedua pada compres javascript ( bagi yang mengunakan javascript ), karena mungkin saja hasil akhirnya tidak benar-benar mengkompres javascript secara tuntas alias masih prematur – bila saya salah menyimpulkan dapat anda lihat video pada <a href="http://net.tutsplus.com/tutorials/javascript-ajax/extreme-javascript-performance/" target="_blank">blog berikut</a>.</p> <p>Karena keterbatasan itu, maka  Grade B score antara 80 –90 untuk di pertahankan  menurut saya sudah merupakan hasil yang maksimal dan penuh perjuangan, walaupun masih banyak waktu jeda bagi pengguna modem 56 kb. </p> <p>Kecuali jika kita kekeuh ingin mendapatkan peforma puncak atau performance score 96 licensi Grade A. Syaratnya tidak ada postingan, gadget dan perambah lainnya. – ini sudah saya buktikan.</p> <p>Nb ( tapi mungkin sewaktu-waktu teman kita –yang menggunakan blosgpot,  ada yang mendapatkan Grade A. wallahu ‘alam. </p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com32tag:blogger.com,1999:blog-3657200694083844489.post-10976589923566962132010-09-24T20:44:00.001+07:002010-09-24T20:47:06.902+07:00Sporty Magazine Template<p>Bulan ini mas <a href="http://www.herdiansyah.web.id/" target="_blank">herdiansyah</a> kirim lagi <strong>template blogger</strong> ke <a href="http://gotemplatez.blogspot.com/" target="_blank">gotemplatez</a>. Tema templatenya kali ini terutama dirancang untuk yang hobby dan ingin <strong>membuat blog seputar berita olah raga</strong> atau konten olah raga.  </p> <p>Saat masih dalam tahap finising, saya sudah tertarik berat sama template yang satu ini, sampai pinjam kodenya tampa se-izin empunya. Terutama untuk desain <strong>navigasi, kolom slide</strong> dan bagian <strong>header</strong> ( <strong>body background</strong> ) sangat bagus dan menyatu dengan tema. </p> <p><a href="http://lh5.ggpht.com/_dShEltFXlHs/TJyrPlV-_LI/AAAAAAAAGHI/-gOUz3VKoDM/s1600-h/sporty-magazine%5B6%5D.jpg"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="sporty-magazine" border="0" alt="sporty-magazine" src="http://lh5.ggpht.com/_dShEltFXlHs/TJyrUYTP2HI/AAAAAAAAGHM/PFmd1kyK18c/sporty-magazine_thumb%5B4%5D.jpg?imgmax=800" width="454" height="709" /></a> </p> <p><strong>Sporty Magazine</strong> : <a href="http://sportymagazine.blogspot.com/" target="_blank">DEMO</a> | <a href="http://gotemplatez.blogspot.com/" target="_blank">DONWLOAD</a></p> <p>Lebih lanjut untuk detail keterangan ( dan intruksi ), dapat saudara lihat di <a href="http://sportymagazine.blogspot.com/2010/09/instruction-how-to-use-sporty-magazine.html" target="_blank">instruction how to use sporty magazine</a></p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com34tag:blogger.com,1999:blog-3657200694083844489.post-73559618657506785922010-09-19T16:34:00.001+07:002010-09-19T16:34:25.892+07:00Berapa lama blog kita terdaftar di google ?<blockquote> <h3>setelah aku coba kenapa masih belum muncul di google, padahal udah berhasil terverifikasi. dimana kesalahannya ??</h3> </blockquote> <p>Pertanyaan ini sering kali muncul saat mengikuti tutorial “ <a href="http://catalog-tutorial.blogspot.com/2008/02/mendaftarkan-blog-ke-search-engine.html" target="_blank">mendaftarkan blog di goggle webmastertool</a>”. Dan saya selalu jawab “ sabar, sabar dan sabar “. Karena jika secara prosedural sudah benar, namun untuk terdaftar dalam database otoritas –nya sudah pada wilayah oom google.</p> <p>Dan pengalaman saya saat submit ke webmaster pun berbeda-beda, ada yang satu hari langsung muncul di list google, ada yang tiga hari, bahkan salah satu blog yang saya submit baru terlist setelah menunggu selama tujuh hari.</p> <p>Ada ucapan bijak “ <strong>waktu satu menit akan terasa lama jika kita menunggunya”.</strong> jadi enjoy aja.</p> <h3>Tapi Saya Tetap Penasaran </h3> <p>Penasaran, ketidak sabaran atau keraguan takut salah saat submit ke webmastertool suatu yang sangat wajar. Boleh saja kita memeriksa kembali prosedurnya. untuk blogspot coba cek di tab “ <strong>Setting</strong> “ dan pastikan pilihan “ <strong>Yes</strong> “ pada “ <strong>Let search engines find your blog?</strong> “, gunakan template standar (basic) jika kita merasa kurang tahu dengan template yang seo frendly, jangan putus asa tetap rajin posting dengan tulisan yang sesuai keyword ( title blog ) yang menjadi target. contoh jika title blog kita tentang “ donwload free mp3 “, posting yang isinya ada tulisan tersebut, dan alangkah bagusnya jika di beri bold ( di pertebal ). </p> <p>Namun setelah lama sekali tidak juga terdaftar coba minta peninjauan kembali ke pihak google. caranya masuk ke akun google anda dan isi permintaan pada link berikut : <a title="https://www.google.com/webmasters/tools/reconsideration" href="https://www.google.com/webmasters/tools/reconsideration">https://www.google.com/webmasters/tools/reconsideration</a></p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com67tag:blogger.com,1999:blog-3657200694083844489.post-23811632275058093022010-09-06T01:47:00.001+07:002010-09-06T02:10:08.133+07:00Easy Loding Template For Blogger<p>Setelah banyak menuai apresiasi dari blogspere atas rancangan template-nya <a href="http://catalog-tutorial.blogspot.com/2010/02/zoom-magazine-template.html" target="_blank">Zoom Magazine</a>, kali ini sobat saya <a href="http://www.herdiansyah.web.id/" target="_blank">Herdiansyah Hamzah</a> mengririm lagi template baru untuk pengguna blogcepot  ke redaksi <a href="http://gotemplatez.blogspot.com/" target="_blank">gotemplatez</a>.</p> <p>Template yang di beri nama “ <strong>easy loding template</strong> “ ini konsep nya masih seperti  template sebelumnya sangat fleksibel dan dinamis. Walaupun pada dasarnya saya sering menemukan template dengan tata letak yang sama, namun melihat struktrur desain yang bersih, pemilhan warna yang serasi, tab yang cantik dan tata letak kolom-nya sangat rapih membuat saya langsung jatuh hati ketika pertama kali melihatnya. Tidak berlebihan jika menurut saya pribadi rancangan template ini di susun sangat teliti dan penuh kesabaran.</p> <p>Untuk menguji kestabilan struktur kolom dan antar muka nya pada tampilan browser ie 6 dan ie 7, kemarin saya mengujinya dengan menggunakan aplikasi <strong>IE-Tester</strong>, hasilnya sangat memuaskan sekali tak ada perubahan yang begitu dramatis.</p> <h3>Tampilan Halaman Depan</h3> <p>Pada halaman depan template ini di bagi ke dalam tiga kolom. yaitu sidebar-left, main-post dan sidebar right. sedangkan untuk bagian bawah ( footter ) memiliki 3 kolom.</p> <p><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoSoPplmiIajDIc5ptFDP364JdjeCY3JoQ6uKSBCbOnIBgAn8OBHf7Ma_4xCK8_vIn4jUAkQeCDcHHftWfDlNVrrxpyrWnnKshsLbzGjaGGSn6DPqzHmKrD80YjpDw5NOAkhKkG3oGXJ4/s1600-h/easy-loding-01%5B4%5D.jpg"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="easy-loding-01" border="0" alt="easy-loding-01" src="http://lh3.ggpht.com/_dShEltFXlHs/TIPlqqZdhnI/AAAAAAAAGDY/FprswvQAx_0/easy-loding-01_thumb%5B2%5D.jpg?imgmax=800" width="450" height="450" /></a> </p> <h3>Tampilan Halaman Postingan</h3> <p>Sedangkan pada halaman postingan mempunyai 2 kolom.</p> <p><a href="http://lh3.ggpht.com/_dShEltFXlHs/TIPls2iwBrI/AAAAAAAAGDc/P8JE8cOS-ec/s1600-h/easy-loding-02%5B4%5D.jpg"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="easy-loding-02" border="0" alt="easy-loding-02" src="http://lh4.ggpht.com/_dShEltFXlHs/TIPlupSC24I/AAAAAAAAGDg/2l-SBgi9-eA/easy-loding-02_thumb%5B2%5D.jpg?imgmax=800" width="450" height="500" /></a> </p> <p> </p> <p><a href="http://easy-loading.blogspot.com/" target="_blank">Demo</a> Dan Download di <a href="http://gotemplatez.blogspot.com/2010/09/easy-loading.html" target="_blank">Gotemplatez</a></p> <p> </p> <p> </p> <p> <br /><b><i>Quote of the day: </i></b> <br />Allah swt. berfirman : “Aku menurut sangkaan hambaKu kepadaKu, dan Aku bersamanya ketika ia mengingatKu. Jika ia mengingatKu dalam dirinya maka Aku mengingatnya dalam diriKu. Jika ia mengingatKu dalam kelompok orang-orang yang lebih baik dari padanya. Jika ia mendekat kepadaKu sejengkal maka Aku mendekat kepadanya sehasta. Jika ia mendekat kepadaKu sehasta, maka Aku mendekat kepadanya sedepa. Jika ia datang kepadaKu dengan berjalan maka Aku datang kepadanya dengan berlari-lari kecil”.. – Hadist Qudsi.</p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com33tag:blogger.com,1999:blog-3657200694083844489.post-45923718968034014492010-09-02T20:59:00.001+07:002010-09-02T20:59:39.158+07:00Menambah Widget Populer Posts dan Blog Stats di blogger<p><a href="http://lh5.ggpht.com/_dShEltFXlHs/TH-tpJwdTCI/AAAAAAAAGC8/HjxJRh2lY-M/s1600-h/Untitled-1%5B5%5D.jpg"><img style="border-bottom: 0px; border-left: 0px; display: block; float: none; margin-left: auto; border-top: 0px; margin-right: auto; border-right: 0px" title="Untitled-1" border="0" alt="Untitled-1" src="http://lh3.ggpht.com/_dShEltFXlHs/TH-tyKhPxKI/AAAAAAAAGDA/vK7K59tk9yw/Untitled-1_thumb%5B3%5D.jpg?imgmax=800" width="500" height="300" /></a> </p> <p>Cukup menarik widget ini jika di tambahkan ke dalam blog kita. karena kita sebagai pemilik blog akan mengetahui secara real time tulisan kita yang sering di baca oleh pengunjung dan info jumlah yang mengakses blog kita.</p> <p>Namun sayangnya terutama untuk populer post tidak terdapat kebebasan untuk menampilkan jumlah populer post yang akan kita tampilkan. Artinya kita harus mengikuti secara default jumlah populer post-nya yakni 10 populer post.</p> <p>Ani Lenox jika kita ingin menambahkan widget di atas tersebut anda bisa mendapatkan pada <a href="http://draft.blogger.com/">blogger in draf</a>.</p> <p>Caranya mudah bangeut klik Add a Gadget – Populer Posts or Blog Stats.</p> <p><b><i></i></b></p> <p><b><i>Quote of the day: </i></b> <br />The most merciful thing in the world, I think, is the inability of the human mind to correlate all its contents. - H. P. Lovecraft</p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com41tag:blogger.com,1999:blog-3657200694083844489.post-10883359854157594212010-08-23T00:25:00.001+07:002010-08-23T00:25:03.848+07:00Sekali lagi tentang intro img – : gambar : -<p><strong>selamat malam, <br />mau tanya.. untuk bikin intro page yg tanpa flash bagaimana kode dan tutorialnya? jadi memakai gambar dan cukup satu tulisan saja..saya sedikit bingung..karena hanya ada tutorial utk flash saja..</strong></p> <p>Pertayaan di atas saya dapati via form comment kemarin. </p> <p>Dan sebenarnya untuk memasang <a href="http://mycatut.blogspot.com/">intro img</a> sama saja dengan pasang <a href="http://catalog-tutorial.blogspot.com/2009/09/pasang-animasi-intro-flash-di-blogger.html">intro flash</a> cuman objeknya saja yang berbeda. tapi baiklah akan saya jelaskan di sini. Dan silahkan anda modifikasi sesuai keinginan anda.</p> <p><strong>Pertama:</strong></p> <p>Siapkan dulu file img-nya, ukuran tinggi saya sarankan kurang dari 400 px, karena jika lebih dari itu akan munculnya tab scroll dan menurut saya kurang bagus. Sedangkan untuk ukuran lebar kurang dari 960 px, untuk resolusi monitor 1024 px. namun lebih baik jangan terlalu besar ukuran pixel-nya biar cepat untuk di loding. Untuk format file img Jpg dan Gif</p> <p>Setelah beres simpan img file-nya pada img hosting seperti picasa, photobucket, imgus dll.</p> <p><strong>Kedua.</strong></p> <p>Tandai tulisan <font color="#ff0000">Expand Widget Templates</font>.</p> <p>Kemudian cari Html </p> <p><font color="#ff0000"><body></font></p> <p>Ganti dengan script di bawah.</p> <div id="codeSnippetWrapper" class="csharpcode-wrapper"> <div id="codeSnippet" class="csharpcode"> <pre class="alt"><pre class="alteven"><body></pre><p><div id='intro'> <br /><div align='center'> <p style='padding:50px 0 20px;'> </p><p><a expr:href='data:blog.homepageUrl + &quot;search/label/?max-results=4&quot;'><p><img alt='Desert' border='0' height='210' </p><p>src='<font color="#ff0000">http://gambarkamu.jpg</font>' <br />style='border-bottom: 0px; border-left: 0px; display: inline; <br />border-top: 0px; border-right: 0px' title='Desert' width='300'/></a> </p><br /><p style='padding-top:5px;font-size:18px;font-weight:bold;color:#fff;'></p><p><a expr:href='data:blog.homepageUrl + &quot;search/label/?max-results=4&quot;'></p><p>skip intro or login to blog</a></p> </p><p></div> <br /></div></p><!--CRLF--></pre>
</div>
</div>
<p>Ganti <strong><font color="#ff0000">http://gamabrkamu.jpg</font></strong> yaitu url img di atas  dengan alamat gambar yang anda simpan . sesuaikan juga untuk ukuran width dan height dengan ukuran gambar yang anda miliki.</p>
<p>Setelah itu cari kode </p>
<p><font color="#ff0000"><b:includable id='main'></font></p>
<p>kemudian masukan di bawahnya css berikut.</p>
<p><b:if cond='data:blog.url == data:blog.homepageUrl'>
<br /><style>
<br />#navbar-iframe{display:none; height:0; visibility:hidden}
<br />body {
<br />background-color: #000000;
<br />background-image: none;
<br />}
<br />#intro {
<br />text-align:center;
<br />margin:auto;
<br />padding:auto;
<br />}
<br />#outer-wrapper{display:none;}
<br /></style>
<br /><b:else/>
<br /><style>#intro{display:none;}</style>
<br /></b:if></p>
<p>Setelah itu di atas kode</p>
<p><font color="#ff0000">]]></b:skin></font></p>
<p>masukan css berikut</p>
<p>body#layout #intro {display:none;}</p>
<p>Pratinjau dan Save</p>
<p></p>
<p> </p>
<br /><b><i>Quote of the day: </i></b>
<br />Allah Yang Maha Mulia dan Maha Besar berfirman : “Apabila hamba-Ku senang bertemu dengan Ku, maka Aku senang untuk bertemu dengan-Nya, apabila ia benci bertemu dengan-Ku, maka Aku benci bertemu dengannya. – hadis qudsi. Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com24tag:blogger.com,1999:blog-3657200694083844489.post-50579650226512224552010-08-13T22:24:00.001+07:002010-08-13T22:24:51.931+07:00Lagi Tentang Meratakan Img Dengan Post-Body<p>Lagi pertanyaan masuk tentang “ <a href="http://catalog-tutorial.blogspot.com/2010/08/meratakan-img-dengan-post-body.html" target="_blank">meratakan img dengan post-body</a> “, via my facebuuk. Pada post sebelumnya saya lebih menyarakan untuk mendownload template Hybrid News, karena trik yang saya gunakan pada <a href="http://jaloee.blogspot.com/search/label/Bloon?max-results=7" target="_blank">blog bloon</a> mengunakan apa yang ada pada template hybrid news tersebut. </p> <p>Baiklah ada beberapa yang perlu di lakukan agar img dengan post-body kurang lebih sejajar ( pada halaman depan-nya saja ).</p> <p><strong>Langkah Pertama</strong></p> <p>Memasukan script read more otomatis versi 3 ( versi sebelumnya juga bisa red. ) </p> <p>simpan di bawah tag;</p> <p><strong>]]></b:skin></strong></p> <pre class="javascript" style="font-size: small; font-family: consolas," #ffffff;?="#ffffff;?" background-color:="background-color:" monospace;="monospace;" courier,="courier," New?,="New?," Courier="Courier"><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: center">Javascript, using GeSHi 1.0.8.8</div><ol><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"><</span>script type<span style="color: #339933">=</span><span style="color: #3366cc">'text/javascript'</span><span style="color: #339933">></span> <span style="font-weight: bold; color: #003366">var</span> thumbnail_mode <span style="color: #339933">=</span> <span style="color: #339933">&</span>quot<span style="color: #339933">;</span>no<span style="color: #339933">-</span>float<span style="color: #339933">&</span>quot<span style="color: #339933">;</span> <span style="color: #339933">;</span> summary_noimg <span style="color: #339933">=</span> <span style="color: #cc0000">140</span><span style="color: #339933">;</span> summary_img <span style="color: #339933">=</span> <span style="color: #cc0000">140</span><span style="color: #339933">;</span> img_thumb_height <span style="color: #339933">=</span> <span style="color: #cc0000">110</span><span style="color: #339933">;</span> img_thumb_width <span style="color: #339933">=</span> <span style="color: #cc0000">110</span><span style="color: #339933">;</span> <span style="color: #339933"></</span>script<span style="color: #339933">></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"><</span>script type<span style="color: #339933">=</span><span style="color: #3366cc">'text/javascript'</span><span style="color: #339933">></span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #006600; font-style: italic">//<![CDATA[</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #003366">function</span> removeHtmlTag<span style="color: #009900">(</span>strx<span style="color: #339933">,</span>chop<span style="color: #009900">)</span><span style="color: #009900">{</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #000066">if</span><span style="color: #009900">(</span>strx.<span style="color: #660066">indexOf</span><span style="color: #009900">(</span><span style="color: #3366cc">"<"</span><span style="color: #009900">)</span><span style="color: #339933">!=-</span><span style="color: #cc0000">1</span><span style="color: #009900">)</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #009900">{</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #003366">var</span> s <span style="color: #339933">=</span> strx.<span style="color: #660066">split</span><span style="color: #009900">(</span><span style="color: #3366cc">"<"</span><span style="color: #009900">)</span><span style="color: #339933">;</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #000066">for</span><span style="color: #009900">(</span><span style="font-weight: bold; color: #003366">var</span> i<span style="color: #339933">=</span><span style="color: #cc0000">0</span><span style="color: #339933">;</span>i<span style="color: #339933"><</span>s.<span style="color: #660066">length</span><span style="color: #339933">;</span>i<span style="color: #339933">++</span><span style="color: #009900">)</span><span style="color: #009900">{</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #000066">if</span><span style="color: #009900">(</span>s<span style="color: #009900">[</span>i<span style="color: #009900">]</span>.<span style="color: #660066">indexOf</span><span style="color: #009900">(</span><span style="color: #3366cc">">"</span><span style="color: #009900">)</span><span style="color: #339933">!=-</span><span style="color: #cc0000">1</span><span style="color: #009900">)</span><span style="color: #009900">{</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">s<span style="color: #009900">[</span>i<span style="color: #009900">]</span> <span style="color: #339933">=</span> s<span style="color: #009900">[</span>i<span style="color: #009900">]</span>.<span style="color: #660066">substring</span><span style="color: #009900">(</span>s<span style="color: #009900">[</span>i<span style="color: #009900">]</span>.<span style="color: #660066">indexOf</span><span style="color: #009900">(</span><span style="color: #3366cc">">"</span><span style="color: #009900">)</span><span style="color: #339933">+</span><span style="color: #cc0000">1</span><span style="color: #339933">,</span>s<span style="color: #009900">[</span>i<span style="color: #009900">]</span>.<span style="color: #660066">length</span><span style="color: #009900">)</span><span style="color: #339933">;</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #009900">}</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #009900">}</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">strx <span style="color: #339933">=</span> s.<span style="color: #660066">join</span><span style="color: #009900">(</span><span style="color: #3366cc">""</span><span style="color: #009900">)</span><span style="color: #339933">;</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #009900">}</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">chop <span style="color: #339933">=</span> <span style="color: #009900">(</span>chop <span style="color: #339933"><</span> strx.<span style="color: #660066">length</span><span style="color: #339933">-</span><span style="color: #cc0000">1</span><span style="color: #009900">)</span> <span style="color: #339933">?</span> chop <span style="color: #339933">:</span> strx.<span style="color: #660066">length</span><span style="color: #339933">-</span><span style="color: #cc0000">2</span><span style="color: #339933">;</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #000066">while</span><span style="color: #009900">(</span>strx.<span style="color: #660066">charAt</span><span style="color: #009900">(</span>chop<span style="color: #339933">-</span><span style="color: #cc0000">1</span><span style="color: #009900">)</span><span style="color: #339933">!=</span><span style="color: #3366cc">' '</span> <span style="color: #339933">&&</span> strx.<span style="color: #660066">indexOf</span><span style="color: #009900">(</span><span style="color: #3366cc">' '</span><span style="color: #339933">,</span>chop<span style="color: #009900">)</span><span style="color: #339933">!=-</span><span style="color: #cc0000">1</span><span style="color: #009900">)</span> chop<span style="color: #339933">++;</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">strx <span style="color: #339933">=</span> strx.<span style="color: #660066">substring</span><span style="color: #009900">(</span><span style="color: #cc0000">0</span><span style="color: #339933">,</span>chop<span style="color: #339933">-</span><span style="color: #cc0000">1</span><span style="color: #009900">)</span><span style="color: #339933">;</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #000066">return</span> strx<span style="color: #339933">+</span><span style="color: #3366cc">'...'</span><span style="color: #339933">;</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #009900">}</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #003366">function</span> createSummaryAndThumb<span style="color: #009900">(</span>pID<span style="color: #009900">)</span><span style="color: #009900">{</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #003366">var</span> div <span style="color: #339933">=</span> document.<span style="color: #660066">getElementById</span><span style="color: #009900">(</span>pID<span style="color: #009900">)</span><span style="color: #339933">;</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #003366">var</span> imgtag <span style="color: #339933">=</span> <span style="color: #3366cc">""</span><span style="color: #339933">;</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #003366">var</span> img <span style="color: #339933">=</span> div.<span style="color: #660066">getElementsByTagName</span><span style="color: #009900">(</span><span style="color: #3366cc">"img"</span><span style="color: #009900">)</span><span style="color: #339933">;</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #000066">if</span><span style="color: #009900">(</span>img.<span style="color: #660066">length</span><span style="color: #339933"><=</span><span style="color: #cc0000">0</span><span style="color: #009900">)</span> <span style="color: #009900">{</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">imgtag <span style="color: #339933">=</span> <span style="color: #3366cc">'<span style="float:left; padding:0px 20px 5px 0px; margin:-50px 0 0 0 !important;"><img src="http://i584.photobucket.com/albums/ss289/hemingways-studio/Have_Images_TEXT.png" width="'</span><span style="color: #339933">+</span>img_thumb_width<span style="color: #339933">+</span><span style="color: #3366cc">'px" height="'</span><span style="color: #339933">+</span>img_thumb_height<span style="color: #339933">+</span><span style="color: #3366cc">'px"/></span>'</span><span style="color: #339933">;</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #003366">var</span> summ <span style="color: #339933">=</span> summary_noimg<span style="color: #339933">;</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #009900">}</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #000066">if</span><span style="color: #009900">(</span>img.<span style="color: #660066">length</span><span style="color: #339933">>=</span><span style="color: #cc0000">1</span><span style="color: #009900">)</span> <span style="color: #009900">{</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">imgtag <span style="color: #339933">=</span> <span style="color: #3366cc">'<span style="float:left; padding:0px 20px 5px 0px; margin:-50px 0 0 0 !important;"><img src="'</span><span style="color: #339933">+</span>img<span style="color: #009900">[</span><span style="color: #cc0000">0</span><span style="color: #009900">]</span>.<span style="color: #660066">src</span><span style="color: #339933">+</span><span style="color: #3366cc">'" width="'</span><span style="color: #339933">+</span>img_thumb_width<span style="color: #339933">+</span><span style="color: #3366cc">'px" height="'</span><span style="color: #339933">+</span>img_thumb_height<span style="color: #339933">+</span><span style="color: #3366cc">'px"/></span>'</span><span style="color: #339933">;</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">summ <span style="color: #339933">=</span> summary_img<span style="color: #339933">;</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #009900">}</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="font-weight: bold; color: #003366">var</span> summary <span style="color: #339933">=</span> imgtag <span style="color: #339933">+</span> <span style="color: #3366cc">'<div>'</span> <span style="color: #339933">+</span> removeHtmlTag<span style="color: #009900">(</span>div.<span style="color: #660066">innerHTML</span><span style="color: #339933">,</span>summ<span style="color: #009900">)</span> <span style="color: #339933">+</span> <span style="color: #3366cc">'</div>'</span><span style="color: #339933">;</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">div.<span style="color: #660066">innerHTML</span> <span style="color: #339933">=</span> summary<span style="color: #339933">;</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #009900">}</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> </div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> </div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #006600; font-style: italic">//]]></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"></</span>script<span style="color: #339933">></span></div></li></ol><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: left">Parsed in 0.019 seconds at 73.30 KB/s</div></pre>
<p> </p>
<p>( gunakan script read more otomatis di template <a href="http://gotemplatez.blogspot.com/2009/09/hybrid-news.html" target="_blank">Hybrid News</a>, jika script di atas tidak berfungsing )</p>
<p>kemudian ganti script Html ini</p>
<pre class="javascript" style="font-size: small; font-family: consolas," #ffffff;?="#ffffff;?" background-color:="background-color:" monospace;="monospace;" courier,="courier," New?,="New?," Courier="Courier"><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: center">Javascript, using GeSHi 1.0.8.8</div><ol><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"><</span>div <span style="font-weight: bold; color: #003366">class</span><span style="color: #339933">=</span><span style="color: #3366cc">'post-body entry-content'</span><span style="color: #339933">></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> <span style="color: #339933"><</span>data<span style="color: #339933">:</span>post.<span style="color: #660066">body</span><span style="color: #339933">/></span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> <span style="color: #339933"><</span>div style<span style="color: #339933">=</span><span style="color: #3366cc">'clear: both;'</span><span style="color: #339933">/></span> <span style="color: #339933"><!--</span> clear <span style="font-weight: bold; color: #000066">for</span> photos floats <span style="color: #339933">--></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> <span style="color: #339933"></</span>div<span style="color: #339933">></span></div></li></ol><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: left">Parsed in 0.005 seconds at 27.82 KB/s</div></pre>
<p></p>
<p> </p>
<p>dengan script berikut ini</p>
<pre class="javascript" style="font-size: small; font-family: consolas," #ffffff;?="#ffffff;?" background-color:="background-color:" monospace;="monospace;" courier,="courier," New?,="New?," Courier="Courier"><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: center">Javascript, using GeSHi 1.0.8.8</div><ol><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"><</span>div <span style="font-weight: bold; color: #003366">class</span><span style="color: #339933">=</span><span style="color: #3366cc">'post-body entry-content'</span><span style="color: #339933">></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> <span style="color: #339933"><</span>b<span style="color: #339933">:</span><span style="font-weight: bold; color: #000066">if</span> cond<span style="color: #339933">=</span><span style="color: #3366cc">'data:blog.pageType != &quot;item&quot;'</span><span style="color: #339933">></span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"><</span>div expr<span style="color: #339933">:</span>id<span style="color: #339933">=</span><span style="color: #3366cc">'&quot;summary&quot; + data:post.id'</span><span style="color: #339933">><</span>data<span style="color: #339933">:</span>post.<span style="color: #660066">body</span><span style="color: #339933">/></</span>div<span style="color: #339933">></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"><</span>script type<span style="color: #339933">=</span><span style="color: #3366cc">'text/javascript'</span><span style="color: #339933">></span>createSummaryAndThumb<span style="color: #009900">(</span><span style="color: #339933">&</span>quot<span style="color: #339933">;</span>summary<span style="color: #339933"><</span>data<span style="color: #339933">:</span>post.<span style="color: #660066">id</span><span style="color: #339933">/>&</span>quot<span style="color: #339933">;</span><span style="color: #009900">)</span><span style="color: #339933">;</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"></</span>script<span style="color: #339933">></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"></</span>b<span style="color: #339933">:</span>if<span style="color: #339933">></span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"><</span>b<span style="color: #339933">:</span><span style="font-weight: bold; color: #000066">if</span> cond<span style="color: #339933">=</span><span style="color: #3366cc">'data:blog.pageType == &quot;item&quot;'</span><span style="color: #339933">><</span>data<span style="color: #339933">:</span>post.<span style="color: #660066">body</span><span style="color: #339933">/></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #339933"></</span>b<span style="color: #339933">:</span>if<span style="color: #339933">></span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> <span style="color: #339933"><</span>div style<span style="color: #339933">=</span><span style="color: #3366cc">'clear: both;'</span><span style="color: #339933">/></span> <span style="color: #339933"><!--</span> clear <span style="font-weight: bold; color: #000066">for</span> photos floats <span style="color: #339933">--></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> <span style="color: #339933"></</span>div<span style="color: #339933">></span></div></li></ol><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: left">Parsed in 0.008 seconds at 52.12 KB/s</div></pre>
<p> </p>
<p><strong>Langkah Kedua :</strong></p>
<p>Tambahkan margin left untuk .post h3 + 140px ( merupakan syntax CSS untuk judul artikel - bisa saja untuk template lain adalah post h2 atau post h1 red )</p>
<pre class="css" style="font-size: small; font-family: consolas," #ffffff;?="#ffffff;?" background-color:="background-color:" monospace;="monospace;" courier,="courier," New?,="New?," Courier="Courier"><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: center">CSS, using GeSHi 1.0.8.8</div><ol><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #6666ff">.post</span> h3 <span style="color: #00aa00">{</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> <span style="font-weight: bold; color: #000000">margin</span><span style="color: #00aa00">:</span><span style="color: #933">.25em</span> <span style="color: #cc66cc">0</span> <span style="color: #cc66cc">0</span><span style="color: #00aa00">;</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> </div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">dst </div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> </div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #00aa00">}</span></div></li></ol><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: left">Parsed in 0.009 seconds at 4.81 KB/s</div></pre>
<p></p>
<p> </p>
<p>menjadi</p>
<pre class="css" style="font-size: small; font-family: consolas," #ffffff;?="#ffffff;?" background-color:="background-color:" monospace;="monospace;" courier,="courier," New?,="New?," Courier="Courier"><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: center">CSS, using GeSHi 1.0.8.8</div><ol><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #6666ff">.post</span> h3 <span style="color: #00aa00">{</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> <span style="font-weight: bold; color: #000000">margin</span><span style="color: #00aa00">:</span><span style="color: #933">.25em</span> <span style="color: #cc66cc">0</span> <span style="color: #cc66cc">0</span> <span style="color: #933">140px</span><span style="color: #00aa00">;</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> </div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">dst</div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> </div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #00aa00">}</span></div></li></ol><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: left">Parsed in 0.009 seconds at 5.35 KB/s</div></pre>
<p></p>
<p> </p>
<p><strong>Langkah Ketiga :</strong></p>
<p>Karena ini hanya pada halaman depan saja, untuk menormalkan kembali pada halaman postingan maka kita harus menambahkan script css ini. ( simpan di bawah javascript read more otomatis di atas red ).</p>
<pre class="css" style="font-size: small; font-family: consolas," #ffffff;?="#ffffff;?" background-color:="background-color:" monospace;="monospace;" courier,="courier," New?,="New?," Courier="Courier"><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: center">CSS, using GeSHi 1.0.8.8</div><ol><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><b<span style="color: #3333ff">:if </span>cond<span style="color: #00aa00">=</span><span style="color: #ff0000">'data:blog.pageType == &quot;item&quot;'</span><span style="color: #00aa00">></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><style<span style="color: #00aa00">></span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #6666ff">.post</span> h3 <span style="color: #00aa00">{</span> <span style="font-weight: bold; color: #000000">margin</span><span style="color: #00aa00">:</span><span style="color: #933">.25em</span> <span style="color: #cc66cc">0</span> <span style="color: #cc66cc">0</span> <span style="color: #cc66cc">0</span><span style="color: #00aa00">;</span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"> </div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px">dst</div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"><span style="color: #00aa00">}</span></div><li><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"></style<span style="color: #00aa00">></span></div><li style="background-color: #f4f4f4"><div style="padding-right: 0px; padding-left: 0px; background: none transparent scroll repeat 0% 0%; padding-bottom: 0px; margin: 0px; font: 1em/1.2em monospace; vertical-align: top; padding-top: 0px"></b<span style="color: #3333ff">:if</span><span style="color: #00aa00">></span></div></li></ol><div style="font-weight: bold; color: #ffffff; background-color: #4bacc6; text-align: left">Parsed in 0.009 seconds at 12.96 KB/s</div></pre>
<p> </p>
<p> </p>
<br /><b><i>Quote of the day: </i></b>
<br />Tuhan Yang Maha Mulia dan Maha Besar berfirman : “Barang siapa yang sibuk membaca Al Qur’an dan dzikir kepada Ku dengan tidak memohon kepada Ku, maka ia Aku beri sesuatu yang lebih utama dari pada apa yang Aku berikan kepada orang yang minta – hadist qudsi
Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com23tag:blogger.com,1999:blog-3657200694083844489.post-30633310887384238692010-08-07T21:06:00.001+07:002010-08-07T21:06:29.425+07:001031 donwloaded dan 2506 pageview<p><a href="http://lh5.ggpht.com/_dShEltFXlHs/TF1oV78EWZI/AAAAAAAAGAM/nowzBW5qjfw/s1600-h/jamu-r-mubarak_thumb%5B2%5D%5B4%5D.png"><img title="jamu-r-mubarak_thumb[2]" style="border-right: 0px; border-top: 0px; display: inline; margin: 0px 15px 0px 0px; border-left: 0px; border-bottom: 0px" height="240" alt="jamu-r-mubarak_thumb[2]" src="http://lh3.ggpht.com/_dShEltFXlHs/TF1oY27W_kI/AAAAAAAAGAQ/ROOSo3ifgxw/jamu-r-mubarak_thumb%5B2%5D_thumb%5B2%5D.png?imgmax=800" width="120" align="left" border="0" /></a> Terutama untuk font arabic Shifa, saya tidak menyangka sama sekali sejak di posting  “ <a href="http://catalog-tutorial.blogspot.com/2008/08/kaligrafi-islam-font-shape-brush-dan.html">kaligrafi islam, font, shape dan brush psd</a> “ pada tanggal 28 agst 2008, yang mengunduh mencapai 1031 orang dan untuk pageview 2506 visitor ( <a href="http://catalog-tutorial.blogspot.com/2009/10/pasang-script-pageview-this-post.html">pageview counter</a> terpasang pada tanggal 23 okt 2009 ).</p> <p>Secara khusus saya mengucapkan terima kasih untuk para pembuatnya .. kalau saya tahu situs-nya mungkin special akan saya buatkan link mereka.</p> <p>Oh iya.. dua atau tiga hari lagi bulan Ramadhan. Saya ucapkan selamat menjalankan ibadah shaum bagi yang melaksanakannya. semoga ibadah-nya dilaksanakan dengan semangat dan di terima oleh Nya.</p> <p><b><i>Quote of the day: </i></b> <br />Make the month of ramadan this year toward a new consciousness. - Boogle</p> <p> </p> <div class="wlWriterEditableSmartContent" id="scid:0767317B-992E-4b12-91E0-4F059A8CECA8:f3557ba3-8c36-4e97-a491-51666e06a060" style="padding-right: 0px; display: inline; padding-left: 0px; float: none; padding-bottom: 0px; margin: 0px; padding-top: 0px">Technorati Tags: <a href="http://technorati.com/tags/ramadhan" rel="tag">ramadhan</a>,<a href="http://technorati.com/tags/kaligrafi+islam" rel="tag">kaligrafi islam</a>,<a href="http://technorati.com/tags/font" rel="tag">font</a>,<a href="http://technorati.com/tags/shape" rel="tag">shape</a>,<a href="http://technorati.com/tags/brush+arabic" rel="tag">brush arabic</a></div> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com13tag:blogger.com,1999:blog-3657200694083844489.post-26954943214426382322010-08-05T21:26:00.001+07:002010-08-05T21:26:47.576+07:00meratakan img dengan post-body<p>Sehubungan ada pertanyaan sobat saya tentang “ <strong>meratakan img dengan post-body</strong> “, seperti yang saya lakukan pada antar muka <a href="http://jaloee.blogspot.com/search/label/Bloon?max-results=7" target="_blank">blog jaloee</a>.</p> <p><a href="http://jaloee.blogspot.com/search/label/Bloon?max-results=7"><img title="meratakan" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="110" alt="meratakan" src="http://lh6.ggpht.com/_dShEltFXlHs/TFrKJYy-t9I/AAAAAAAAGAI/i5B4e5AoGow/meratakan%5B6%5D.png?imgmax=800" width="400" border="0" /></a> </p> <p><strong><em>Pertanyaanya seperti ini:</em></strong></p> <p>Kang, gimana tips meratakan gammbar ama post-body? Kae thumbnail di <a href="http://jaloee.blogspot.com/search/label/Bloon?max-results=7">blog ni</a> (layout standar blogcepot kan judul post selalu diatas). Tks</p> <p>Karena sobat saya ini sudah sangat lihai membuat template, jadi dari pada di terangkan lebih baik saya sarankan untuk mendowload template “ Hybrid News “ di koleksi template <a href="http://gotemplatez.blogspot.com/2009/09/hybrid-news.html" target="_blank">Go Templatez</a>.</p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com13tag:blogger.com,1999:blog-3657200694083844489.post-18821298684558206272010-08-03T01:53:00.001+07:002010-08-03T01:53:42.550+07:00Bagaimana Pasang Intro Profile Pada Halaman Depan<p>Trik ini caranya hampir sama dengan tulisan “ <a title="intro flash" href="http://catalog-tutorial.blogspot.com/2009/09/pasang-animasi-intro-flash-di-blogger.html">Pasang Intro Flash Di Blogspot</a> “, yang membedakan hanya objek yang di gunakan. Jika sebelumnya menggunakan Flash file, namun sekarang menggunakan sebuah gambar ( img.file ). Hasilnya menurut saya sama keren. </p> <p>Untuk variasi selain photo dan profile, bisa kita tambahkan pula link label/categorie blog, atau di sisipi script adsense camp, apalagi jika anda lagi ikutan kontes seo bisa anda tambahkan link url halaman yang anda konteskan.  Apakah seo friendly ? wah jangan tanya gie dah.</p> <p><a title="belajar photoshop" href="http://jaloee.blogspot.com/">DEMO BLOG</a></p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com12tag:blogger.com,1999:blog-3657200694083844489.post-72436840734865136442010-07-27T20:22:00.001+07:002010-07-27T20:22:53.749+07:00Tidak Update Bukan Berarti Pakum Dari …<strong><i>Quote of the day: </i></b> <br /></strong>In all large corporations, there is a pervasive fear that someone, somewhere is having fun with a computer on company time. Networks help alleviate that fear. - <em>John C. Dvorak</em> <p> <br />Walaupun lama tidak di update, bukan berarti pakum dalam blogspere. malahan ketika jeda selama ini, setidaknya ada dua leot yang telah selesai saya kerjakan. yang pertama bertemakan <strong>toko online ala blogcepot</strong> dan yang kedua masih seputar <strike><strong>magazine versi blogcepot</strong></strike>. Dan selebihnya bila ada waktu sengang saya gunakan untuk cit cat atau nyetatus ( istilah mba ebong. red ) di fb. atau sekedar <u><strong>refresh otak</strong></u> suka iseng ikut ikut-an debat kusir di forum.</p> <p>Begitu juga untuk perkembangan update dari blogger selalu saya ikuti, malahan dua hari kemarin ada email terkirim dari kantor redaksi blogger yang memberitahukan  tentang hal hal yang baru. Yang menarik datang dari redaksi <a href="draf"><strong>in draf</strong></a>, yaitu dengan adanya <u><strong>blogger stastik</strong></u>, itu sudah lebih dari cukup untuk mengetahui kemajuan blog kita. </p> <p>Sedangkan untuk perkembangkan template baru ( <strong>template designer</strong> ), saya perhatikan sekarang ini sudah di paksakan menjadi pilihan default ( pokok )  bagi yang baru membuat blog atau bagi anda yang ingin menambah lagi blognya. Artinya jika saudara cermati,  template designer ini akan menjadi lahan baru yang harus segera saudara pelajari jika anda ingin menjadi <strong>New Icon Tutorialis Blogger </strong>atau blogger yang selalu tampil di garda depan ( ceahhh… cuh..cuh.. cuh.. ).</p> <p>Namun dari hal yang baru di atas tersebut, tetap saja dari dulu saya masih mendambakan adanya aplikasi <strong>text editor</strong> pada <strong>dekstop windows</strong> yang di buat oleh pihak blogger sendiri, dengan fitur-fitur ( plugin ) yang lengkap seperti halnya text editor<strong> </strong><a href="http://cut.ms/Yja"><strong>live writer</strong></a> yang selama ini saya gunakan. Tentu saja jika pihak blogger membuat sendiri text editor tersebut, saya pikir akan lebih memahami ( terintegrasi ) dari pada mengunakan pengolah kata pihak ketiga seperti live writer misalnya. ( lagi pula saya paling malas jika mau update mesti login dulu… cape deh ).</p> <p>Jadi kang blogger kapan neh ????</p> <p></p> <div class="wlWriterSmartContent" id="scid:0767317B-992E-4b12-91E0-4F059A8CECA8:7b369ffe-e9fb-4efb-a421-d8cd34f87064" style="padding-right: 0px; display: inline; padding-left: 0px; float: none; padding-bottom: 0px; margin: 0px; padding-top: 0px">Technorati Tags: <a href="http://cut.ms/Yjb" rel="tag">New Blogger</a>,<a href="http://cut.ms/Yjc" rel="tag">Template Designer</a>,<a href="http://cut.ms/Yjd" rel="tag">Text Editor</a>,<a href="http://cut.ms/Yje" rel="tag">Live Writer</a></div> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com12tag:blogger.com,1999:blog-3657200694083844489.post-28330629609248152992010-05-04T14:42:00.001+07:002010-05-04T15:37:44.560+07:00Membuat widget or gadget berbeda-beda tampilan<p>Otrelah boogle_lover kali ini saya akan menulis trik bagaimana caranya membuat widget/gadget berbeda-beda tampilan untuk background, warna tulisan , border dan lain-lain. trik ini di khususkan terutama bagi yang suka berexperimen dan pingin beda. </p> <p>Untuk melihat hasilnya bisa boogle_lover  lihat di blog <a href="http://www.jaloee.blogspot.com/" target="_blank">bloon_online</a> ini.</p> <blockquote> <p><strong><font color="#ff0000">perhatin</font></strong></p> <p><strong><font color="#ff0000">Saya menggunakan trik ini pada minima standar , jadi mungkin untuk template yang lain bisa saja kasus-nya berbeda-beda.</font></strong></p> </blockquote> <h3>Pemahan Dasar</h3> <p>1. Ini sering saya jelaskan. Setiap kita menambah gadget baik Html/Javascript, Text, Linklist dan lain-lain, Blogspot menambahkan Id yang sangat khusus berupa angka / penomeran di ujung nama gadgetnya . untuk widget/gadget Html misalnya HTML<strong><font color="#ff0000">1</font></strong>, dan jika kita menambah widget HTML lagi maka yang kita dapati menjadi HTML<font color="#ff0000"><strong>2</strong></font>, HTML<font color="#ff0000"><strong>3</strong></font>, HTML<font color="#ff0000"><strong>4</strong></font>. begitu juga untuk widget yang lain-nya.</p> <p>2. Untuk mengetahui nama dan id sebuah widget/gadget secara mudah boogle_lover dapat mengenalinya melalui halaman depan ketika posisi kita login. buka/tekan gambar berbentuk <strong>obeng&kunci</strong> ( atau bisa juga pada <strong>halaman page elements</strong> tekan <strong>Edit </strong>pada gadgetnya ). setelah jendela gadget terbuka periksa pada bagian frame atas. seperti yang di tunjukan gambar di bawah ini. </p> <p> </p> <p><a href="http://lh5.ggpht.com/_dShEltFXlHs/S9_PgQGcHII/AAAAAAAAFrM/vbStYRBzTJA/s1600-h/gadget5.png"><img title="gadget" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="265" alt="gadget" src="http://lh5.ggpht.com/_dShEltFXlHs/S9_PkdKAJeI/AAAAAAAAFrQ/A5vef1257ug/gadget_thumb3.png?imgmax=800" width="500" border="0" /></a> </p> <p>3. Pemahaman dasar selanjutnya menggenal bagian-bagian script html gadget secara garis besar. ( yang nantinya dapat boogle_friends mangfaatkan untuk mengatur latar belakang berupa gambar/color, warna tulisan , border/binkai dan lain-lain. red ) </p> <p> </p> <p><a href="http://lh5.ggpht.com/_dShEltFXlHs/S9_PnySe27I/AAAAAAAAFrU/OBjq8Sh1cN0/s1600-h/widget34.png"><img title="" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="231" alt="" src="http://lh5.ggpht.com/_dShEltFXlHs/S9_PrJdlAyI/AAAAAAAAFrY/x1DSIG3YGSQ/widget3_thumb2.png?imgmax=800" width="585" border="0" /></a> </p> <p>a. <strong>id = Text1</strong> merupakan gadget itu sendiri</p> <p>b.<strong> h2</strong> merupakan title/judul gadget</p> <p>c.<strong> widget-content</strong> merupakan konten / isi gadget</p> <p> </p> <p>Jika di ilustrasikan hasilnya akan seperti ini.</p> <p><a href="http://lh5.ggpht.com/_dShEltFXlHs/S9_PuQ60MfI/AAAAAAAAFrc/ZOzIZm4Kiac/s1600-h/widget44.png"><img title="widget4" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="241" alt="widget4" src="http://lh3.ggpht.com/_dShEltFXlHs/S9_Py6FkRrI/AAAAAAAAFrg/AmPK1de-n1s/widget4_thumb2.png?imgmax=800" width="309" border="0" /></a> </p> <p> </p> <p>4. Pemahan dasar yang terakhir ialah dalam penulisan css nya hurup-nya harus benar dan sesuai. contoh Text1 = penulisan yang benar - text1 = penulisan yang salah. HTML1 = benar – Html1 = salah.</p> <p>Otre deh boogle_friends ternyata pegel juga nulis-nya hehe.. </p> <p>Setelah memahami tulisan di atas yang kita lakukan menambah kode Css –nya ke dalam blog ( biasanya saya menyimpan sebelum tulisan ini   <strong>]]></b:skin> . </strong>red ). </p> <p>Oh iya jangan lupa karena ini merupan sebuah <strong>selektor id </strong>, maka menurut buku mang omo harus di awali dengan tanda pagar [ # ] . jadi contohnya seperti ini. </p> <p> </p> <p>sebelum tulisan ini</p> <p><strong>]]></b:skin> </strong></p> <p>masukan kode css di bawah ini </p> <p>a. </p> <blockquote> <p>#Text1 {background:#d3c6ac;padding:3px;}</p> </blockquote> <p>b.</p> <blockquote> <p>#Text1 h2 {background:#8bed99}</p> </blockquote> <p>c.</p> <blockquote> <p>#Text1 .widget-content {background:#99bde1;}</p> </blockquote> <p> </p> <p>Untuk gadget Html</p> <blockquote> <p>#HTML1 {background:#d3c6ac;padding:3px;} <br />#HTML1 h2 {background:#8bed99} <br />#HTML1 .widget-content {background:#99bde1;}</p> </blockquote> <p> </p> <p>thankiyu untuk komentarnya :)</p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com53tag:blogger.com,1999:blog-3657200694083844489.post-46728321705966698962010-02-28T11:55:00.001+07:002010-02-28T11:55:17.432+07:00Zoom Magazine Template<p>Trend magazine untuk flatfrom blogcepot saat ini sudah menjadi lumrah kita lihat, bahkan beberapa template marker yang saya temukan telah merancang jenis template ini dengan ide-ide kreatif dan inovatif. Tentu saja perkembangan ini sangat mengembirakan terutama bagi saya yang setia menggunakan blogspot sebagai corong untuk mengekpresikan diri. dengan adanya ragam ala magazine ini, kita bisa memilih rancangan yang sesuai dengan kontent yang ingin kita isi.</p> <p>Seperti tema magazine rancangan teman saya <a href="http://www.herdiansyah.org/" target="_blank">Herdiansyah Hamzah</a> yang di beri nama Zoom Template di bawah ini.</p> <p> <a href="http://lh6.ggpht.com/_dShEltFXlHs/S4n3G_Rd6wI/AAAAAAAAFqM/H7y1ctioST4/s1600-h/zoom%20template%5B23%5D.png"><img title="zoom template" style="border-right: 0px; border-top: 0px; display: inline; border-left: 0px; border-bottom: 0px" height="257" alt="zoom template" src="http://lh4.ggpht.com/_dShEltFXlHs/S4n3M4gfJsI/AAAAAAAAFqQ/8IUQXh6NAIw/zoom%20template_thumb%5B21%5D.png?imgmax=800" width="350" border="0" /></a> </p> <p>View Demo : <a href="http://zoom-magazine.blogspot.com/" target="_blank">Zoom Template</a> View Download : <a href="http://gotemplatez.blogspot.com/" target="_blank">GoTemplatez</a></p> <p>Dengan kesetiannya untuk mengusung rancangan minimalis, memang magazine ini masuk dalam jajaran minimalis. Dan yang sangat saya sukai penataan kolom-nya  di atur sangat rapi. Begitu juga tab menu di beri aksen drop down yang easy loding sangat cocok untuk di terapkan pada standar magazine template, dan tab menu di bawah-nya mengatur (menuju)  pada media atau jejaring sosial yang kita punya, sedangkan untuk slide photo tentu saja sebagai aksesories untuk mempercantik tampilan blog.</p> <p>Template ini free untuk kita gunakan, dan menurut pengakuan pembuatnya karena sudah janji kepada saya untuk membuat template untuk di share pada blog Go Templatez.</p> <p>Oke deh.. buat Mas Herdiansyah thank atas template-nya and terus berkarya dengan ide-ide lain-nya.      </p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com50tag:blogger.com,1999:blog-3657200694083844489.post-20339661213443434652010-02-21T10:00:00.001+07:002010-02-21T10:00:56.624+07:00Intermezzo : Gara-Gara Cersil<blockquote> <p><strong><img style="display: inline; margin-left: 0px; margin-right: 0px" src="http://www.abcb.com/kenshin/ken_0000.jpg" align="right" /> Terdengar suara pedang membelah angin, cepat dan keras. Cawan arak di meja hancur berantakan oleh angin pedang itu. Arak tumpah membasahi lantai. Walaupun gerakan pedangnya makin lama makin cepat, Li Sun Hoan tidak tampak bergerak. Seolah-olah tak ada yang terjadi. Semua serangannya mengenai tempat kosong.</strong></p> </blockquote> <p>Demikianlah adanya, karena sejak dulu kala sudah gemar membaca serial cerita silat kho ping hoo, maka begitu saya menemukan gudang ebook cersil ini tak tahan lagi untuk membacanya sampai berhari-hari bahkan berminggu minggu. Serial bu kek siansu ( suling emas ), pedang kayu harum dll.</p> <p>Bukan hanya yang di tulis oleh kho ping ho saja yang saya temukan , bahkan saya menemukan cersil yang di tulis oleh pengarang lain seperti karya Gu long - pendekar budiman ( maling romantis ), pendekar empat alis dst , karya ching yung dan lai-lain-nya. Dengan alur cerita dan gaya tulisan yang berbeda sekali dengan kho ping kho.</p> <p>Maka mohon maaf kepada semua teman teman yang telah berkunjung ke blog ini, dan bahkan dengan rela hati untuk meninggalkan komentar tidak mendapatkan feedback atau balasan yang sepatutnya dari saya.</p> <p>Ternyata kecanduan membaca cerita silat mengalahkan kecanduan saya untuk membuka blog ini dan mengupdatenya. </p> <p>Mohon maaf pisan euy !</p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com17tag:blogger.com,1999:blog-3657200694083844489.post-53546774172715725622009-12-12T21:59:00.001+07:002009-12-12T21:59:38.620+07:00Site Performance from google webmaster tool<p>Keinginan om google untuk menambahkan kecepatan loding situs ke dalam update pagarank-nya – seperti dalam tulisan ini “ <a title="page speedy" href="http://catalog-tutorial.blogspot.com/2009/11/optimasi-speed-blog-untuk-peringkat-di.html" rel="tag">optimasi speed blog dan pagerank</a>”, kini terjawab sudah. Setidaknya ini berdasarkan apa yang ane lihat di bawah <strong>label lab google webmastertool</strong> kini ada penambahan halaman yang di namakan “ <strong>Site</strong> <strong>Performance</strong> “, sebuah page informasi untuk menilai kinerja keselurahan situs atau halaman situs dari segi kecepatan loding time. Kemudian di bawahnya webmaster tool menyarankan terutama untuk pengguna firefox agar menginstall <strong>Page Speed ,</strong> addons yang berfungsi untuk meringankan loding time sebuah situs.</p> <p><a href="http://lh6.ggpht.com/_dShEltFXlHs/SyOvzIs2diI/AAAAAAAAFd4/VMHCuhEDyXo/s1600-h/site%20performance%5B4%5D.png"><img title="site performance" style="border-right: 0px; border-top: 0px; display: inline; border-left: 0px; border-bottom: 0px" height="175" alt="site performance" src="http://lh5.ggpht.com/_dShEltFXlHs/SyOv2eAgVvI/AAAAAAAAFd8/btBRoukh7KI/site%20performance_thumb%5B2%5D.png?imgmax=800" width="640" border="0" /></a> </p> <p>Tujuan-nya sebagai juragan dalam pemain di dunia maya, google nampaknya berkeingginan agar setiap situs layaknya seperti membuka lembaran koran atau majalah tak perlu benggong tak perlu nunggu tak perlu jengkel. Tujuan yang sangat adi luhung ini tentu saja saya sebagai user sangat mendukung sekali.Dengan begitu kita dapat mendapatkan dan menggali informasi tidak perlu ubanan menunggu terlalu lama. Walaupun tentu saja keinginan ini sulit untuk di raih karena berbagai kendala seperti pengunaan gambar dan flash terutama untuk yang lebih mementingkan nilai seni ke dalam layout-nya atau tutorial-tutorial yang hanya bisa di jelaskan dengan bantuan sebuah ilustrasi gambar. Begitu juga dari sisi server atau penggunaan javascript walaupun kini muncul json dll.</p> <p>Maka mungkin karena dilema dan kendala di atas tersebut, pengaruh speed loding untuk pagerank bobotnya tidak melebihi link popularity.</p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com58tag:blogger.com,1999:blog-3657200694083844489.post-40673806874795630732009-11-29T21:40:00.001+07:002009-11-29T21:40:21.243+07:00Free Banner Psd<p>Banner iklan ini saya buat ketika merenovasi blog sebelah. Desainnya sendiri terinspirasi atau ngaku saja boogle nyontek dari banner iklan yang di buat oleh para profesional grafis yang telah tersedia di berbagai situs. Namun ada beberapa desain saat pengerjaan-nya boogle modifikasi atau kembangkan sesuai dengan kebutuhan. Ukuran banner-nya 200 x 125 px. – ukurannya bisa ente edit menggunakan tag css, atau lebih baik di edit via program shotoshop.</p> <p><a title="Banner Iklan.Psd" href="http://www.box.net/shared/2c73c25u4s" target="_blank"><img title="free banner" style="border-right: 0px; border-top: 0px; display: inline; border-left: 0px; border-bottom: 0px" height="388" alt="free banner" src="http://lh3.ggpht.com/_dShEltFXlHs/SxKH0wx5GDI/AAAAAAAAFb8/HMhDBJ-NmyI/free%20banner%5B5%5D.png?imgmax=800" width="444" border="0" /></a>  </p> <p>via free banner iklan : <a title="Banner Iklan.psd" href="http://www.box.net/shared/2c73c25u4s" target="_blank" rel="nofollow">download pub_banner.psd</a>.</p> <p>Banner berupa file PSD ini boogle khusus-kan terutama bagi yang baru paham program photoshop sekitar 10%, karena kalau yang sudah mengerti di atas 20% atau yang sudah hampir khotam photoshop pastinya bikin banner sendiri kale.</p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com43tag:blogger.com,1999:blog-3657200694083844489.post-56627478679659425952009-11-18T23:07:00.001+07:002009-11-20T18:31:53.061+07:00Optimasi Speed Blog Untuk Peringkat di Google<p>Sudah bukan rahasiah lagi, jika <strong>kecepatan loding blog</strong> merupakan salah satu kunci untuk mengundang dan kenyamanan bagi pengunjung. semakin cepat di akses akan semakin memudahkan pengunjung untuk terus menikmati isi blog.</p> <p>Namun kemarin ini, gosip-nya kecepatan loding halaman situs akan di masukan juga menjadi salah satu acuan faktor peringkat dari kurang lebih 200 peringkat faktor-faktor algoritma sistem Om google. Dan masih menurut gosip juga, acuan ini akan di berlakukan pada tahun 2010 nanti. jika di hitung dari hari ini, mungkin sekitar dua bulan lagi.</p> <p>Oleh karena itu, keputusan yang bijaksana terutama bagi teman-teman yang lebih fokus dan mengkhususkan blog-nya dalam peringkat di indek google agar mulai berbenah memperbaiki seluruh komponen blog, seperti : gambar, stylesheet, script atau flash. dan mempertimbangkan pengaya ( pernak-pernik ), mana yang bermangfaat dan mana yang hanya sekedar gaya saja ?. mana yang perlu di pertahankan dan apa saja yang perlu di hilangkan.</p> <p>Dan saran boogle untuk <strong>optimasi speed blog</strong> jangan lupa gunakan <a title="Page Speed Test" href="http://developer.yahoo.com/yslow/" target="_blank" rel="enclosure">Yslow performance</a> - addons firefox dari Yahoo atau <a title="Page Speed Test" href="http://code.google.com/speed/page-speed/" target="_blank" rel="enclosure">Page speed</a> – addons firefox dari Google. karena selain untuk menganalisa seberapa cepat waktu tunggu sebuah situs, keduanya merupakan tool yang sangat bagus untuk optimasi speed web/blog. </p> <p>….</p> <p>Heheheh.. yup ah boogle juga lagi berbenah neh :D</p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com80tag:blogger.com,1999:blog-3657200694083844489.post-31129763340487827692009-11-14T20:21:00.001+07:002009-11-14T20:28:45.457+07:00Display Time Script<p>Yup ! lanjut pada pertayaan seorang kawan tengtang real time atau <strong>display time script</strong> yang ada pada <a title="free template" href="http://catalog-tutorial.blogspot.com/2009/09/free-google-template-for-blogger.html" rel="tag">template boogle</a> ini.</p> <blockquote> <p><strong>mau nanya kalo bikin update DATE template boogle itu yg pake english piye carane?,,ga lucu kan kalo yg lain inggrisan smua masa tglnya sabtu 31 oktober,,hhehee</strong></p> </blockquote> <p>Kalau belum jelas mungkin pertanyaan di atas seperti screenshot berikut ini.</p> <p><a href="http://lh4.ggpht.com/_dShEltFXlHs/Sv6uikrXpgI/AAAAAAAAFaQ/JMh96KSncPA/s1600-h/real%20time%20script%5B5%5D.png"><img title="real time script" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="48" alt="real time script" src="http://lh4.ggpht.com/_dShEltFXlHs/Sv6unitbR_I/AAAAAAAAFaU/3bv8-e_anGY/real%20time%20script_thumb%5B3%5D.png?imgmax=800" width="215" border="0" /></a> </p> <p>Ingin di ganti menjadi berikut ini.</p> <p><a href="http://lh5.ggpht.com/_dShEltFXlHs/Sv6usVmFcUI/AAAAAAAAFaY/7bkTqDA3DT4/s1600-h/display%20time%5B3%5D.png"><img title="display time" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="45" alt="display time" src="http://lh6.ggpht.com/_dShEltFXlHs/Sv6uxloFdZI/AAAAAAAAFac/tc_2MXwl9qU/display%20time_thumb%5B1%5D.png?imgmax=800" width="215" border="0" /></a> </p> <p>Untuk mengganti display time dari indonesia ke inggris, ganti saja javascript yang ada pada <a title="free template" href="http://catalog-tutorial.blogspot.com/2009/09/free-google-template-for-blogger.html" rel="nofollow">free template boogle</a> yakni;</p> <pre><script src='http://rizqi.moehamed.googlepages.com/tampil_tanggal-min.js' <br />type='text/javascript'></script></pre>
<p>Dengan javascript yang telah saya edit berikut ini</p>
<pre><script src='http://santi23.fileave.com/datatime.js' type='text/javascript'></script></pre>
<h3><a name="display time">Display Time Script Non Boogle Template</a></h3>
<p>Sedangkan bagi yang non boogle template, untuk menambah display time ke dalam blognya ikutilah langkah-langkah berikut ini.</p>
<p><strong>Pertama</strong>:</p>
<p>Simpan display time script ini</p>
<p>note : untuk format indonesia</p>
<pre><script src='http://rizqi.moehamed.googlepages.com/tampil_tanggal-min.js' <br />type='text/javascript'></script></pre>
<p>note : untuk format inggris</p>
<pre><script src='http://santi23.fileave.com/datatime.js' type='text/javascript'></script></pre>
<p>Sebelum tag berikut ini.</p>
<blockquote>
<pre><head/></pre>
</blockquote>
<p>Setelah itu <strong>Simpan Template</strong> ( <strong>save template</strong> )</p>
<p><strong>Kedua</strong> :</p>
<p>Buka dan pilih tab >> <strong>Page Elements</strong> >> <strong>Add a Gadget</strong> >> <strong>Html/Javascript</strong></p>
<p>Kemudian simpan script berikut ini.</p>
<blockquote>
<p><strong><script>tampiltanggal();</script></strong></p>
</blockquote>
<p> </p>
<p><img src="http://lh6.ggpht.com/_dShEltFXlHs/Ss9XvUIVfLI/AAAAAAAAFYA/DePy-vUrP8U/fun-and-happy_thumb[5].gif?imgmax=800" /></p> Jaloeehttp://www.blogger.com/profile/06322035097256660173noreply@blogger.com19