Teknik Black Hat SEO

Teknik Black Hat SEO | Black hat seo adalah cara curang / kotor dalam melakukan teknik optimasi untuk mendapatkan rangking terbaik di search engine. Teknik seperti ini memang terbukti berhasil membawa sebuah halaman blog bisa tampil pada halaman depan google namun hanya bertahan singkat, setelah itu halaman tersebut akan hilang atau bahkanblog, situs ataupun web tersebut akan dibanned sama mbah google.

Cara mencek apakah situs kita dibanned atau tidak sama google adalah dengan mengetikkan site:namasitus.com di kolom pencarian google. Jika gak ada hasil yang muncul padahal sebelumnya ada maka jelas sudah blog situs ataupun web tersebut kena banned oleh google.

Teknik Black Hat SEO yang saya tahu ada 5 jenis yaitu :

1. Teknik Black Hat SEO Link Farming.
Teknik Black Hat SEO Link Farming adalah sebuah teknik mengumpulkan link di satu halaman blog maupun situs. Maksudnya di satu halaman cuma berisi daftar link yang jumlahnya sangat banyak bisa sampai ratusan atau bahkan ribuan link.

2. Teknik Black Hat SEO keyword Stuffing.
Teknik Black Hat SEO keyword stuffing adalah penerapan keyword yang berkelebihan atau menembak keyword secara membabi buta, dimana sebuah halaman web yang berisi sebuah kata yang berulang - ulang atau tidak wajar.

3. Teknik Black Hat SEO Cloaking Page doorway page.
Untuk teknik Black Hat SEO cloaking page atau doorway page adalah cara dimana mencari jalan untuk membuat sebuah halaman web agar terus dilihat atau terus dikunjungi. Teknik seperti ini bisa dilakukan di blog bersangkutan ataupun di blog lain dengan cara menyisipkan sebuah kode bisa javascript dan bisa php yang gunanya adalah pemanggilan untuk sebuah halaman yang ingin dioptimasi. Cara simpelnya adalah mengunakan pop up, yaitu sebuah teknik membuka halaman web yang tidak ingin kita kunjungi terbuka di jendela baru, Jadi mau tidak mau halaman tersebut tetap terbuka web lain. Cara lain dari door way page ini adalah membuat kode refresh atau redirect ke halaman web tertentu yang ingin di redirect. Tentunya halaman yang punya trafik bagus misalnya traffiknya ribuan maka otomatis pengunjung yang ribuan diredirect ke halaman web yang akan dioptimasi. Cara lainnya dari doorway page ini adalah memanfaatkan url redirect dari hasil pencarian google.

4. Teknik Black Hat SEO Invisible Text (Teks Tidak Terlihat).
Untuk Teknik Black Hat SEO Invisible Text (Teks Tidak Terlihat) adalah suatu teknik menyembunyikan kata sebuah keyword di dalam blog yang kata tersebut tidak akan tampak secara kasat mata. Caranya dengan menyamakan warna tulisan kata tersebut dengan latar belakang atau background template. misal kalau template kita hitam maka buat warna text kata tersebut berwarna hitam. Tulisan yang tidak nampak tersebut dengan mata telanjang bisa dilihat dengan cara memblock semua halaman dengan cara select + all gunanya untuk menghighlights atau menandai seluruh tulisan. Cara yang membutuhkan waktu lama adalah dengan memperhatikan page source halaman web bersangkutan. Cara ekstrem untuk melakukan teks yang tak terlihat ini namun dapat terlihat oleh robot adalah dengan menerapkan kode berikut ke template : <!--keyword-->

5. Teknik Black Hat SEO Iteration title.
Untuk Teknik Black Hat SEO Iteration title adalah teknik perulangan judul, maksudnya isi postingannya cuma pengulangan dari judul. Caranya mudah saja, buat postingan misal judulnya teknik seo lalu isinya cuma pengulangan dari judul tersebut yaitu teknik seo, gak usah ditambah tulisan yang lain lagi, itu saja sudah cukup. Biasanya teknik seperti ini berlaku untuk keyword baru yang ada di google atau baru muncul di google. | Teknik Black Hat SEO

Sumber :

http://wadahtutorial.blogspot.com/2011/12/black-hat-seo.html

google.co.id

readmore »»  

Cara Memasang Headline News Diatas Header Blog

Cara Memasang Headline News Diatas Header Blog | M4 ZONE - Whats Up Chief..! Tutorial blog ini merupakan lanjutan dari Membuat Menu Bar Dua Rangkap Di Blogspot, dan tahukah anda jika kedua tutorial ini di praktekan dalam blog anda maka akan sangat cocok, tutorial ini saya share dan kode yang digunakan bersumber dari template blog M4 ZONE sendiri, hanya saja dibedakan oleh warna. Langsung saja ke langkah-langkah berikut ini:

Agar tidak terjadi hal-hal yang tidak diinginkan backup lah terlebih dahulu templatenya

1. Seperti biasa Anda harus login terlebih dahulu ke account blogger.
2. Kemudian pilih Template > Edit HTML > Centang tulisan Expand Template Widget.
3. Berikutnya Carilah Kode ]]></b:skin> (gunakan pencarian cepat dengan cara menekan tombol kombinsai CTRL+F) lalu tempelkan kode dibawah ini tepat diatas kode ]]></b:skin>

