WahIniBlog

Cara Membuat Widget Posting Terbaru dan Komentar Terbaru di Blog

2017-06-05T14:32:00.000+08:00

Widget Posting Terbaru dan Komentar Terbaru merupakan navigasi blog yang cukup bermanfaat bagi pengunjung. Oleh karena itu, pada postingan kali ini WahIniBlog akan berikan cara membuat Widget Posting Terbaru (Recent Posts) dan Widget Komentar Terbaru (Recent Comments).

Selain sebagai navigasi yang memudahkan pengunjung menjelajahi konten blog Anda, widget posting terbaru dan komentar terbaru ini juga berfungsi sebagai Internal Link. Tentu saja hal ini sangat baik untuk SEO pada blog.

Nah, jika Anda ingin membuat widget "Posting Terbaru" dan "Komentar Terbaru" di Blogspot, silahkan simak caranya di bawah ini:

Cara Membuat Widget "Recent Posts" dan "Recent Comments"

Berikut ini adalah cara membuat widget "Recent Posts" dan "Recent Comments" di Blogspot dengan menggunakan Gadget "Feeds" :

Pertama-tama Anda harus siapkan dulu "Feeds"-nya, yaitu Feed Posts dan Feed Komentar :

1. URL Blog Posts Feed.
http://URL-blog-Anda/feeds/posts/default
Contohnya: http://wahiniblog.blogspot.com/feeds/posts/default

2. URL Blog Comments Feed.
http://URL-blog-Anda/feeds/comments/default
Contohnya: http://wahiniblog.blogspot.com/feeds/comments/default

Selanjutnya, langkah mudah dan cepat membuat dan memasang widget "Recent Posts" dan "Recent Comments" di Blogspot, yaitu:

1. Klik menu "Layout" atau "Tata Letak" pada dashboard blog.
2. Kemudian klik "Add a gadget" di salah satu sidebar atau footer.
3. Selanjutnya pilih "Feeds".
4. Lalu masukkan kode feed posts yang telah disiapkan sebelumnya (http://URL-blog-Anda/feeds/posts/default)
5. Ganti nama Gadget dengan "Posting Terbaru" atau "Recent Post"
6. Terakhir klik "Save!"

Langkah yang sama untuk membuat widget "Recent Comments", hanya saja kode URL Feeds-nya menggunakan yang http://URL-blog-Anda/feeds/comments/default serta ganti nama gadget dengan "Komentar Terbaru" atau "Recent Comments".

Baca juga: Cara Mengatur dan Menyesuaikan Tampilan Widget di Sidebar Blog

Nah, begitulah Cara Membuat Widget "Recent Post" dan Recent Comment" dengan menggunakan gadget Feed. Cukup mudah bukan? Jika masih ada yang belum jelas, mari kita diskusikan di kolom komentar dibawah ini. Good Luck! & Happy Blogging!

Cara Membuat Featured Post Sederhana di Blog

2017-04-18T22:51:00.000+08:00

Membuat Featured Post di Blog sangat berguna untuk menampilkan posting unggulan / posting terbaik dari blog anda agar mudah ditemukan oleh pengunjung, terutama di halaman depan blog anda. Ada juga yang menggunakan featured post untuk mengelompokkan beberapa postingan sesuai dengan kategorinya. Namun, keberadaan featured post yang terlalu banyak (featured post dengan berbagai kategori), justru akan membuat blog/website anda menjadi lebih berat dan loadingnya jadi lambat. Tentu hal ini bisa mengurangi kenyamanan pengunjung yang memiliki koneksi internet lemot.

Untuk itu, pada postingan ini saya akan berikan cara membuat featured post yang sederhana dan tidak memberatkan loading blog anda. Caranya sangat mudah untuk diterapkan di blog anda. Silahkan Anda ikuti langkah-langkah berikut ini:

Cara Membuat Featured Post di Blog

1. Masuk ke dashboard blog anda dan klik pada menu "Theme" --> "Edit HTML", lalu tambahkan kode dibawah ini sebelum kode ]]></b:skin> atau </style>