.headline-wrapper{background:#319DCF repeat-x bottom;width:100%;height:30px;}
.headline{width:980px;line-height:1.4em;text-align:left;font-family:Arial;font-size:12px;color:#fff;overflow:hidden;clear:both;margin:0 auto;padding:0 auto}
.headline a:hover{color:#eace12;text-decoration:underline}

4. Selanjutnya cari kode <body> lalu pastekan kode dibawah ini tepat dibawah kode <body>

<div class='headline-wrapper'>
<div class='headline'>
<div style='float:left;padding:7px 5px 5px 10px;font:bold 12px Arial;color:#fff;text-transform:none;'>
Headlines News :
</div>
<div style='float:left;width:800px;padding:7px 0; position:relative; overflow:hidden;'>
<script type='text/javascript'>
var cssfeed=new gfeedrssticker(&quot;example1&quot;, &quot;example1class&quot;, 3000, &quot;_new&quot;)
cssfeed.addFeed(&quot;Headline News&quot;, &quot;http://ilergokil.blogspot.com/feeds/posts/default&quot;)
cssfeed.displayoptions(&quot;date&quot;)
cssfeed.setentrycontainer(&quot;div&quot;)
cssfeed.filterfeed(10, &quot;date&quot;)
cssfeed.entries_per_page(1)
cssfeed.init()
</script>
</div>
</div><div style='clear:both;'/>
</div>

5. Setelah itu anda cari kode </head> lalu pastekan kode dibawah ini tepat diatas kode </head>

<script src='http://www.google.com/jsapi?key=ABQIAAAAUMsU2d40bO1-m8DeADFRexTdcQS31_Y0TkToW9tE1XWPEnv6YBSa1QfZaAr4GJ8-AZkWddpnW9Y0hA'/>
<script type='text/javascript'>
//<![CDATA[
var gfeedfetcher_loading_image="indicator.gif";google.load("feeds","1");function gfeedfetcher(c,a,b){this.linktarget=b||"";this.feedlabels=[];this.feedurls=[];this.feeds=[];this.feedsfetched=0;this.feedlimit=5;this.showoptions="";this.sortstring="date";document.write('<div id="'+c+'" class="'+a+'"></div>');this.feedcontainer=document.getElementById(c);this.itemcontainer="<li>"}gfeedfetcher.prototype.addFeed=function(b,a){this.feedlabels[this.feedlabels.length]=b;this.feedurls[this.feedurls.length]=a};gfeedfetcher.prototype.filterfeed=function(b,a){this.feedlimit=b;if(typeof a!="undefined"){this.sortstring=a}};gfeedfetcher.prototype.displayoptions=function(a){this.showoptions=a};gfeedfetcher.prototype.setentrycontainer=function(a){this.itemcontainer="<"+a.toLowerCase()+">"};gfeedfetcher.prototype.init=function(){this.feedsfetched=0;this.feeds=[];this.feedcontainer.innerHTML='Loading news...';var a=this;for(var b=0;b<this.feedurls.length;b++){var c=new google.feeds.Feed(this.feedurls[b]);var d=(this.feedlimit<=this.feedurls.length)?1:Math.floor(this.feedlimit/this.feedurls.length);if(this.feedlimit%this.feedurls.length>0&&this.feedlimit>this.feedurls.length&&b==this.feedurls.length-1){d+=(this.feedlimit%this.feedurls.length)}c.setNumEntries(d);c.load(function(e){return function(f){a._fetch_data_as_array(f,e)}}(this.feedlabels[b]))}};gfeedfetcher._formatdate=function(a,c){var d=new Date(a);var b=(c.indexOf("datetime")!=-1)?d.toLocaleString():(c.indexOf("date")!=-1)?d.toLocaleDateString():(c.indexOf("time")!=-1)?d.toLocaleTimeString():"";return"<span class='datefield'>"+b+"</span>"};gfeedfetcher._sortarray=function(a,b){var b=(b=="label")?"ddlabel":b;if(b=="title"||b=="ddlabel"){a.sort(function(e,d){var g=e[b].toLowerCase();var f=d[b].toLowerCase();return(g<f)?-1:(g>f)?1:0})}else{try{a.sort(function(e,d){return new Date(d.publishedDate)-new Date(e.publishedDate)})}catch(c){}}};gfeedfetcher.prototype._fetch_data_as_array=function(b,a){var d=(!b.error)?b.feed.entries:"";if(d==""){alert("Google Feed API Error: "+b.error.message)}for(var c=0;c<d.length;c++){b.feed.entries[c].ddlabel=a}this.feeds=this.feeds.concat(d);this._signaldownloadcomplete()};gfeedfetcher.prototype._signaldownloadcomplete=function(){this.feedsfetched+=1;if(this.feedsfetched==this.feedurls.length){this._displayresult(this.feeds)}};gfeedfetcher.prototype._displayresult=function(a){var e=(this.itemcontainer=="<li>")?"<ul>\n":"";gfeedfetcher._sortarray(a,this.sortstring);for(var c=0;c<a.length;c++){var d='<a href="'+a[c].link+'" target="'+this.linktarget+'" class="titlefield">'+a[c].title+"</a>";var b=/label/i.test(this.showoptions)?'<span class="labelfield">['+this.feeds[c].ddlabel+"]</span>":" ";var g=gfeedfetcher._formatdate(a[c].publishedDate,this.showoptions);var f=/description/i.test(this.showoptions)?"<br />"+a[c].content:/snippet/i.test(this.showoptions)?"<br />"+a[c].contentSnippet:"";e+=this.itemcontainer+d+" "+b+" "+g+"\n"+f+this.itemcontainer.replace("<","</")+"\n\n"}e+=(this.itemcontainer=="<li>")?"</ul>":"";this.feedcontainer.innerHTML=e};

var gfeedfetcher_loading_image="indicator.gif";function gfeedrssticker(d,b,a,c){this.tickerid=d;this.delay=parseInt(a);this.mouseoverBol=0;this.itemsperpage=1;this.messagepointer=0;gfeedfetcher.call(this,d,b,c);this.itemcontainer="<div>";this.tickerdiv=document.getElementById(d)}gfeedrssticker.prototype=new gfeedfetcher;gfeedrssticker.prototype.constructor=gfeedrssticker;gfeedrssticker.prototype._displayresult=null;gfeedrssticker.prototype.entries_per_page=function(a){this.itemsperpage=a};gfeedrssticker.prototype._signaldownloadcomplete=function(){this.feedsfetched+=1;if(this.feedsfetched==this.feedurls.length){this._initscroller(this.feeds)}};gfeedrssticker.prototype._initscroller=function(a){var c=this;gfeedfetcher._sortarray(a,this.sortstring);this.itemsperpage=(this.itemsperpage>=a.length)?1:this.itemsperpage;var b=a.slice(this.messagepointer,this.itemsperpage);this.tickerdiv.innerHTML=formatrssmessage(b,this.showoptions,this.itemcontainer,this.linktarget);this.tickerdiv.onmouseover=function(){c.mouseoverBol=1};this.tickerdiv.onmouseout=function(){c.mouseoverBol=0};this.messagepointer=this.itemsperpage;if(window.attachEvent){window.attachEvent("onunload",function(){c.tickerdiv.onmouseover=c.tickerdiv.onmouseout=null})}setTimeout(function(){c._rotatemessage()},this.delay)};function formatrssmessage(d,b,f,g){var c=(f=="<li>")?"<ul>\n":"";for(var e=0;e<d.length;e++){var h='<a href="'+d[e].link+'" target="'+g+'" class="titlefield">'+d[e].title+"</a>";var j=/label/i.test(b)?'<span class="labelfield">['+d[e].ddlabel+"]</span>":" ";var k=gfeedfetcher._formatdate(d[e].publishedDate,b);var a=/description/i.test(b)?"<br />"+d[e].content:/snippet/i.test(b)?"<br />"+d[e].contentSnippet:"";c+=f+h+" "+j+" "+k+"\n"+a+f.replace("<","</")+"\n\n"}c+=(f=="<li>")?"</ul>\n":"";return c}gfeedrssticker.prototype._rotatemessage=function(){var b=this;if(this.mouseoverBol==1){setTimeout(function(){b._rotatemessage()},100)}else{var a=this.feeds.slice(this.messagepointer,this.messagepointer+this.itemsperpage);this.tickerdiv.innerHTML=formatrssmessage(a,this.showoptions,this.itemcontainer,this.linktarget);this.messagepointer=(this.messagepointer+this.itemsperpage>this.feeds.length-1)?0:this.messagepointer+this.itemsperpage;setTimeout(function(){b._rotatemessage()},this.delay)}};
//]]>
</script>

6. Selesailah sudah pekerjaan kita, eit..!! tapi tunggu, jangan klik Simpan Template dulu, klik Pratinjau untuk memastikan apakah yang sudah kita perbuat ini sudah diterima, jika lancar dan baik-baik saja baru klik Simpan Template.

Akhirnya selesai juga Postingan Cara Memasang Headline News Diatas Header Blog, lumayan pegel leher, dan pinggang gara-gara kelamaan mikir :D buat postingan ini. silahkan praktekkan dan percantik template blog anda, dan jika ada pertanyaan silahkan utarakan pada kolom komentar dibawah ini.
Saya hanyalah seorang blogger Newbie yang berbagi dari apa yang sedikit saya dapatkan selama ini. jadi mohon maaf jika dalam penyampaiannya kurang jelas, kurang detil dan lain sebagainya.
Akhir kata, Selamat berkreasi dan Happy blogging.

readmore »»  

Membuat Tulisan Dibawah Footer

Membuat Tulisan Dibawah Footer | ilergokil - Footer yang saya ulas kali ini adalah tulisan di bagian terbawah dari sebuah template blog atau website, tips ini mungkin tidak terlalu penting, tapi saya sekedar share saja bagaimana Cara membuat tulisan dibawah footer dengan sangat mudah, jika di hitung waktu kurang dari 5 menit anda sudah dapat membuat tulisan dibawah footer. selain tulisan anda juga dapat menambahkan berbagai chicklet atau gambar mini diantara tulisannya. baik laingsung ke pembahasan:

1. Login ke account blogger

2. Pilih menu Template

3. Klik tombol Edit HTML > Lanjutkan

4. Beri tanda centang pada Expand Template Widget

5. Lalu temukan kode ]]></b:skin> gunakan pencarian cepat dengan menggunakan tombol kombinasi CTRL+F

6. Pastekan kode berikut ini tepat diatas kode ]]></b:skin>

.bawahpic{background:#e3ddd1;width:100%;height:25px;}
.bawah-wrapper{width:980px;margin:0 auto;padding:0 auto}
.bawahtext{padding-top:4px;font:bold 12px Arial;color:#444;text-align:center}

7.  Setelah itu cari kode </body> lau pastekan kode dibawah ini diatas kode </body>

<div class='bawahpic'>
<div class='bawah-wrapper'>
<div class='bawahtext'>
Thanks to <a href='http://ilergokil.blogspot.com/'>M4 ZONE</a> From <a href='http://www.facebook.com/fajar.ajaj'>Fajar S</a>
</div></div></div>

8. Gantilah atau sesuaikan tulisan yang berwarna merah sesuai dengan kreasi anda, entah itu di rubah dengan kata-kata indah, tautan-tautan, nama anda, judul blog, nama/alamat sebuah perusahaan, alamat rumah, nomer telepon, dan lain sebagainya.

9. klik Pratinjau untuk melihat preview nya sebelum di simpan, jika sudah fix dan ok baru anda klik tombol Simpan Template.

Sekarang template blog anda telah ditambah dengan tulisan dibawah footer, semoga artikel Blogger Guides yang telah selesai diulas ini bermanfaat, Lihat juga postingan Cara Membuat Menubar Dua Rangkap Di Blog.
Saya hanyalah seorang blogger Newbie yang berbagi dari apa yang sedikit saya dapatkan selama ini. jadi mohon maaf jika dalam penyampaiannya kurang jelas, kurang detil dan lain sebagainya.
Terimakasih atas kunjungan anda, Selamat berkreasi dan Happy Blogging!.

readmore »»  

Membuat Menu Bar Dua Rangkap Di Blogspot

Membuat Menu Bar Dua Rangkap Di Blogspot | Menubar merupakan sarana navigasi pada blog/web, yang berisi daftar tautan/link, Menubar sendiri biasanya berada di bawah header atau diatas header pada posisi horizontal atau mendatar, dalam variasinya menubar bisa di kostum sedemikian rupa, ada dalam satu web menubarnya terdapat lebih dari satu, kadang itu berada diatas header dan dibawah header, dan terkadang dirangkap dua dan diletakan dibawah header, termasuk blog ini sendiri menggunakan menubar rangkap dua. sebagai contoh menubar rangkap seperti gambar dibawah ini.

Secara default layanan blogger tidak menyediakan menubar pada template-template sederhananya, sebetulnya menubar itu sendiri tidak mutlak diperlukan dalam sebuah blog, namun untuk membuat tampilan blog anda terlihat professional ada baiknya anda pelajari Postingan ini dan mempraktekan serta memasang menubarnya ke blog anda. Cara memasang menubar rangkap dua yang keren seperti gambar diatas ikuti langkah berkut :

Sebelum melakukan Pengeditan, alangkah baiknya backup terlebih dahulu template lama anda.

1. Log in ke akun blogger dengan menggunakan akun anda.
2. Pilih menu Template, Klik tombol Edit HTML.
3. Centang Expand Template Widget,
4. Cari kode ]]></b:skin>, gunakan CTRL + F untuk mempercepat pencarian, kemudian pastekan kode dibawah ini tepat diatas kode ]]></b:skin> tadi.

#menuwrapperpic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-ZiX7ry9GgxQFgwk8Ds9cxbYClRKI8JldCpQ-mCFX7KNniO8CVUH28zfbftWcZ-EMHg8GXqbBJlS-d2kbFM75siQEI00mKjNLYowXoyKv935hy5VSrurhoisZDfi9PQYDOcX6Sp0GX8w/s1600/menuwrap.png) repeat-x top;border-top:5px solid #26231c;border-bottom:5px solid #26231c;width:100%;margin:0 auto;padding:0 auto;height:37px}
#menuwrapper{width:980px;height:37px;margin:0 auto}
.clearit{clear:both;height:0;line-height:0.0;font-size:0}
#menubar{width:100%}
#menubar,#menubar ul{list-style:none;font-family:Arial, serif;margin:0;padding:0}
#menubar a{display:block;text-decoration:none;font-size:12px;font-weight:700;text-transform:none;color:#ddd;padding:11px 12px 11px;border-right:1px solid #6c6250;border-left:1px solid #373123}
#menubar a.trigger{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgX2sn8qX186UM8sMXtzULMYenFVJCHlrUn7fCKmZvzq7UE6QjzW2tk7sNjW23W_G3Uq3VQ5PY0fJzQ1APWbEreir6mOaP4NYUhmB9_GxUX0h5FM6cdMqAeqEIAPXkTIHyA5s4pMp5EoD0/s1600/arrow_white.gif);background-repeat:no-repeat;background-position:right center;padding:11px 24px 11px 12px}
#menubar li{float:left;position:static;width:auto}
#menubar li ul,#menubar ul li{width:170px}
#menubar ul li a{text-align:left;color:#fff;font-size:12px;font-weight:400;text-transform:none;font-family:Arial;border:none;padding:5px 10px}
#menubar li ul{z-index:100;position:absolute;display:none;background:#26231c;-moz-box-shadow:0 2px 2px rgba(0,0,0,0.6);-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.6)}
#menubar li:hover a,#menubar a:active,#menubar a:focus,#menubar li.hvr a{background-color:#26231c;color:#fff}
#menubar li:hover ul,#menubar li.hvr ul{display:block}
#menubar li:hover ul a,#menubar li.hvr ul a{color:#edfdfd;background-color:transparent;text-decoration:none}
#menubar li ul li.hr{border-bottom:1px solid #433e31;border-top:1px solid #11100d;display:block;font-size:1px;height:0;line-height:0;}
#menubar ul a:hover{background-color:#555!important;color:#fff!important;text-decoration:none}