#feature-posts-section{max-height:370px;overflow:hidden;padding:20px;margin:0 auto;}
.featured-posts a{color:#fff;}
.featured-posts a:hover{color:#fff;text-decoration:underline;}
.main-post.featured-posts a{margin:0;font-size:18px}
.featured-posts .col-post{float:left;position:relative;overflow:hidden;}
.featured-posts .secondary-post{width:34.4%;margin:0;}
.featured-posts .secondary-post:nth-child(odd){margin:3px 0 0 0}
.featured-posts .main-post{width:65.2%;padding:0;margin:0 3px 0 0}
.featured-posts span{padding:8px;color:#fff;font-size:12px;font-style:normal;top:0;left:0;z-index:2;position:absolute}
.featured-posts span.lebb{background:#e74c3c;visibility:hidden;opacity:0;top:-20px;transition:all .3s}
.featured-posts .main-post:hover span.lebb,.featured-posts .secondary-post:hover span.lebb{visibility:visible;opacity:1;top:0;}
.featured-posts img{height:100%;transition:transform 0.35s ease 0s;-moz-transition:transform 0.35s ease 0s;-o-transition:transform 0.35s ease 0s}
.featured-posts .main-post img{height:350px;width:100%;object-fit:cover}
.featured-posts .secondary-post img{height:175px;object-fit:cover;width:100%}
.featured-posts .main-post:hover img,.featured-posts .secondary-post:hover img{transform:scale(1.1)}
.featured-posts header{position:absolute;bottom:0;left:0;padding:20px;width:100%;z-index:2}
.featured-posts h4{font-size:15px;line-height:1.3;}
.featured-posts header h3,.featured-posts header h4{font-weight:400}
.featured-posts span.vignette{background-color:transparent;position:absolute;overflow:hidden;margin:0;padding:0;height:100%;top:0;left:0;right:0;bottom:0;transition:background 0.3s linear,opacity 0.3s linear}
@media screen and (max-width:768px) {
h1.post-title.entry-title a, h2.post-title.entry-title a {margin:15px 0;}
#feature-posts-section{display:none}}
.featured-posts .main-post:before,.featured-posts .secondary-post:before{bottom:0;content:"";display:block;height:50%;width:100%;position:absolute;z-index:1;background:linear-gradient(to bottom,rgba(0,0,0,0) 0%,#000 100%)}
.featured-posts span{background:rgba(0,0,0,0.3);display:inline-block;color:#fff;font-style:normal;position:absolute;transition:all .4s;font-size:11px;line-height:1.4;padding:3px 6px;top:10px;left:10px;z-index:2}

2. Tambahkan javascript berikut ini di atas kode </head>


<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
snippet_count = 80;
//<![CDATA[
function removeHtmlTag(n,e){if(-1!=n.indexOf("<")){for(var t=n.split("<"),i=0;i<t.length;i++)-1!=t[i].indexOf(">")&&(t[i]=t[i].substring(t[i].indexOf(">")+1,t[i].length));n=t.join("")}for(e=e<n.length-1?e:n.length-2;" "!=n.charAt(e-1)&&-1!=n.indexOf(" ",e);)e++;return n=n.substring(0,e-1),n+"....."}function createSnippet(n){var e=document.getElementById(n),t=snippet_count,i='<div class="snippets">'+removeHtmlTag(e.innerHTML,t)+"....."+"</div>";e.innerHTML=i}
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(e,t){for(var s=e.split("<"),r=0;r<s.length;r++)-1!=s[r].indexOf(">")&&(s[r]=s[r].substring(s[r].indexOf(">")+1,s[r].length));return s=s.join(""),s=s.substring(0,t-1)}function sliderposts(e){j=showRandomImg?Math.floor((imgr.length+1)*Math.random()):0,img=new Array,numposts1<=e.feed.entry.length?maxpost=numposts1:maxpost=e.feed.entry.length;for(var t=0;t<maxpost;t++){var r,i,n=e.feed.entry[t],l=n.category[0].term,o=n.title.$t;if(t==e.feed.entry.length)break;for(var m=0;m<n.link.length;m++)if("alternate"==n.link[m].rel){i=n.link[m].href;break}for(var m=0;m<n.link.length;m++)if("replies"==n.link[m].rel&&"text/html"==n.link[m].type){r=n.link[m].title.split(" ")[0];break}if("content"in n)var g=n.content.$t;else if("summary"in n)var g=n.summary.$t;else var g="";postdate=n.published.$t,j>imgr.length-1&&(j=0),img[t]=imgr[j],s=g,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),-1!=a&&-1!=b&&-1!=c&&""!=d&&(img[t]=d);for(var h=[1,2,3,4,5,6,7,8,9,10,11,12],p=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],f=(postdate.split("-")[2].substring(0,2),postdate.split("-")[1]),u=(postdate.split("-")[0],0);u<h.length;u++)if(parseInt(f)==h[u]){f=p[u];break}if(0==t){var v='<div class="main-post col-post"><a href="'+i+'"><span class="blue">'+l+'</span><img src="'+img[t]+'" height="350" width="640" alt=""></img></a><header><h3 class="entry-title"><a href="'+i+'" title="">'+o+"</a></h3></header></div>";document.write(v)}else{var v='<div class="secondary-post col-post" style="margin-right:0"><span class="blue">'+l+'</span><a class="hover_play_small" href="'+i+'"><img src="'+img[t]+'" height="200" width="320"></img></a><header><h4><a href="'+i+'">'+o+"</a></h4></header></div>";document.write(v)}j++}}imgr=new Array,imgr[0]="http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif",showRandomImg=!0,aBold=!0,summaryPost=150,summaryTitle=50,numposts1=10,featured_numposts="3";
//Label Badge
function label_pick(e){labelnes=new Array,labelnes[1]="<div class='badge featured'><div class='badge-img'><i class='fa fa-bolt'></i></div></div>",labelnes[2]="<div class='badge badge1 trendy'><div class='badge-img'><i class='fa fa-bolt'></i></div></div>","Hot"==e&&document.write(labelnes[1]),"Hiburan"==e&&document.write(labelnes[2])}
//]]>
</script>
</b:if>

3. lalu tambahkan lagi kode dibawah ini,dibawah content-wrapper atau header-wrapper

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div class='ct-wrapper' id='feature-posts-section'>
<div class='featured-posts padding clearfix'>        
<script type='text/javaScript'>
document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/?max-results=&quot;+featured_numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=sliderposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script>                                                                                                                                
</div>
</div>
</b:if>

4. Save Theme! dan lihat hasilnya.

Nah, sangat mudah bukan. Anda bisa cek blog anda setelah melakukan langkah-langkah di atas. Kira-kira hasilnya akan seperti gambar berikut ini:

Cara Lainnya

1. Masuk ke dashboard blog anda dan klik pada menu "Theme" --> "Edit HTML"

2. Temukan kode (CTRL+F) <b:section class='main' id='main' showaddelement='no'>

3. Ganti dengan <b:section class='main' id='main' showaddelement='yes'> (hanya mengubah ini saja: showaddelement='no' jadi showaddelement='yes'

4. Jika Anda ingin mengatur Featured Post hanya dimunculkan di halaman depan, maka Anda tinggal tambahkan kode <b:if cond='data:blog.url == data:blog.homepageUrl'> tepat di atas kode  dan tambahkan juga kode penutup ini </b:if> tepat di bawah kode <b:include name='quickedit'/>. (Selengkapnya bisa anda baca DI SINI).

5. Save Theme!

Langkag 1 s.d. 5 diatas hanya untuk memunculkan kolom Gadget baru di atas Blog post. Sekarang kita lanjutkan:

6. Di dashboard blog anda klik "Layout". Nanti akan ada kolom "Add a Gadget" baru di atas kolom "Blog Posts"
7. Klik pada "Add a Gadget"--> Lalu pilih "HTML/Javascript"
8. Masukkan "Kode HTML/Javascript" untuk membuat featured post.

Contoh:

→ Jika anda ingin membuat Featured Image (hanya berupa gambar), maka anda tinggal masukkan kode <img src="LINK GAMBAR/FOTO">
*Silahkan anda ganti tulisan "LINK GAMBAR/FOTO" dengan URL Link gambar/foto yang ingin anda jadikan featured image.

→ Jika anda ingin membuat Featured Content Slider Post, Anda bisa ambil kodenya DI SINI. 17 lebih pilihan featured post telah disediakan di sana.

Demikianlah Cara Membuat Featured Post Sederhana. Semoga bermanfaat untuk anda semuanya. Jika masih ada yang belum jelas, silahkan anda bisa tanyakan dan kita diskusikan di kolom komentar dibawah in. Terimakasih! Good Luck!

Cara Memunculkan Kolom Komentar di Halaman Statis Blogspot

2017-04-11T11:21:00.000+08:00

MASALAH kolom komentar atau kotak komentar di halaman statis blog yang hilang/tdk muncul, bisa terjadi karena bawaan template yang anda gunakan. Meskipun sudah disetting "Bolehkan Komentar" atau "Allow" saat kita membuat halaman statis itu, tapi tetap saja tidak muncul.

Sebagian blogger memang sengaja untuk tidak memunculkan kolom komentar di halaman statis. Namun bagi anda yang ingin memunculkan kolom komentar di halaman statis dan mengalami masalah seperti di atas. Berikut ini Cara Memunculkan Kolom Komentar di Halaman Statis Blogspot. Tapi sebelumnya anda harus pastikan halaman statis tersebut sudah disetting "Izinkan Komentar" atau "Allow Comment" saat membuatnya... Jika sudah, simak caranya di bawah ini:

Cara Memunculkan Kolom Komentar di Halaman Statis

1. Masuk ke Dashboard blog
2. Klik Menu "Theme" > "Edit HTML"
3. Cari (CTRL+F) kode <b:if cond='data:blog.pageType == "item"'> di bagian kode seperti berikut ini:

* Ingat, Anda akan menemukan lebih dari satu kode <b:if cond='data:blog.pageType == "item"'> di template Anda. Perhatikan baik-baik, temukan yang benar-benar sama persis atau sangat mirip dengan yang di atas. Untuk lebih membantu, cirinya yaitu ada di bawah kode yang ada kode 'status message'-nya.

4. Ganti kode <b:if cond='data:blog.pageType == "item"'> dengan kode berikut ini:

<b:if cond='data:blog.pageType != "index"'>
<b:if cond='data:blog.pageType != "archive"'>
<b:if cond='data:blog.url != data:blog.homepageUrl'>

5. Kemudian Tambahkan dua kode penutup </b:if> tepat di atas kode:

<b:if cond='data:post.includeAd'> sehingga menjadi seperti ini:

</b:if></b:if></b:if>
<b:if cond='data:post.includeAd'>

6. Terakhir "SAVE THEME"!

Nah, Itulah Cara Memunculkan Kolom Komentar di Halaman Statis Blogspot, cukup mudah 'kan. Jika kolom komentar di halaman statis masih tetap saja tidak muncul, mungkin anda harus ganti template saja. Good Luck! and Happy Blogging!

Cara Membuat Password di Halaman Blog

2017-04-10T12:31:00.001+08:00

Membuat halaman blog yang terproteksi dengan password bisa anda terapkan dengan mudah di blog blogspot Anda. Memasang password untuk halaman tertentu di blog berguna jika materi/konten/isi dari halaman tersebut hanya diperuntukkan bagi pengunjung tertentu saja. Hanya dengan menambahkan kode tertentu di halaman statis (static page) maka jadilah halaman yang diproteksi oleh password (password protected page).

Bagi Anda yang membuka kursus online misalnya, memproteksi halaman blog dengan password dan memberikan password hanya untuk member/anggota kursus saja, sehingga materi kursus yang anda sediakan di blog hanya bisa di akses oleh member/anggota kursus Anda.

Nah, apakah anda tertarik untuk memproteksi halaman blog anda dengan password? Simak Cara Membuat Password di Halaman Blog, berikut ini:.

Cara Membuat Password di Halaman Blog Blogspot

1. Masuk ke Dashboard >> Pages >> New Pages
2. Isikan judul/nama halaman dan isi halamannya (konten).

* Kemudian anda klik publish dulu untuk mendapatkan "URL Link" dari halaman tersebut, karena Link tersebut akan anda isikan dalam script kode password nanti. Silahkan anda simpan URL Link di notepad untuk sementara waktu dan lanjutkan langkah berikut ini:

3. Klik "Edit" di halaman yang akan anda pasangkan kode password
4. Klik di Tab “HTML”
5. Letakkan kode berikut ini di PALING ATAS.

6. Silahkan anda ganti "TULIS PASSWORD DI SINI" dengan password sesuai keinginan anda
7. Dan ganti "URL LINK HALAMAN" dengan URL Link Halaman yang anda simpan di notepad sebelumnya.
7. Terakhir, klik Update!

Demikianlah Cara Membuat Password di Halaman Blog Blogsopt, cukup mudah bukan. Jika masih ada yang belum jelas, mari kita diskusikan di kolom komentar dibawah ini. Good Luck!

5 Kriteria Template Blog yang Baik

2017-04-10T01:23:00.000+08:00

TEMPLATE blog merupakan elemen yang sangat penting yang harus diperhatikan oleh seorang blogger. Karena penggunaan template blog yang baik dapat meningkatkan aliran pengunjung blog Anda. Oleh karena itu, sangat penting juga untuk mengetahui "Kriteria Template Blog yang Baik" itu seperti apa.

Selain konten yang berkualitas, tampilan/desain blog yang baik pastinya akan membuat para pengunjung betah berlama-lama browsing di blog Anda. Tapi jika tampilan/desain blog anda buruk dan sangat berat, bukan tidak mungkin pengunjung akan langsung kabur karena kesal menunggu loading blog anda yang sangat lama. Simak kriteria template blog yang dapat membuat pengunjung betah berikut ini:

5 Kriteria Template Blog yang Baik

1. Rapi, template blog yang rapi dan navigasi yang baik akan membuat pengunjung betah menelusuri blog anda. Karena blog yang tidak rapi bisa membingungkan pengunjung dan meninggalkan blog anda untuk mencari di blog lain.

2. User Friendly, blog yang enak dipandang oleh pengunjung (User), juga Navigasi Menu yang cukup memudahkan pengunjung mengeksplorasi / mencari tulisan yang dibutuhkan di blog anda. Tentunya hal ini mempengaruhi kenyamanan pengunjung blog anda.

3. Fast Loading, blog dengan template yang sederhana, bersih, ringan dan loadingnya cepat. Blog yang seperti inilah yang disukai pengunjung, bahkan disukai google juga sehingga blog anda lebih SEO di mata google.

Baca juga: Cara Menguji Kecepatan Loading blog

4. Responsive, tidak dapat dipungkiri bahwa saat ini pengguna seluler semakin meningkat. Jika blog Anda tidak responsive maka blog Anda akan tampil jelek dan tidak rapi ketika di buka dengan perangkat seluler.

5. SEO Friendly, template yang baik tentunya harus yang SEO Friendly agar mudah terindex oleh google dan mudah di temukan oleh para user/pengunjung di mesin pencari.

Nah, inilah beberapa Kriteria Template Blog yang Baik. Semoga bisa membantu anda untuk meningkatkan kinerja template blog anda ataupun menemukan template blog yang sesuai kriteria di atas. Good luck!

Cara Mengatur dan Menyesuaikan Tampilan Widget di Sidebar Blog

2017-04-08T23:16:00.001+08:00

Cara Mengatur dan Menyesuaikan Tampilan Widget di Sidebar Blog agar hanya tampil di Halaman Depan (Homepage) atau hanya di halaman postingan saja.

Untuk mempercepat loading homepage blog, salah satu caranya dengan mengurangi pemasangan widget (gadget) yang berlebihan di halaman depan. Namun, Bila Anda ingin menentukan widget tertentu hanya tampil di halaman depan atau tampil hanya di halaman postingan saja. Maka, Anda bisa melakukannya dengan menambahkan kode di template Anda.

Misalnya saja Anda ingin widget "Recent Post" hanya tampil di halaman postingan (tidak muncul di Homepage). Yaa, hal ini memang cukup efisien untuk mengurangi widget di halaman depan. Karena "Recent Post" sudah ada di main area halaman depan blog Anda.

Mengatur Tampilan Widget di Sidebar Blog

1. Widget Hanya Tampil di Homepage / Halaman Depan Saja

Silahkan Anda "Login" ke blogger dan masuk ke dashboard blog Anda.
Klik pada Menu "Theme" => "Edit HTML"
Klik "Jump To Widget" dan pilih widget yang ingin Anda atur/sesuaikan tampil atau tidaknya widget tersebut.
Untuk mengatur agar widget hanya tampil di halaman depan saja, maka tambahkan kode <b:if cond='data:blog.url == data:blog.homepageUrl'> tepat setelah "<b:includable id='main'>". Dan letakkan kode penutup ini </b:if> tepat sebelum "</b:includable>".

CONTONHNYA:

<b:widget id='HTML?' locked='false' title='IKLAN' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

SAVE Theme!

2. Widget Hanya Tampil di Halaman Postingan Saja

Silahkan Anda "Login" ke blogger dan masuk ke dashboard blog Anda.
Klik pada Menu "Theme" => "Edit HTML"
Klik "Jump To Widget" dan pilih widget yang ingin Anda atur/sesuaikan tampil atau tidaknya widget tersebut.
Untuk mengatur agar widget hanya tampil di halaman postingan saja, maka tambahkan kode <b:if cond='data:blog.pageType == "item"'> tepat setelah "<b:includable id='main'>". Dan letakkan kode penutup ini </b:if> tepat sebelum "</b:includable>".

CONTONHNYA:

<b:widget id='HTML?' locked='false' title='IKLAN' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

SAVE Theme!

Naah, Cukup mudah bukan. Cara diatas bisa anda gunakan untuk menampilkan lebih banyak widget di Halaman postingan daripada di homepage. Tapi jangan lupa juga, kebanyakan memasang widget akan membuat blog anda berat dan lama terbuka.

Demikian Cara Mengatur dan Menyesuaikan Tampilan Widget di Sidebar Blog. Jika masih ada yang belum jelas, mari kita diskusikan di kolom komentar dibawah ini. Good Luck!

Cara Ampuh Melindungi Artikel dari Copy Paste

2017-04-08T03:06:00.000+08:00

Kode Anti-Plagiat/Anti-Copas dengan Mematikan Fungsi Klik Kanan (Disable Right Click), Anti Ctrl+U, Anti Ctrl+P.

Tentunya Anda akan kesal sekali jika artikel yang susah payah Anda tulis di-copy paste seenaknya tanpa menyertakan link sumber. Oleh karena itu, saya akan berikan cara yang cukup ampuh untuk melindungi artikel / konten blog Anda dari para plagiat / copaser!

Banyak tutorial untuk melindungi atau memproteksi konten blog dari copaser yang di-share oleh para blogger. Disini saya akan berikan Cara Ampuh Melindungi Artikel dari Copy Paste.

Berikut ini adalah cara ampuh yang mudah Anda terapkan untuk mematikan klik kanan, Ctrl+P, dan Ctrl+U di blog Anda. Untuk perlindungan lengkap artikel-artikel blog yang sudah susah payah Anda buat dari para plagiat / copaser yang tanpa izin dan tidak menyertakan link sumber!

1. Cara Mematikan Fungsi Klik Kanan, Ctrl+P, Ctrl+U.

1. Klik Theme => Edit HTML
2. Cari kode <body> atau <body ...bla-bla-bla... >
3. Ganti kode <body> dengan kode dibawah ini:

Catatan:
Jika kode <body> ada tambahan kode yang lain, misalnya <body ...bla-bla-bla... >, maka tambahkan kode

oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false'

tempatkan kode tersebut tepat di belakang tulisan body, sehingga akan jadi seperti ini:

4. Save Template!

2. Mematikan Klik Kanan hanya di Posting Tertentu

Anti-Copy Paste hanya berlaku di postingan tertentu saja. Tidak di semua postingan blog.

Berikut caranya:

Klik tab HTML di postingan yang akan diproteksi.
Copy & paste kode berikut ini di awal atau di akhir postingan.

3. Mematikan Klik Kanan dan Select Text untuk semua postingan blog.

Jika Anda ingin menonaktifkan atau mematikan klik kanan dan select text untuk semua artikel atau konten blog Anda. Maka caranya adalah:
1. Buka Dashborad => klik pada menu Layout
2. Add Gadget di Sidebar Widget
3. Pilih HTML/Javascript
4. Copy & Paste kode di bawah ini di dalamnya:

<script src='demo-to-prevent-copy-paste-on-blogger_files/googleapis.js'></script><script type='text/javascript'> if(typeof document.onselectstart!="undefined" ) {document.onselectstart=new Function ("return false" ); } else{document.onmousedown=new Function ("return false" );document.onmouseup=new Function ("return false"); } </script>

Kerugian Memasang Kode Anti-Copas seperti diatas

Memasang kode anti-copas tidak serta merta akan menguntungkan Anda. Namun harus Anda ingat bahwa hal tersebut dapat membuat pengunjung menjadi jengkel pula dan kemungkinan besar blog Anda tidak akan dikunjungi lagi oleh pembaca (returning visitor).

Memasang kode anti-copy paste ini akan menurunkan pagerank, pageviews, bahkan trafik kunjungan. Mereka akan mengecap blog Anda tidak "User Friendly", meski maksud Anda baik, yakni menghindari para pencuri konten.

Selain itu, perlu Anda ketahui bahwa pemasangan kode seperti ini sangat mudah diakali. Pengguna/Pengunjung/Pembaca dapat mengakalinya dengan mematikan / disable Javascript di browser mereka, dan perlindungan anti-copas yang telah Anda pasang pun jadi sia-sia karena tidak berfungsi sama sekali!

JADI, Pemasangan anti-copas di blog hanya "memperlambat" proses upaya copy paste atau "pencurian" konten blog. Soalnya para plagiat atau copaser tetap saja masih bisa menembusnya dengan men-disable Javascript di browser mereka.

Naah, keputusan tetap ditangan Anda, apakah akan memasang Anti-copas atau tidak. Silahkan Anda yang tentukan sendiri. Jika masih ada yang belum jelas, mari kita diskusikan di kolom komentar dibawah ini. Happy Blogging!

Cara Membuat Related Post/Postingan Terkait di Blogspot

2016-02-07T20:26:00.000+08:00

Related Posts atau Postingan Terkait adalah navigasi yang sangat "User Friendly" dalam sebuah blog, karena mempermudah pengunjung untuk menemukan lebih banyak referensi dalam kategori yang sama di blog Anda.

Related Posts sangatlah penting dalam sebuah blog, karena selain sebagai internal link, navigasi ini juga akan sangat membantu untuk meningkatkan Page View blog Anda. Penempatan dan tampilan related posts yang cukup menggoda akan membuat pengunjung berlama-lama menelusuri blog Anda. Tentunya hal ini sangat bagus untuk menaikkan Page View!

Ada beberapa pilihan untuk Membuat Related Post/Postingan Terkait di Blogspot yang banyak dibagikan oleh para blogger lokal maupun mancanegara, caranya pun sangat mudah untuk Anda terapkan di blog Anda.

Disini akan saya berikan 3 Cara Membuat Related Post/Postingan Terkait di Blogspot yaitu dengan memasukkan kode-kode dibawah ini ke Template Blog Anda. Silahkan Anda simak baik-baik:

(* Pilih salah satu cara di bawah ini.)

CARA #1 Membuat Related Post/Postingan Terkait di Blogspot

1. Pertama "Login" ke blogger dan masuk ke dashboard blog Anda.
2. Di dashboard blog, Klik menu "Theme" --> Klik "Edit HTML"
3. Selanjutnya temukan kode <data:post.body/>
4. Letakkan kode berikut ini tepat di bawah kode <data:post.body/>
(*Jika terdapat dua atau lebih kode <data:post.body/> di template Anda, maka coba yang kedua atau ketiga. Pasti salah satunya akan berhasil!)

<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<div class='widget-content'>
<h3>Related Post</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>

5. "Save Theme"

CARA #2 Membuat Related Post/Postingan Terkait di Blogspot

1. Pertama "Login" ke blogger dan masuk ke dashboard blog Anda.
2. Di dashboard blog, Klik menu "Theme" --> Klik "Edit HTML"
3. Sekarang temukan kode </head>
4. Letakkan kode berikut ini di atas atau sebelum kode </head>

<style> #related-posts { float : left; width : 480px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; font-weight: bold; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight: bold; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("http://www.webaholic.co.in/other/bw.png") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://www.webaholic.co.in/other/related-posts-widget.js' type='text/javascript'/>

5. Selanjutnya temukan kode <data:post.body/>
6. Dan Letakkan kode berikut ini tepat di bawah <data:post.body/>

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>

7. "Save Theme"

CARA #3 Membuat Related Post/Postingan Terkait di Blogspot

5. Selanjutnya temukan kode <data:post.body/>
6. Letakkan kode berikut ini tepat di bawah <data:post.body/>

<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>

7. "Save Theme"

Demikianlah Cara Membuat Related Post/Postingan Terkait di Blogspot, sangat mudah bukan. Jika masih ada yang belum jelas, mari diskusikan di kolom komentar dibawah ini. Good Luck!

Cara Menguji Kecepatan Loading Blog

2016-02-07T16:57:00.000+08:00

Kecepatan Loading sebuah blog merupakan salah satu hal yang sangat perlu diperhatikan oleh pemilik blog, karena loading blog yang sangat lambat akan mengecewakan para pengunjung dan bukan hal yang tidak mungkin mereka langsung meninggalkan blog Anda sebelum terbuka sepenuhnya. Tentu saja hal ini sangat disayangkan bukan.

Selain itu, kecepatan loading suatu blog juga termasuk salah satu faktor yang cukup diperhitungkan di mesin pencari (search engine) Google. Jadi ini juga termasuk bagian dari tips SEO (Search Engine Optimization) dan dapat mempengaruhi posisi serp di mesin pencari.

Blog yang terbuka dengan cepat dan ringan tentunya akan lebih disukai para pengunjung, termasuk mesin pencari seperti Google. Oleh karena itu, Anda pasti ingin tahu secepat apakah loading blog Anda, atau mungkin menguji website atau blog lain untuk dijadikan refrensi template yang akan digunakan.

Disini saya akan berikan 2 cara yang sering digunakan oleh para blogger untuk menguji kecepatan loading suatu blog, yaitu dengan menggunakan situs "GTmetrix" dan "Google PageSpeed Insights". Keduanya merupakan situs yang sangat populer untuk menguji kecepatan suatu blog/website. saya pun sering menggunakan kedua situs tersebut untuk mengecek kecepatan loading blog saya.

1. Cara Menguji Kecepatan Loading Blog di Google PageSpeed Insights

Dengan menggunakan Google PageSpeed Insights milik google ini, Anda akan mendapatkan 2 hasil pengujian, yaitu:

Kecepatan situs versi mobile / seluler
Kecepatan situs versi dekstop

CARA Menggunakan Google PageSpeed Insights

1. Buka situs "Google PageSpeed Insights"
2. Masukkan "URL Blog/Website" dan klik "Analisis"
3. Tunggu beberapa saat hingga hasilnya muncul seperti gambar dibawah ini:

Penilaian yang diberikan antara 1 sampai dengan 100. Semakin tinggi nilai yang diperoleh maka akan semakin bagus di mata google. Ukuran untuk kecepatan loading yang baik setidaknya mendapatkan warna hijau atau mendapatkan nilai antara 85 sampai 100. Beberapa informasi yang dapat menghambat / memperlambat loading blog ditampilkan dalam tabel. Khususnya untuk versi seluler / mobile juga terdapat beberapa pemeriksaan pengalaman penggun, seperti: penggunaan ukuran font yang mudah dibaca, pengaturan ukuran konten terhadap area pandang, dan lain-lain.

Tool gratis milik google ini sangat berguna karena hasil pengujian akan memberikan informasi penting untuk meningkatkan kecepatan loading blog dan tentu saja sangat baik untuk index dan serp sebuah website di mesin pencari.

2. Cara Menguji Kecepatan Loading Blog di GTMetrix

GTMetrix memberikan informasi yang cukup detail seperti: waktu yang dibutuhkan untuk membuka halaman website/blog secara penuh (Page Load Time), ukuran total data dari suatu halaman website/blog (Total Page Size), detail mengenai requests / permintaan yang terdapat pada website/blog, dan masih banyak detail lainnya yang bisa anda dapatkan di GTMetrix. Anda pun bisa menggunakan fitur compare yang berfungsi untuk membandingkan antara website satu dengan yang lainnya. Dan masih banyak lagi fitur-fitur lainnya dari GTMetrix.

CARA menggunakan GTmetrix

1. Buka situs "GTMetrix"
2. Masukkan "URL Blog/Website" dan klik "Analize"
3. Tunggu hingga hasilnya muncul seperti gambar dibawah ini:

Itulah 2 cara yang populer digunakan untuk Menguji Kecepatan Loading Blog. Kecepatan loading blog dipengaruhi oleh server dan template yang digunakan. Jadi, disarankan untuk menggunakan template yang fast loading, ringan, jangan pakai domain gratisan, dan gunakanlah widget seperlunya. Jika masih ada yang belum jelas, mari kita diskusikan di kolom komentar dibawah ini. Good Luck!

Mengatasi Halaman Statis Yang Tidak Muncul Penuh

2016-02-06T20:33:00.000+08:00

Mengatasi Masalah Halaman Statis Yang Tidak Tampil Penuh atau Terpotong Sampai "Read More"

Untuk menghadapi masalah Halaman Statis (static page) yang tidak muncul penuh di blog, berikut ini adalah cara mengatasinya. CARA ini cukup mudah untuk Anda terapkan. Karena hanya menambahkan sedikit kode di template yang Anda gunakan.

Beberapa template mungkin mengalami error seperti ini. Isi daripada halaman (Page) hanya tampil sebagian saja dan terpotong sampai "Read more". Tapi ketika Anda coba klik di "Read more", tetap saja tidak berubah sama sekali! Lantas bagaimana cara mengatasinya?

Berikut Cara Mengatasi Halaman Statis Yang Tidak Muncul Penuh di blog:

1. Pertama Login ke Blogger --> Klik Dashboard Blog Anda.
2. Klik "Template" --> "Edit HTML"
3. Cari kode seperti dibawah ini (Tekan Ctrl + F untuk mempermudah pencarian):

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url' rel='nofollow'>Read More</a></span>
</b:if>

4. Selanjutnya tambahkan kode berikut ini:

<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<-- kode no. 3 -->
</b:if>

Sehingga hasilnya akan jadi seperti dibawah ini:

<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url' rel='nofollow'>Read More</a></span>
</b:if>
</b:if>

5. Terakhir Save Template!

Cukup mudah 'kan Cara Mengatasi Halaman Statis Yang Tidak Muncul Penuh pada blog. Jika masih ada yang belum jelas, mari kita diskusikan di kolom komentar dibawah ini! Good Luck...!

Cara Membuat dan Memasang Favicon di Blog

2016-02-06T00:41:00.000+08:00

Membuat dan Memasang Favicon di Blog merupakan salah satu hal mendasar yang dapat Anda lakukan untuk membuat blog Anda terlihat menarik dan berbeda dengan yang lainnya.

apa itu Favicon?

Beberapa sebutan lain untuk favicon adalah bookmark icon, website icon, shortcut icon, atau URL icon. Ketika Anda membuat blog di blogspot, secara default blog Anda akan menggunakan favicon bawaan dari blogspot yang berupa logo “B”.

Favorite Icon atau yang sering di sebut Favicon adalah sebuah logo/gambar icon identitas dari sebuah blog atau website yang muncul di tab browser. Contohnya seperti gambar dibawah ini:

favicon menjadi ciri khas sebuah website/blog. Jadi, buatlah favicon yang unik dan menjadi ciri khas untuk blog Anda. Untuk membuat dan memasang favicon di blog sangatlah mudah. Silahkan Anda ikuti cara dibawah ini:

1. Pertama Anda siapkan terlebih dahulu logo/gambar yang akan digunakan sebagai favicon blog Anda. Pastikan ukuran gambar tidak lebih dari 100KB dengan dimensi lebar dan tinggi yang sama, misalnya 100 pixels x 100 pixels. Untuk format gambar, Anda bisa menggunkan format gambar seperti, ".PNG", ".ICO", atau ".JPG".

Anda bisa membuat gambar Favicon secara manual. Saya biasanya menggunakan software seperti CorelDraw, Photoshop, atau GIMP. Selain itu Anda juga bisa menggunakan Favicon Generator, dengan mengetikkan kata kunci "Favicon Generator" di pencarian google.

2. Setelah gambar favicon Anda sudah siap, sekarang silakan Anda "login" ke blogger dan masuk ke dashboard blog.

3. Selanjutnya, di dashboard blog Anda pilih menu “Layout” atau "Tata Letak" untuk bahasa indonesia, kemudian Anda Klik “Edit” pada tab Favicon seperti gambar di bawah ini:

4. Akan muncul jendela baru untuk meng-upload gambar yang akan dijadikan favicon. Langsung saja Anda klik pada tombol "Browse" dan pilih gambar favicon yg telah disiapkan sebelumnya. Tunggu beberapa saat sampai proses upload selesai dan preview telah muncul, seperti gambar berikut ini:

5. Terakhir klik "Save" atau "Simpan".

Sampai disini Anda telah berhasil memasang favicon di blog Anda. Tapi kemungkinan besar ketika di cek, faviconnya belum berubah sama sekali (masih menggunakan logo "B" dari blogger). Hal ini wajar terjadi karena pengaruh Cache Browser Anda.

Jika ingin melihat perubahannya, Anda harus hapus cache browser terlebih dahulu. Caranya, klik pada browser Anda "Menu" => "History" => "Clear Recent History" atau dengan menekan tombol keyboard "Ctrl+Shift+Del". Selanjutnya Pada tab "Time Range to Clear" Anda pilih "Everything" dan klik "Clear Now". Kemudian silahkan cek blog Anda.

Itulah Cara Simple Membuat dan Memasang Favicon di Blog, cukup mudah bukan. Jika masih ada yang belum jelas, mari diskusikan di kolom komentar dibawah ini. Good Luck!

Panduan Membuat Toko Online Dengan Blogspot

2016-02-05T10:18:00.000+08:00

Membuat Toko Online dengan Blogspot. Apakah bisa? Ya, kenapa tidak! BLOG yang Anda buat di blogger.com tentu saja bisa Anda ubah menjadi toko online. Caranya cukup mudah, hanya dengan mengganti template dan mengisi konten Anda dengan postingan produk-produk ataupun jasa yang Anda tawarkan.

Update: Cara Membuat Toko Online dengan Blogspot.

Awalnya sebuah blog ditujukan untuk media ekspresi dan berbagi. Namun, seiring waktu blogging berkembang menjadi sebuah portal untuk menjalankan bisnis online, marketing online, maupun berjualan online (toko online). Hal ini tentunya akan semakin mempermudah penjual dan pembeli untuk bertransaksi. Namun, sebagian orang dengan niat yang buruk memanfaatkannya untuk menipu orang lain.

Banyak sekali website yang menyediakan template blogspot gratis untuk Toko Online dengan Tampilan, desain, dan fitur-fitur yang modern dan navigasi yang keren untuk memudahkan para pelanggan menemukan barang yang mereka butuhkan. Silahkan Anda bisa ketikkan "Template toko online" di pencarian Google, lalu download salah satu yang Anda sukai. Setelah siap, ikuti langkah dibawah ini:

Berikut Cara Membuat Toko Online di Blogspot

Bagi yang baru pertamakali membuat blog di blogspot, simak baik-baik panduan membuat blog untuk toko online berikut ini:

1. Silahkan Buka www.blogger.com.
2. Isikan "formulir pendaftaran" yang disediakan dengan data Anda yang asli dan benar. jangan gunakan nama palsu atau data palsu. Tenang, rahasia data Anda dijamin aman oleh Google sebagai pemilik dari blogger.com.
3. Selanjutnya ikuti terus petunjuknya, sampai Anda menemukan kata "Buat Blog" (Create a Blog).
4. Lalu isikan "Judul Blog" dan "Alamat Blog" sesuai keinginan anda.
5. Pilih Template "Simple" dan klik "Create blog!"

Sampai disini blog baru Anda sudah jadi, Selanjutnya memasang template Toko Online yang sudah didownload sebelumnya.

Cara Memasang Template Blogspot untuk Toko Online
6. jika file template yang Anda download berupa file .zip, maka silahkan "Extract" dulu, karena file yang harus Anda upload berupa .xml
7. Selanjutnya penggantian template dengan cara, Buka Dashboard Blog > klik "Theme" > klik "Back Up/Restore" (Cadangkan/Pulihkan)
8. Klik Browse dan pilih file .xml yang sudah Anda Extract sebelumnya.
9. Jika sudah, Klik "Upload".

Sampai disini Anda telah berhasil memasang template toko online. Anda perlu melakukan sedikit pengaturan untuk melengkapi tampilan blog Anda. Silahkan Klik "Edit HTML" dan isi Meta Tags, Footer, Menu, dan sebagainya. Keterangan lengkap biasanya ada bersama dengan file yang Anda extract atau di website/blog tempat anda mendownload template.

Selamat sekarang Blog Untuk Toko Online Anda sudah siap. Tinggal diisi dengan konten dari produk-produk yang Anda jual. Kalo masih ada yang belum jelas, mari diskusikan di kolom komentar dibawah. Terimakasih!

Cara Memasang Iklan Adsense di Awal dan Akhir Postingan Blog

2016-02-05T09:59:00.000+08:00

Penempatan Iklan Adsense di Dalam Postingan Blog merupakan salah satu cara meningkatkan penghasilan di Google Adsense. Baik itu di awal postingan, di tengah postingan, maupun di akhir postingan.

Terkadang posisi terbaik untuk memasang iklan Adsense tidaklah selalu berada di dalam postingan. Karena harus disesuaikan dengan template yang Anda gunakan. Beberapa template mungkin bagusnya menempatkan iklan di kanan atas (Header) dan sidebar.

Tapi biar bagaimanapun, sebagian besar blogger masih yakin bahwa posisi terbaik untuk memasang iklan Adsense adalah di dalam postingan. Hanya saja, sering kali terjadi error ketika ingin memasang kode iklan di template, karena script iklan Adsense tidak serta-merta dapat langsung diterima oleh HTML blogspot.

Oleh karena itu, di postingan kali ini, kita akan bahas cara memasang iklan Adsense di awal dan akhir postingan. Tapi sebelum itu, Anda harus memparse script iklan adsense Anda terlebih dahulu. Caranya, copy script iklan Adsense Anda lalu paste di situs blogcrowds.

Parse Iklan Disini

Melakukan parse ini sama sekali tidak merubah struktur pada iklan Anda. parse ini berfungsi untuk mengkonversinya dalam bahasa pemerograman javascript agar dapat diterima oleh template. Dan memparse script iklan adsense sama sekali tidak melanggar aturan Google Adsense.

Berikut ini Cara Memasang Iklan Adsense di Awal Postingan

1. Siapkan kode script iklan adsense yang sudah Anda parse.
3. Login ke Blogger > pilih "Template" > Edit HTML
4. Tekan Ctrl+F untuk mencari kode <data:post.body/>
5. Copykan kode HTML di bawah ini tepat di atas <data:post.body/>

6. Ganti <...Script Iklan Adsense hasil Parse di sebelah kiri...> dengan script iklan adsense yang sudah Anda parse tadi.

7. Jika Anda menemukan kode <data:post.body/> lebih dari satu di template yang Anda gunakan, coba kode yang pertama, jika tidak berhasil coba yang kedua, dan seterusnya. Pasti akan berhasil salah satunya.

8. Save Template!

Cara Memasang Iklan Adsense di Akhir Postingan

Sementara untuk memasang iklan Adense di akhir postingan blog, caranya tidak jauh berbeda dengan cara yang pertama tadi. Perbedaannya adalah kode HTML seperti yang di atas, Anda letakkan tepat di bawah kode <data:post.body/>.

Untuk lebih jelasnya Anda bisa ikuti lagi langkah berikut ini:

1. Siapkan kode script iklan adsense yang sudah Anda parse.
3. Login ke Blogger > pilih "Template" > Edit HTML
4. Tekan Ctrl+F untuk mencari kode <data:post.body/>
5. Copykan kode HTML di bawah ini tepat di bawah <data:post.body/>

6. Ganti <...Script Iklan Adsense hasil Parse di sebelah kiri...> dengan script iklan adsense yang sudah Anda parse tadi.

7. Save Template!

Demikianlah Cara Memasang Iklan Adsense di Awal dan Akhir Postingan Blog. Jika masih ada yang belum jelas, mari kita diskusikan di kolom komentar dibawah ini. Good Luck!

Cara Memasang Breadcrumb Keren di Blog

2016-02-04T20:24:00.000+08:00

CARA Membuat, Menampilkan, atau Memasang breadcrumbs yang keren di blog tidaklah begitu sulit. Bagi Anda yang template blognya belum dilengkapi breadcrumbs, Anda bisa mengikuti langkah-langkah memasang kodenya dibawah ini. Namun bagi yang sudah ada, tentu saja tidak perlu lagi memasang kodenya.

Breadcrumb adalah salah satu "trik blogging" yang keberadaannya cukup penting karena menjadi navigasi yang berisikan kategori atau label postingan dan biasanya diawali dengan link menuju "Home".

Bagi Anda yang belum tahu, yang mana sih breadcrumb itu? Jadi breadcrumb itu adalah navigasi blog berupa "judul kecil" yang biasanya terletak di atas judul postingan blog. Biasanya breadcrumb ini membentuk susunan "Home » Label/Kategori » Judul Postingan".

Contohnya? Anda bisa lihat navigasi berupa "judul kecil" di atas judul postingan yang sedang Anda baca ini. Breadcrumb-nya adalah: Home / Blogging / Desain Blog / Cara Memasang Breadcrumb Keren di Blog

Dengan keberadaan breadcrumb dalam sebuah blog, maka akan memudahkan pengunjung/pembaca untuk kembali ke halaman depan (tinggal klik pada "Home") atau bisa juga menemukan postingan lainnya dengan label yang sama (tinggal klik "Blogging" atau "Desain Blog".

Cara Membuat/Memasang Breadcrumb di Blog

Inilah cara terbaik untuk memasang breadcrumbs di blog. Kode-kode dibawah ini dari Maskolis, dijamin deh kode berikut tidak akan membuat breadcrumbs menggantikan Permalink postingan blog Anda di pencarian google.

1. Klik "Template" > "Edit HTML"
3. Cari (Tekan tombol Ctrl+F) kode ]]></b:skin>
4. Copy + Paste kode berikut ini tepat sebelum kode ]]></b:skin>

.breadcrumbs{ padding:5px 5px 5px 0; margin:0;font-size:90%;
line-height:1.4em; border-bottom:1px dotted #ccc}

5. Cari kode <div class='post hentry'> dan Copas kode berikut ini tepat setelahnya:

<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/>
<b:if cond='data:blog.pageType == "item"'> <div class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> » <b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'>
<data:label.name/></a> <b:if cond='data:label.isLast != "true"'> , </b:if> </b:loop>
</b:if> » <data:post.title/> </div> </b:if> </b:if>

6. SAVE Template!

Cukup Mudah bukan cara memasang breadcrumb di Blog? Jika cara di atas belum berhasil, coba cara alternatif berikut ini.

Cara Alternatif Memasang Breadcrumb di Blog

1. Letakkan kode di bawah ini tepat di atas kode ]]></b:skin>

.breadcrumbs {padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:85%; line-height: 1.4em; border-bottom:3px double #e6e4e3;}

2. Lalu cari dan ganti kode <b:includable id='main' var='top'> dengan kode di bawah ini

<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>

<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
» <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:loop>
» <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>

<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == ""'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>

3. SAVE Template!

Kalo masih gak muncul-muncul juga breadcrumb-nya. Coba lagi nih, katanya sih Breadcrumb yang SEO Friendly.

Breadcrumb Blogspot SEO Friendly

1. Taruh kode berikut ini di atas kode ]]></b:skin>

.breadcrumbs{padding:0px 5px 5px 0;margin-bottom:20px;margin-top:0px;font-size:11px;color:#5B5B5B;border-bottom:1px dotted #bbb;}

2. Cari kode <b:includable id='main' var='top'> dan ganti dengan kode berikut ini:

Nah, Itulah Cara Memasang Breadcrumb di Blog. Tapi, pentingkah keberadaan breadcrumb bagi SEO Blog? Nanti akan dibahas di postingan berikutnya. Bila postingan ini bermanfaat, jangan lupa Like dan Bagikan ke teman Anda.

Terimakasih!

Cara Mengatasi Tidak Bisa Klik Kanan Pada Artikel Blog

2016-02-03T00:33:00.000+08:00

Cara Mengatasi Tidak Bisa Klik Kanan Pada Artikel Blog - Bagi pelajar ataupun mahasiswa yang sering mencari referensi di internet untuk menyelesaikan tugas sekolah/kampus, pasti pernah menemukan blog/website yang tidak memperbolehkan klik kanan mouse dengan tujuan agar isi posting atau konten yang mereka sediakan tidak dapat di copas. Tentu saja hal ini sangatlah menjengkelkan, karena akan memperlambat dalam menyelesaikan tugas.

Beberapa blog/website memasang java script untuk men-disable klik kanan (disable right click) pada blog/websitenya, agar artikel atau konten blog mereka tidak di curi. Namun itu bukanlah cara ampuh untuk menghindari pencurian konten. Karena meskipun tidak bisa klik kanan konten mereka dapat di copy dan disimpan dengan cara berikut ini:

Cara mengcopy atau menyimpan artikel yang tidak bisa klik kanan:

Dengan Menekan Tombol Ctrl+C
Sorot atau blok artikel yang ingin Anda copy, kemudian tekan tombol Ctrl+C dan pastekan di MS. Word atau Notepad. Tapi, jika website/blog tersebut menggunakan script sehingga tidak bisa melakukan sorot/blok pada artikel, maka coba cara dibawah ini.

Dengan Menekan Tombol Ctrl+P
Cara yang cukup mudah untuk meng-copas blog yang di-disable/menon-aktifkan klik kanan adalah dengan menekan CTRL+P (Print), kemudian "Select All" artikel yang muncul dan pastekan di MS. Word atau Notepad.

Menggunakan tombol Print Screen
Silahkan tekan tombol Print Screen pada keyboard Anda, lalu pastekan dengan menggunakan program Pain brush atau yang populer menggunakan adobe Photoshop dan simpan file dalam berbentuk ".tif". Dengan memanfaatkan fasiltas menu Recognize text using OCR, kemudian setelah menjadi teks Anda bisa gunakan menu Send text to word.

Menyimpan Artikel Dalam Bentuk File HTML
Caranya pada browser, Anda klik menu file, Save Page As. Setelah tersimpan di file komputer, Anda dapat membukannya secara off line dan mengcopynya seperti biasa

Disable/Non-aktifkan JavaScript
Semua browser mempunyai fungsi ini. Silakan Anda bisa lakukan eksperimen untuk mencari dimana letak menu untuk Disable JavaScript, karena setiap browser berbeda letaknya. Simak sedikit ulasan dibawah ini:

→ Tidak Bisa Klik Kanan di Mozilla FireFox

Di menu Anda Klik Tools-> Options
Anda Pilih Content Tab
Lalu hilangkan tanda centang pada "Enable Java Script"
Klik OK

→ Tidak Bisa Klik Kanan di Google Chrome

Di menu Anda Klik Tools > Options
Anda Pilih Tab Under The Hood > Klik Content Setting
Lihat pada bagian Java Script, disana ada 2 pilihan. Anda Pilih pada "Do not allow any site to run JavaScript"

→ Tidak Bisa Klik Kanan di Internet Exploler

Klik Tools pada menu navigasi –> Internet Options.
Pilih pada Security Tab –> Custom Level
Scroll kebawah sampai Anda menemukan “Active Scripting” dan Klik “Disable”
OK

Itulah beberapa cara yang bisa Anda lakukan untuk Mengatasi Tidak Bisa Klik Kanan Pada Artikel Website/Blog. Jika postingan ini bermanfaat, jangan lupa Like dan Bagikan ke teman Anda. Terimakasih.

Mulai Menulis di Blog, Miliki Niat dan Tekad yang Kuat!

2016-02-01T18:30:00.000+08:00

Sebagian orang beranggapan menulis adalah hal yang cukup sulit. Yah! Bila kita tidak pernah punya niat untuk mulai menulis, maka tentunya itu akan menjadi sulit. Sebenarnya menulis itu cukup mudah dan akan menyenangkan bila kita sering melakukannya. Syarat pertama menjadi penulis ialah:

"Memiliki Niat dan Tekad yang Kuat!"

Ya, "Niat dan Tekad" yang kuat sangatlah penting agar Anda tidak berhenti di tengah jalan nantinya. Istilahnya kerennya... willingness to write...!

Dengan adanya Niat dan Tekad yang kuat, maka Anda sudah mempunyai motivasi. Motivasi itu akan memunculkan dorongan pada diri Anda untuk segera beraksi: menulis!
Nah, ketika Anda sudah siap untuk menulis, mungkin muncul pertanyaan "Nulis apa, ya?". Anda bisa menulis tentang apa saja, misalnya, hobi Anda, keinginan Anda, kegundahan atau kegembiraan Anda, pengalaman hidup Anda.... atau apa saja yang bisa ditulis dan pantas untuk dipublikasikan.

Bagi sebagian penulis profesional sering kali meremehkan para blogger, terutama blogger pemula. Karena menurutnya kebanyakan blog memiliki gaya penulisan yang kasual dan materi yang tidak dapat diprediksi atau membahas berbagai macam topik. Namun, blog-blog terbaik mulai membuktikan bahwa penulis yang awam tentang tanda baca dan ejaan sekalipun mampu menarik perhatian banyak orang dan menghibur pembacanya.

Membuat blog merupakan sarana terbaik untuk menulis saat ini. Banyak penulis pemula diluar sana yang tidak bisa meneruskan usahanya menjadi penulis karena putus asa lantaran tulisannya selalu ditolak oleh media atau penerbit!
Dengan menjadi penulis di blog, Anda bisa menentukan sendiri tulisan Anda ingin dipublikasikan atau tidak. Selain memberikan manfaat bagi banyak orang melalui tulisan-tulisan, Anda pun bisa menghasilkan pundi-pundi dollar dengan menjadi publisher. Ketika blog Anda mulai ramai pengunjung, maka para pengiklan pun dengan senang hati mendatangi Anda untuk beriklan di blog Anda.

Jadi, Ayo Mulai Menulis di Blog!!! Ceritakan pada seluruh dunia apa yang Anda alami atau rasakan dalam kehidupan ini. Bagikan pengetahuan dan pengalaman Anda kepada seluruh dunia. Mungkin saja, ide-ide Anda nantinya akan dapat menginspirasi dunia dan bisa membuat perubahan. Seperti kutipan dalam bahasa Inggris "Change the world with words". Artinya "Mengubah dunia dengan kata-kata". So, Ayo menulis! Ayo buat blogmu!!!

Demikian tulisan pertama di blog ini, semoga bermanfaat dan jadi penyemangat untuk mulai ngeblog khususya bagi saya dan umumnya para pengunjung/pembaca. Bila Anda suka dengan artikel ini jangan lupa like dan bagikan ke teman Anda. Terimakasih.