#nav-wrapper{background:#ebe8e1;height:30px;font-family:Arial;overflow:hidden;width:100%}
#nav{margin:0 auto;width:980px;height:30px;padding:0auto}
#nav ul{float:left;width:auto;height:30px;margin:0;padding:0;list-style-type:none}
#nav ul li{float:left;height:30px}
#nav ul li a,#nav ul li a:visited{float:left;height:30px;padding:7px 10px;color:#000;font:bold 12px Arial;text-transform:none}
#nav ul li a:hover,#nav .selected{color:#626262;text-decoration:none;}

#search{float:right;width:180px;height:20px;margin-top:3px;margin-right:5px}
#search form{float:left}
#search input[type="text"]{background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsdWZidHe-tLlRDUNyfCpEgv5aHORItl4JYsRHS94bPEUVq9Bqy07W2ozY_ESqpUjU_59PjrmcIFRzuBSMRFdtgj6sqzHyCbYR3GG56g9r5XdnRYX22RymBZiT1PZeOyfQMdpM57Tur_M/s1600/search_button.png) no-repeat scroll 4px center;float:left;border:1px solid #999;width:146px;margin-top:1px;padding:3px 15px;font-size:12px;text-align:right}
#search input[type="text"]:focus{background:#fff}
#search input[type="submit"]{display:none} 

5. Kode diatas ada tiga bagian, Menubar Horizontal Atas, Menubar Horizontal Bawah, dan Kolom Pencarian/Search. Sesuaikan dengan selera anda pakah mau dipakai tiga-tiganya atau hanya pilih salah satu. Setelah itu kemudian temukan kode

<div id=’header-wrapper’>
<b:section class=’header’ id=’header’ maxwidgets=’1′ showaddelement=’no’>
<b:widget id=’Header1′ locked=’false’ title=’Beautiful Beta (Header)’ type=’Header’/>
</b:section>
</div>

dikarenakan setiap template berbeda-beda, mungkin kode yang akan anda temukan lebih panjang, pastikan setelah kode <div id='header wrapper'> anda telusuri sampai kode penutup </div>. Kemudian pastekan kode dibawah ini setelah kode diatas.

<div id='menuwrapperpic'>
<div id='menuwrapper'>
<ul id='menubar'>
<li><a href='/'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS9S_nAP47CxtY7wMGO6wRNJPHBAbtnaj_vUdtXPOIHj7we1aB6ND0xQApP4frJUopKUnMlGebKh2wjncMkEAs9SjO9zLCQolCUmyZZuK4aM-CH4DP80WvRJHnfThtnEwloMaqwzgbOBQs/s1600/home_white.png' style='padding:0px;'/></a></li>
<li><a href='masukkan link disini'>Menu 1</a></li>
<li><a href='masukkan link disini'>Menu 2</a></li>
<li><a class='trigger' href='#'>Menu 3</a>
<ul>
<li><a href='masukkan link disini'>Sub Menu 1</a></li>
<li class='hr'/>
<li><a href='masukkan link disini'>Sub Menu 2</a></li>
<li class='hr'/>
<li><a href='masukkan link disini'>Sub Menu 3</a></li>
</ul>
</li>
<li><a href='masukkan link disini'>Menu 4</a></li>
<li><a class='trigger' href='#'>Menu 5</a>
<ul>
<li><a href='masukkan link disini'>Sub Menu 1</a></li>
<li class='hr'/>
<li><a href='masukkan link disini'>Sub Menu 2</a></li>
<li class='hr'/>
<li><a href='masukkan link disini'>Sub Menu 3</a></li>
</ul>
</li>
</ul>
<br class='clearit'/>
</div>
<div style='clear:both;'/>
</div> 

<div id='nav-wrapper'>
<div id='nav'>
<b:section class='page' id='page' showaddelement='no'>
<b:widget id='PageList1' locked='false' title='Pages' type='PageList'>
<b:includable id='main'>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<b:if cond='data:link.isCurrentPage'>
<li class='selected'><a expr:href='data:link.href'><data:link.title/></a></li>
<b:else/>
<li><a expr:href='data:link.href'><data:link.title/></a></li>
</b:if>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>
</b:section> 

<div id='search'>
<form action='/search' class='search' id='searchform' method='get'>
<div>
<input name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Type and Enter&quot;;}' onfocus='if (this.value == &quot;Type and Enter&quot;) {this.value =&quot;&quot;;}' size='30' type='text' value='Type and Enter'/>
</div>
</form>
</div>
</div>
</div>

6. Maka akan seperti ini

<div id=’header-wrapper’>
<b:section class=’header’ id=’header’ maxwidgets=’1′ showaddelement=’no’>
<b:widget id=’Header1′ locked=’false’ title=’Beautiful Beta (Header)’ type=’Header’/>
</b:section>
</div> 

<div id='menuwrapperpic'>
<div id='menuwrapper'>
<ul id='menubar'>
<li><a href='/'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS9S_nAP47CxtY7wMGO6wRNJPHBAbtnaj_vUdtXPOIHj7we1aB6ND0xQApP4frJUopKUnMlGebKh2wjncMkEAs9SjO9zLCQolCUmyZZuK4aM-CH4DP80WvRJHnfThtnEwloMaqwzgbOBQs/s1600/home_white.png' style='padding:0px;'/></a></li>
<li><a href='masukkan link disini'>Menu 1</a></li>
<li><a href='masukkan link disini'>Menu 2</a></li>
<li><a class='trigger' href='#'>Menu 3</a>
<ul>
<li><a href='masukkan link disini'>Sub Menu 1</a></li>
<li class='hr'/>
<li><a href='masukkan link disini'>Sub Menu 2</a></li>
<li class='hr'/>
<li><a href='masukkan link disini'>Sub Menu 3</a></li>
</ul>
</li>
<li><a href='masukkan link disini'>Menu 4</a></li>
<li><a class='trigger' href='#'>Menu 5</a>
<ul>
<li><a href='masukkan link disini'>Sub Menu 1</a></li>
<li class='hr'/>
<li><a href='masukkan link disini'>Sub Menu 2</a></li>
<li class='hr'/>
<li><a href='masukkan link disini'>Sub Menu 3</a></li>
</ul>
</li>
</ul>
<br class='clearit'/>
</div>
<div style='clear:both;'/>
</div> 

<div id='nav-wrapper'>
<div id='nav'>
<b:section class='page' id='page' showaddelement='no'>
<b:widget id='PageList1' locked='false' title='Pages' type='PageList'>
<b:includable id='main'>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<b:if cond='data:link.isCurrentPage'>
<li class='selected'><a expr:href='data:link.href'><data:link.title/></a></li>
<b:else/>
<li><a expr:href='data:link.href'><data:link.title/></a></li>
</b:if>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>
</b:section> 

<div id='search'>
<form action='/search' class='search' id='searchform' method='get'>
<div>
<input name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Type and Enter&quot;;}' onfocus='if (this.value == &quot;Type and Enter&quot;) {this.value =&quot;&quot;;}' size='30' type='text' value='Type and Enter'/>
</div>
</form>
</div>
</div>
</div>

7. Setelah selesai klik tombol Pratinjau jika sudah Fix dan OK baru klik tombol Simpan Template.

8. Tulisan yang berwarna Merah ganti dengan URL tujuan, dan tulisan yang berwarna Biru Ganti dengan Judul URL tadi, Contoh:

<li><a href='http://ilergokil.blogspot.com/search/label/Bola?max-results=4'>BOLA</a></li>

 9. Sedangkan untuk menu horizontal bagian bawah, anda dapat mengedit, menambah, mengurangi link dan sebagainya, anda tinggal menuju ke layout dan klik pada Menu Laman.

Nah sekarang anda sudah memasang Menu Bar Dua Rangkap Di Blogspot yang keren dan benar-benar terlihat keren dan professional.
Akhirnya pada penghujung tulisan ini saya ucapkan terimaksih atas kunjungan sobat blogger, semoga artikel Membuat Menu Bar Dua Rangkap Di Blogspot diatas menambah ilmu baru bagi para blogger semua. Dan setelah Postingan ini saya akan membuat postingan Cara Membuat Tulisan Dibawah Footer.
Saya hanyalah seorang blogger Newbie yang berbagi dari apa yang sedikit saya dapatkan selama ini. jadi mohon maaf jika dalam penyampaiannya kurang jelas, kurang detil dan lain sebagainya. Akhir kata saya ucapkan selamat berkreasi dan happy blogging.

readmore »»  

Cara membagi gadget menjadi dua kolom

Cara membagi gadget menjadi dua kolom | Ada kalanya ketika kita sudah merasa pas dengan template yang kita pilih, ternyata kita masih saja merasa ada yang masih kurang dengan tampilan blog kita.Tapi memang betul...., setiap template memiliki kelebihan dan kekurangannya masing - masing. Mungkin dari segi konten sudah bagus tapi tampilan warna kurang pas, dari segi tampilan dan konten sudah serasi tapi karena sudah padat, mungkin kita masih butuh ruang lagi. Lalu bagai mana....?

OK..., seperti yang dirasakan oleh salah satu sobat blogger dan atas permintaannya mungkin trik membagi gadget sidebar menjadi dua kolom akan membantu mengurangi masalah diatas. Untuk itu kali ini akan saya jelaskan lagi cara membagi gadget sidebar menjadi dua kolom, seperti pada gambar berikut :



Tapi yang jelas trik yang saya berikan ini digunakan untuk membagi gadget menjadi dua kolom. Baik gadget yang ada pada bagian Sidebar (bagian samping), header (atas), maupun footer (bawah).

Bila anda berminat silahkan anda ikuti langkah - langkah dibawah ini :

1. Login ke blogger dengan ID anda.
2. Klik Rancangan.
3. Dan KLik tab Edit HTML.

4. Cari kode di bawah ini atau yang mirip dengan kode ini :

]]></b:skin>

5. Copy kode di bawah ini dan taruh tepat sebelum kode ]]></b:skin> :

#kolom-kiri {width: 49%;float: left;}#kolom-kanan {width: 49%;float: right;}

6. Cari kode pada bagian sidebar, misalnya seperti kode berikut :

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'><b:widget id='Label99' locked='false' title='Labels' type='Label'/> </b:section>
</div>

Catatan:
Pada bagian sidebar, setiap template belum tentu memiliki "id" yang sama. Dan pada langkah ini, saya berikan contoh dengan id='sidebar-wrapper'.

Tapi yang jelas... seperti yang saya katakan diatas, trik yang saya berikan ini digunakan untuk membagi gadget menjadi dua kolom. Baik gadget yang ada pada bagian Sidebar (bagian samping), header (atas), maupun footer (bawah).

Dan yang perlu diperhatikan adalah bentuk kode dari konten yang berisi gadget, yaitu seperti berikut :

<div id=' .......... '>
<b:section class='sidebar' id='sidebar' preferred='yes'><b:widget id='HTML' locked='false' title='' type='HTML'/> </b:section>
</div>

7. Sisipkan kode dibawah ini diantara </b:section> dan </div> :

<b:section class='sidebar' id='kolom-kiri' showaddelement='yes'>
<b:widget id='Text500' locked='false' title='kolom-kiri' type='Text'/>
</b:section>
<b:section class='sidebar' id='kolom-kanan' showaddelement='yes'>
<b:widget id='Text501' locked='false' title='kolom-kanan' type='Text'/>
</b:section>
<div style="clear: both;"></div>

Sehingga tampak seperti berikut :

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'><b:widget id='Label99' locked='false' title='Labels' type='Label'/> </b:section>
<b:section class='sidebar' id='kolom-kiri' showaddelement='yes'>
<b:widget id='Text500' locked='false' title='kolom-kiri' type='Text'/>
</b:section>
<b:section class='sidebar' id='kolom-kanan' showaddelement='yes'>
<b:widget id='Text501' locked='false' title='kolom-kanan' type='Text'/>
</b:section>
<div style="clear: both;"></div>
</div>

8. SIMPAN TEMPLATE

Selesai...., silahkan anda lihat hasilnya....
Selamat mencoba dan Semoga bermanfaat....

sumber

readmore »»  

CARA MENGATUR JUMLAH ARTIKEL YANG TAMPIL PADA SAAT KLIK LABEL

Pada template bawaan blogspot setiap label di klik maka jumlah artikel akan tampil semua, jika jumlah nya banyak maka halaman blog kita menjadi panjang ke bawah. Ini tentunya sangat tidak menarik untuk blog kita, apalagi loading page nya menjadi sangat lambat.

Pada artikel ini akan menjelaskan bagaimana cara mengatur jumlah artikel yang tampil pada saat klik label.
Masuk blogger > rancangan > edit html > centang expand template widget
cari kode expr:href='data:label.url Kemudian tambahkan kode ini + &quot;?max-results=5&quot; setelah kode expr:href='data:label.url, nanti jadi nya seperti di bawah ini

expr:href='data:label.url + &quot;?max-results=5&quot;

CATATAN : terdapat banyak kode expr:href='data:label.url yang berada di template kita, jadi tambahkan kode + &quot;?max-results=5&quot pada semua kodeexpr:href='data:label.url yang ada di template.
Setelah semua selesai di tambahkan, simpan template.

Kemudian cara ini untuk yang memakai navigasi nomor halaman,
Cara nya masih sama dengan yang di atas yang berbeda adalah kode yang harus di tambah. Kode yang harus di tambahkan adalah kode berikut ini + &quot;?&amp;max-results=5&quot; nanti jadi nya akan seperti ini :

expr:href='data:label.url + &quot;?&amp;max-results=5&quot;

Masih sama seperti di atas kode tersebut harus di tambahkan pada semua kode expr:href='data:label.url yang terdapat di template.
Jika semua sudah benar simpan template.
Perhatikan results=5, angka 5 adalah jumlah artikel yang akan tampil saat label di klik, jadi bisa sobat ganti sesuai dengan keinginan sobat.

sumber

readmore »»  

Buat Daftar Isi Blog Mudah, Simple, Cepat dan Keren

Buat Daftar Isi Blog Mudah, Simple, Cepat dan Keren, Sesuai judulnya saya akan berbagi cara mudah membuat daftar isi blog yang sangat mudah. ada dua tahap yang akan saya berikan disini, langsung saja ikuti langkah-langkah Buat Daftar Isi Blog Mudah, Simple, Cepat dan Keren. dengan seksama.

Tahap pertama : Membuat daftar isi satu halaman penuh.

• Login Ke Blogger, kemudian pilih Laman. 

• Klik tombol Laman baru kemudian sorot dan klik Laman Kosong.

• Kemudian klik tombol HTML, Berikan judulnya Daftar Isi / Site Map, terserah anda lalu pastekan  script dibawah ini.

<script src="http://ilergokil.googlecode.com/files/contents.js">
</script><script src="http://ilergokil.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>

• Url yang berwarna MERAH ganti dengan URL blog sobat. kemudian tekan tombol publikasikan, dan silahkan lihat hasilnya. berlanjut ke tahap kedua.

Tahap kedua : Membuat pada widget sidebar.

• Setelah anda log in ke blogger, pilih Tata Letak

• Lanjut dengan mengklik tulisan tambah gadget, kemudian pilih HTML/JavaScript

• Lalu pastekan kode dibawah ini, supaya widget daftar isi tidak terlalu memanjang saya lakukan penambahan fungsi scroll untuk menghemat tempat, penambahan kode tersebut saya kasih warna HIJAU

<div style="overflow: auto; height: 200px; text-align: left; background:#FFFFF;">
<script src="http://ilergokil.googlecode.com/files/contents.js">
</script><script src="http://ilergokil.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>
</div>

• Ganti Url yang dimerahi dengan URL blog anda. Angka yang diwarnai merah adalah ketinggian dari widgetnya, silahkan sesuaikan dengan selera anda.
•  Lihat Screen Shot dibawah ini, Ter akhir tekan tombol Simpan

• Selesai deh, mangga di tingali hasilna.. :D

Mudah-mudahan sedikit yang di bagikan kali ini bermanfaat bagi para blogger semua.

readmore »»  

Tabel Satuan Ukuran Font Pada HTML CSS

Tabel Satuan Ukuran Font Pada HTML CSS. Terkadang pada saat akan menentukan besar atau kecil suatu huruf dalam pengeditan HTML/CSS di blog sedikit kesulitan, saya sendiri sering mengira-ngira ukuran huruf sampai harus berulang kali mencocokkan huruf dengan template blog ini, tapi setelah melakukan pencarian akhirnya saya berlabuh htmlcssguides.com dan mendapatkan apa yang saya cari, dan dibawah ini ada Tabel Satuan Ukuran Font Pada HTML CSS, yang sangat berguna bagi anda para blogger.

Tabel berikut dapat digunakan untuk mengubah satuan ukuran font didalam dokumen HTML maupun CSS. Telah di test dan diuji di modern browser dengan ukuran font dan jenis font standarnya masing-masing.

Dalam satu baris pixels (px), percent (%) Ems (em) dan points (pt) di bawah ini akan menghasilkan ukuran font yang sama.

Dengan catatan ukuran font dipengaruhi juga oleh jenis font, browser dan system yang digunakan.

PIXELS	PERCENT	EMS	POINTS
8px	50%	0.5em	6pt
9px	55%	0.55em	7pt
10px	62.5%	0.625em	7.5pt
11px	70%	0.7em	8pt
12px	75%	0.75em	9pt
13px	80%	0.8em	10pt
14px	87.5%	0.875em	10.5pt
15px	95%	0.95em	11pt
16px	100%	1em	12pt
17px	105%	1.05em	13pt
18px	112.5%	1.125em	13.5pt
19px	120%	1.2em	14pt
20px	125%	1.25em	14.5pt
21px	130%	1.3em	15pt
22px	140%	1.4em	16pt
23px	145%	1.45em	17pt
24px	150%	1.5em	18pt
26px	160%	1.6em	20pt
29px	180%	1.8em	22pt
32px	200%	2em	24pt
35px	220%	2.2em	26pt
36px	225%	2.25em	27pt
37px	230%	2.3em	28pt
38px	235%	2.35em	29pt
40px	245%	2.45em	30pt
42px	255%	2.55em	32pt
45px	275%	2.75em	34pt
48px	300%	3em	36pt

Semoga Tabel Satuan Ukuran Font Pada HTML CSS diatas bermanfaat. Salam Blogger

source: http://htmlcssguides.com

readmore »»  

Memasang Kategori Berdasarkan Label Disertai Thumbnail

Memasang Kategori Berdasarkan Label Disertai Thumbnail di Blogger. Pada kesempatan yang berbahagia ini, saya akan membagikan tutorial blog sederhana, bagi para blogger yang ingin tampilan blognya lebih interaktif dan dinamis bagi para pengunjung blog, Kategori berasarkan label ini memberikan kemudahan bagi pengunjung  blog atau situs anda dimana pada saat pengunjung tersebut memilah-milih bacaan tentunya tak sedikit pencarian yang dilihat berdasarkan kategori. Ah ngomong apa yak :D, ya sudah kalau mau lihat cotohnya bisa lihat gambar dibawah ini :

Menarik bukan??
langsung saja ikuti langkah2 berikut ini:

• Log in ke blogger
• setelah login di menu opsi lainnya pilih Tata Letak,

• Kemudian klik Tambah Gadget.

• Pilih HTML/JavaScript

•  Silahkan Anda kopi dan pastekan Kode dibawah ini ke dalam kolom Konten, lihat petunjuk gambar dibawah.

<script type='text/javascript'>var numposts = 4;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 3;</script> <script type="text/javascript" src="/feeds/posts/default/-/Tips%20dan%20Trik?orderby=updated&alt=json-in-script&callback=labelthumbs"></script> <script src="http://ilergokil.blogspot.com/feeds/posts/summary/-/Tips%20dan%20Trik?max-results=5&alt=json-in-script&callback=recentpostslist"></script><a href="http://ilergokil.blogspot.com/search/label/Tips%20dan%20Trik" style="float:right;font:normal 11px Arial;padding:5px 0;">More on this category &#187;</a> 

• Warna Biru = sesuaikan dengan jumlah postingan yang ingin ditampilkan
• Warna Merah = Ganti dengan URL blog/website anda.
• Warna Hijau = Kategori blog, ganti spasi di kategori blog dengan %20, contoh Kategori Blog menjadi Kategori%20Blog, usahakan besar kecil huruf di perhatikan juga.
• Terakhir tekan tombol Simpan, dan sesuaikan posisinya sesuai selera, mau di sidebar atau footer, itu terserah anda.

Ada pilihan keduanya lihat gambar dibawah ini

 

:
Jika anda tertarik silahkan ikuti petunjuk berikut :

• Sama seperti dengan tahap-tahap diatas, Anda tinggal Mengkopi pastekan kode dibawah ini:

<script type='text/javascript'>var numposts = 1;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 60;</script>
<script type="text/javascript" src="/feeds/posts/default/-/Tips%20dan%20Trik?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>
<script type="text/javascript">function recentpostslist(json) { document.write('<ul>'); for (var i = 0; i < json.feed.entry.length; i++) {    for (var j = 0; j < json.feed.entry[i].link.length; j++) {      if (json.feed.entry[i].link[j].rel == 'alternate') {        break;      }    }var entryUrl = "'" + json.feed.entry[i].link[j].href + "'";//bsvar entryTitle = json.feed.entry[i].title.$t;var item = "<li>" + "<a href="+ entryUrl + '" target="_blank">' + entryTitle + "</a> </li>"; document.write(item); } document.write('</ul>'); }</script><script src="http://ilergokil.blogspot.com/feeds/posts/summary/-/Tips%20dan%20Trik?max-results=5&alt=json-in-script&callback=recentpostslist"></script><a href="http://ilergokil.blogspot.com/search/label/Tips%20dan%20Trik" style="float:right;font:normal 11px Arial;padding:5px 0;">More on this category &#187;</a>

Terakhir dari saya, silahkan anda kreasikan sesuai selera Anda, Happy Blogging :)


source : http://creatingwebsite-maskolis.blogspot.com

readmore »»  

Bagaimana Cara Mem Back-Up Template Blog

Kembali di tutorial sederhana Blogspot / Blogger.com, Episode kali ini, kami akan segera membahas Bagaimana Cara Mem Back-Up Template Blog. Membackup sebuah blog dilakukan ada beberapa hal, salahsatunya: ketika anda ingin mengotak-atik suatu template blog, karena jika kita melakukan kesalahan pada saat mengutak atik, template bisa dikembalikan seperti semula.
Ingin mengganti/mencoba template baru, takutnya template baru tidak bagus, jika sudah di backup Anda akan merasa tenang karena tinggal Upload lagi template lama tadi, yang barusan itu manfaat Bagaimana Cara Mem Back-Up Template Blog.

Silahkan anda simak caranya dibawah ini kemudian anda langsung praktekan.

• Log in terlebih dahulu ke akun Blogger.
• Kemudian pilih template
• Tekan tombol Cadangkan / Pulihkan. Posisinya di pojok kanan atas tepat dibawah tombol Pofile.

• Klik tombol Unduh template lengkap, tombol warna orange. maka file unduhan akan berjalan secara langsung, dan masuk ke folder C:\My Documents\Unduhan.

• Jika sudah selesai silahkan anda tekan tombol Tutup.

Disini saya akan sekalian membahas Bagaimana Cara Mengupload file hasil unduhan Anda tadi.

Pada jendela tadi, yaitu setelah anda mengunduh template, disitu ada tombol Choose File, nah silahkan tekan disitu, kemudian pilih file hasil unduhan tadi, tekan tombol Open, Selanjutnya Klik tombol Unggah.

Tunggulah beberapa saat sampai Muncul tulisan "Berhasil diunggah".
sekian, dan terimakasih.

readmore »»  

Menghapus Tulisan "Di tulis oleh..."

Bagi sebagian lain, tampilan blog yang rapi dan tidak terlalu banyak link-link, atau kata-kata kurang relevan dan sedikit mengganggu merupakan selera dari seorang blogger itu sendiri.
Secara umum ketika kita menulis sebuah artikel di blog, dan setelah dipublikasikan, maka si pembuat artikel tersebut akan tercantum namanya diatas postingan atau di bawah postingan blog tersebut. jika hal tersebut dirasa mengganggu, baik mengganggu secara tampilan ataupun yang lainnya, tutorial ini dirasa akan sedikit membantu Anda. Silahkan simaklah cara Menghapus Tulisan "Di tulis oleh..." dibawah ini:

Tulisan yang akan anda hapus kurang lebih seperti ini,

Posisi dari tulisan tersebut bisa dibawah atau diatas.

Sebelum melakukan trik ini sebaiknya Back Up terlebih dahulu template anda.

Lihat Cara Memback-Up Template Blogger

• Log in ke blogger menggunakan akun sendiri tentunya
• Pilih Template
• Klik tombol Edit HTML

• Pilih tombol Lanjutkan kemudian beri centang pada tulisan Expand Template Widget.

• Selanjutnya temukan kode <data:top.authorLabel/>, Gunakan pencarian cepat dengan tombol kombinasi CTRL+F kemudian pastekan kode tadi di kolom Search.
• Terlihat kode lengkapnya seperti dibawah ini:

<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<span class='fn'><data:post.author/></span>
</b:if>
</span>
<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
</b:if>
</b:if>
</span> 

• Perlu diketahui bahwa, setiap template berbeda-beda, maka dari itu carilah yang persis sama seperti diatas.
• Hapus seluruh kode diatas.

Sekarang tinggal Anda lihat hasilnya. Demikian trik Menghapus Tulisan Ditulis oleh Pada BLOG Selamat berkreasi dan Happy Blogging :)

readmore »»  

Cara mudah membuat link di postingan blogspot

Sesuai dengan pengalaman saya baru-baru ini di dunia perbloggan, dulu ketika pertama kali saya daftar di blogger.com, membuat postingan di blog cukup menyenangkan, selain menambah koleksi postingan juga bermanfaat mengisi waktu kosong, alaupun menulis postingan sendiri itu harus sedikit memutar otak, "apa nih yang harus saya tulis di postingan baru kali ini", sebelum menulis postingan tentunya sya berkeliling-terlebih dahulu di Google, mencari inspirasi ke sana kemari tentunya bukan inspirasi untuk copas artikel dari blog lain. ketika dapat inspirasi, langsung saja saya masuk ke blogger, dan mulailah saya menuliskan postingan.

Susahnya menulis postingan itu ada beragam, mulai dari menentukan judul, menulis basa-basi terlebih dahulu sebelum masuk ke inti dari postingan dan lain-lain. seperti pada postingan kali ini basa-basi diatas lumayan ngalor-ngidul bacaannya, ya.. mau gimana lagi, saya sih hanya ingin postingan di blog ini tidak mau sedikit dengan tulisan dikarenakan waktu kemaren-kemaren saya pernah membaca di suatu blog yang isi artikelnya tertulis: "blog yang baik itu lebih banyak tulisan daripada gambar", itu salah satu pedoman saya dalam menulis sebuah postingan di blog.

Tuh kan?? udah lumayan panjang kan basa-basinya, ya sudah saya rasa sudah cukup, langsung saja kita ke inti dari postingan ini sesuai judulnya Cara mudah membuat link di postingan blogspot.


Cara mudah membuat link di postingan blogspot


Sebelum melakukan Cara mudah membuat link di postingan blogspot. pertama anda harus log in terlebih dahulu ke blogger, silahkan LogIn Disini

1. setelah anda log in, tentunya tampilan awalnya akan seperti ini

2. Kemudian, tekan tombol warna orange, yang didalamnya ada icon pensil, atau tekan tombol gulir panah ke bawah, kemudian pilih post. lakukan cara yang mana saja, tapi cara yang paling cepat yaitu dengan mengklik tombol orange tadi.

3. Setelah itu, tampilan entri akan tampak seperti dibawah ini.

4. Selanjutnya tuliskan kata atau kata yang menghubungkan ke alamat yang dituju. Misalnya tulisan "DOWNLOAD DISINI".


5. Cara termudah: Blok kata tersebut, kemudian tekan tombol Link di atas postingan atau di menu bar. lihat gambar.

6. Setelah Anda mengklik tombol tadi maka akan muncul kotak dialog "Edit Link", Setelah itu anda tinggal masukan link ke kolom "Web address", langsung saja klik ok. lihat gambar dibawah.

Tada..! Link di postingan anda telah jadi. nah.. tadi itu cara pertama lanjut ke cara yang lain yaitu dengan cara manual.

7. Cara manualnya: Pada postingan tadi tekan tombol HTML disamping tombol Compose. Kemudian cari kata tadi yang anda tulis yaitu kata "DOWNLOAD DISINI".

8. Kemudian tulis Tag <a href="link"> sebelum kata "DOWNLOAD DISINI", kemudian tutup dengan tag penutup </a>. Maka hasilnya akan tampak seperti dibawah ini

<a href="http://ilergokil.blogspot.com/p/downloads">DOWNLOAD DISINI</a>

 *ganti tulisan yang berwarna merah dengan alamat yang ingin anda tuju.

9. Selesai.. silahkan klik tombol Compose dan lihat hasilnya, akan sama seperti cara pertama. Kemudian sebelum di publikasikan pratijau terlebih dahulu postingan anda. demikian tutorial sederhana Cara mudah membuat link di postingan blogspot.

*cara manual diatas dapat diaplikasikan dalam pembuatan link selain di postingan, misalnya di dalam widget sidebar blog, di elemen laman, di template blog dan lain sebagainya.
selamat membuat link dan Happy Blogging ! :D

readmore »»  

Cara membuat blog Terbaru

Hai.. para pembaca sekalian,, setelah anda berkelana di Google bagaimana cara membuat blog kemudian pada akhinya anda terdampar di blog ini. Selamat..!! anda berada di blog yang tepat, karena disinilah penulis akan memberikan tatacara membuat blog terbaru di blogspot (www.blogger.com). tanpa berpanjang dan berlebar-lebar simaklah dengan baik tatacara berikut ini:


#PERTAMA
tentunya anda harus masuk ke situsnya dahulu yaitu www.blogger.com silahkan KLIK DISINI.
maka anda akan menemui tampilan seperti ini:

#KEDUA
Klik tombol DAFTAR

Isilah ormulir pendaftaran dengan lengkap, setelah semuanya terisi kemudian tekan tombol 
selesai sudah, sangat mudah bukan?!!.
Sekarang Anda sudah terdaftar di blogger/google account, maka tampilan perdana nya akan terlihat seperti dibawah ini

#KETIGA
Klik tombol Blog baru, kemudian jendela selanjutnya yang muncul seperti ini

Nah di jendela tersebut anda diminta memasukan Judul dan Alamat blog anda, kemudian pilih templatenya sesuai selera. setelah itu klik tombol Buat blog!
setelah diklik maka akan terlihat seperti dibawah ini

#TERAKHIR
Silahkan anda memulai blogg anda, dengan cara menekan tombol orange bergambar pensil, kembangkanlah sendiri kreasi anda dengan memulai artikel-artikel, atau tulisan yang enak dibaca bagi pembaca. di sebelah tombol bergambar pensil ada tombol buka daftar entri kemudian ada tombol anak panah kebawah (Opsi lainnya, nah tombol anak panah kebawah itu adalah tombol menu pengaturan, disana segala pilihan-pilihan pengaturan untuk bloganda tersedia. Happy Blogging :)

readmore »»  

Memasang kotak komentar facebook di blog terbaru 2012

Modar-mandir, kesana kemari ketika saya mencari tutorial blog bagaimana cara pasang facebook komentar dibawah postingan susahnya lumayan, bukannya gak ada, yang ada juga gak ada cocok, di coba satu persatu, banyak gagalnya tapi ada juga yang berhasil cuman hasilnya tidak memuaskan dan kurang sempurna. tapi pada akhirnya saya menemukan sendiri caranya dan terbukti sukses, berhasil sempurna sesuai yang diinginkan.

berikut ini solusi terbaik dan cara yang saya praktekan berhasil memuaskan, ok langsung ke TKP..

1. Pertama anda masuk ke facebook developers langsung aja KLIK DISINI.
*pastikan anda sudah login ke facebook, tapi sebetulnya bagi anda yang tidak mempunyai akun facebook atau tidak login ke facebook pun bisa mendapatkan kode nya dan disini anda tidak perlu mendaftar aplikasi facebook seperti biasanya.

- Isilah kolom URL to commnet on dengan blog/website anda.
- Pada kolom Number of posts ganti angka sesuai keinginan anda, angka tersebut merupan jumlah komentar yang muncul di blog, apabila komentar lebih dari nominal yang di pilih maka komentar otomatis tersembunyi di bawah komentar ke terakhil, jika ingin menampilkannya anda tinggal mengklik tombol "tampilkan yang lain".
- Di kolom Width gantilah sesuai dengan lebar template template blog ada.
- Color scheme ada dua pilihan: light an dark, pilih sesuai selera.
- Terakhir tekan tombol Get Code.
maka munculah jendela seperti ini

2. Pada tab HTML 5 yang kita gunakan hanya kode yang paling bawah, sedangkan kode yang diatasnya itu diabaika sajah, kopi terlebih dahulu kode di bawah tersebut dan pastekan dahulu ke notepad.

3. selanjutnya Log in ke Blogger pilih Template lalu pilih Edit HTML  lalu Pilih Lanjutkan kemudian centang Expand Template Widget (posisi di pojok kiri atas).

*ingat! backup terlebih dahulu template sebelum melanjutkan tutorial ini


4. Cari tag 

<body>

5. Kemudian Kopi lalu pastekan kode di bawah ini setelah kode <body>

<div id='fb-root'/>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) {return;}
  js = d.createElement(s); js.id = id;
  js.src = &quot;//connect.facebook.net/en_GB/all.js#xfbml=1&quot;;
  fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>

maka hasilnya akan seperti ini

<body>
<div id='fb-root'/>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) {return;}
  js = d.createElement(s); js.id = id;
  js.src = &quot;//connect.facebook.net/en_GB/all.js#xfbml=1&quot;;
  fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>

6. Tahap pertama selesai lanjut ke tahap berikutnya, masih ingat langkah ke 2 yap buka notepad yang berisi kode tadi kemudian kopi lalu letakan kode tadi setelah kode

<p class='comment-footer'>
        <b:if cond='data:post.embedCommentForm'>
          <b:if cond='data:post.allowNewComments'>
            <b:include data='post' name='comment-form'/>
          <b:else/>
            <data:post.noNewCommentsText/>
          </b:if>
        <b:else/>
          <b:if cond='data:post.allowComments'>
            <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
          </b:if>
        </b:if>
      </p>
    </b:if>

atau yang mirip dengan kode diatas karena posisi komentar facebook nya berada dibawah komentar bawaan blogspot, atau anda bisa menonaktifkan komentar bawaannya dengan pilih Setelan-Pos dan komentar-lokasi komentar, lau pilih Sembunyikan.
Maka hasilnya akan seperti ini

<p class='comment-footer'>
        <b:if cond='data:post.embedCommentForm'>
          <b:if cond='data:post.allowNewComments'>
            <b:include data='post' name='comment-form'/>
          <b:else/>
            <data:post.noNewCommentsText/>
          </b:if>
        <b:else/>
          <b:if cond='data:post.allowComments'>
            <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
          </b:if>
        </b:if>
      </p>
    </b:if>
<div class="fb-comments" data-href="http://bloganda.blogspot.com" data-num-posts="5" data-width="470"></div>

*Yang diwarnai merah adalah kode yang di dapat dari langkah 1 dan  2
*Yang diwarnai hijau bisa anda sesuaikan lagi jika merasa perlu dirubah kembali.

7. Selasai simpan template dan lihat hasilnya.

readmore »»