Cara Membuat Link Di Komentar Blog

Cara Membuat Link Di Komentar Blog  -  Trik ini mungkin sudah banyak para blogger yang tau namun bagi pemula tentu sangat membantu dan di cari" hehe...
Dalam hal ini sering kita jumpai Blogger yang meninggalkan alamat web nya di kotak komentar dengan cara menuliskan Text URL tersebut. Ada juga yg memberikan link langsung sehingga apabila link itu di klik akan langsung menuju blog yang dituju nah yang saya bahas kali ini adalah tentang bagaimana caranya membuat link text langsung  .
Contohnya seperti ini :



Dengan menaruh link seperti diatas, tentunya akan sangat mudah bagi orang lain yang ingin mengunjungi blog kita lewat kotak komentar itu tanpa harus mengkopy anchor text nya jika kita meninggalkan Anchor text URL saja.
Langsung saja yah untuk langkah langkahnya :
Copy code dibawah dan letakkan di kotak komentar :

<a href="http://blogzafar.blogspot.com/2013/05/cara-membuat-link-di-komentar-blog.html">Cara Membuat Link Di Komentar Blog</a>

Maka hasilnya akan  terlihat seperti ini : Cara Membuat Link Di Komentar Blog
Contoh :
My Blog :

<a href="http://blogzafar.blogspot.com/2013/04/cara-mudah-mencari-kode-template-di.html">Cara Mudah Mencari Kode Template di Menu Edit HTML Baru</a>

Maka jadinya seperti gambar diatas tadi atau di bawah ini.

Cara Mudah Mencari Kode Template di Menu Edit HTML Baru

Anda juga bisa menambahkan ketebalan huruf dengan menambahkan <b> Kode diatas </b>
Dan masih banyak tag lagi yang bisa anda gunakan.
Semoga bisa membantu :)

Continue Reading

Cara Mengatasi Pesan Komentar Yang Berada Dibawah

Kali ini saya ingin memberikan trik
cara mengatasi pesan komentar yang jatuh berada dibawah formulir komentar.

masalah tersebut mungkin masih banyak dialami para blogger,
Mungkin bukan masalah besar namun tentunya ditinjau dari tata letak desain akan nampak ganjil dan kurang rapi.
Untuk anda yang mengalami masalah ini, silahkan ikuti langkah-langkah cara mengatasi masalah pesan komentar yang jatuh dibawah form komentar berikut:

• Setelah login ke akun anda
• Pada dasbor  Klik Edit HTML ---> karna tampilan edit htmlnya baru yang sudah tidak tersedia centang Expand Widget Templates maka kini untuk lebih cepat mencari kodenya lihat di Cara Mudah Mencari Kode Template di Menu Edit HTML Baru
• Klikk Ctrl+F dan cari kode  berikut ini: 

Lihat Code

<b:includable id='threaded-comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<b:if cond='data:mobile'>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
<b:else/>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
</b:if>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
</script>
</div>
</b:includable>

Lalu hapus semua kode berawal dari kode <b:includable id='threaded-comment-form' var='post'> sampai </b:includable> selanjutnya ganti dengan kode dibawah ini: 

Lihat Code

<b:includable id='threaded-comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<b:if cond='data:mobile'>
<div id='form-wrapper'>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
</div>
<b:else/>
<div id='form-wrapper'>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
</div>
</b:if>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
</script>
</div>
</b:includable>

• Selanjutnya cari kode berikut ini: 

 document.getElementById(domId).insertBefore(replybox, null);

•  Ganti dengan kode berikut ini:

 document.getElementById(domId).insertBefore(document.getElementById('form-wrapper'), null);

• Simpan template dan lihat hasilnya diblog anda.

Demikian tutorial kali ini. Semoga dapat menjadi solusi untuk masalah pesan komentar yang jatuh dibawah formulir komentar pada blog anda.

sumber:http://www.tipstrikblogging.com

Continue Reading

Cara Mudah Mencari Kode Template di Menu Edit HTML Baru

Cara Mudah Mencari Kode Template di Menu Edit HTML Baru - Sebelum adanya perubahan pada tampilan menu edit HTML Blogger, saya sudah menjelaskan cara mencari kode template yang dengan mudah bisa kita temukan hanya dengan melakukan CTRL+F pada keyboard dan memasukkan kode yang dicari kedalam kolom pencarian yang berada di pojok kiri bawah dangan mencentang Expand Template Widget yang akan memunculkan semua kode template, sehingga dari sini kita bisa menemukan kode yang di cari.

Namun tidak demikian dengan tampilan menu edit HTML dalam template blogger, saat kita mencari kode template, fitur centang Expand Template Widget sudah ditiadakan sehingga mau tidak mau kita harus mencari cara termudah dalam mencari kode template yang kita inginkan.
Nah bagi yang belum tau Berikut panduannya... yg dah tau cicing tong gandeng hehe...

1. Tentukan terlebih dahulu kode yang ingin di cari, sebagai contoh saya akan mencari kode <data:post.body/>
2. Tekan tombol CTRL+F pada keyboard laptop anda
3. Muncul kolom Search di pojok kanan atas
4. Masukkan kata kunci kode didalam kolom tersebut, contoh <data:post.body/>
5. Tekan Enter  pada keyboard laptop anda

Kode ditemukan!...... mudah kaaan kalo dah tau hehe....
Semoga membantu

trima kasih

Continue Reading

Cara Membuat Efek Lipatan Kertas Di Ujung Blog

Cara Membuat Efek Lipatan Kertas Di Ujung Blog - Setelah saya berhasil dengan apa yg di inginkan, membuat efek lipatan kertas pada ujung kanan blog, 
yang menurut saya agak lumayan bikin pusing  juga

Setelah berkali-kali mencoba merubah kode java scriptnya, akhirnya selesai juga, dan lihat hasilnya di ujung kanan blog siti, {sedikit pamer, heheheheee,, } ga apa" yaaah

Bagai mana....! ada yang berminat untuk membuat lipatan kertas pada ujung blog seperti blog
Tips Trik Blog {tenag aja yang saya bagi tidak ada foto jelek saya ko heheheheee,,, }
silakan ikuti lankah-langkah berikut ini ya :

1. Silahkan Login ke akun blogger anda.
2. Lalu masuk ke design Template, klik Edit HTML
3. Seperti Biasa Centang Expand Template Widget

4. Kemudian cari kode berikut </body>

5. Setelah ketemu silakan Sobat copy dan letakkan kode di bawah ini tepat di atas kode  </body>

<script type='text/javascript'>var tujuan =&#39;http://Alamat Url Feeds Sobat&#39;</script>

<script src='http://petir-project.googlecode.com/files/ktb4.js' type='text/javascript'/>

 6. Coba sobat pertinjau terlebih dahulu (Sekiranya sudah yakin baru di save)

Keterangan:

• Kode warna hijau: ganti dengan URL Feeds anda
• Kode warna biru: ganti apabila anda ingin mengganti gambar sesuai selera ea.

Ikuti langkah-langkah berikut ini bila ingin mengganti gambarnya.

Bagi sobat yang ingin mengganti gambarnya silakan download dulu scriptnya disini.

• Setelah selesai download silakan buka script tersebut dengan Notepad.

Untuk merubah gambar yang berukuran kecil (gambar saat lipatan tertutup) anda cari url berikut dalam text kalo ga salah ada di bagian atas dan silakan ubah dengan url gambar sobat:

http://petir-project.googlecode.com/files/fedkcl.png 

(Upload gambar di code.google.com atau situs upload lainya untuk mendapatkan URL gambar)

• Untuk merubah gambar yang berukuran besar (gambar saat lipatan terbuka) ubah url berikut dengan url gambar anda:

http://petir-project.googlecode.com/files/feed.png

•  Setelah selesai merubah kode URL gambar tersebut... Save Text, selanjutnya silakan anda upload text tersebut dan ganti URL http://petir-project.googlecode.com/files/ktb4.js dengan URL hasil upload  tadi.

NB: sedikit saran apabila sobat ingin merubah gambar, sebaiknya ukuran gambar harus sesuai dengan gambar semula untuk hasil yang lebih baik.

Selamat mencoba.... dan jangan lupa like nya yaaaaa  ^_~

http://zuazz.blogspot.com

Continue Reading

Cara Membuat Artikel Terkait (Related Post) Di Bawah Postingan

Cara Membuat Artikel Terkait (Related Post) Di Bawah Postingan -  Dengan adanya related post atau artikel terkait di setiap postingan, tentu saja ini akan memberikan backlink kepada posting yang lama dan visitor bisa mengunjungi postingan tersebut walaupun sudah lama dipublish. Cara Membuat Related Post/Postingan Terkait? Silahkan baca step-step nya Di Bawah:

1. Login ke Blogger.com --> Design --> Edit HTML
2. Lalu tandai kotak kecil Expand Widget
3. Lalu cari kode <data:post.body/> jika menemukan banyak kode tersebut, gunakan kode yang ke-2
4. Copy-paste kode berikut di bawah kode <data:post.body/>

Lihat Code

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p style='font-style:bold;'>ARTIKEL TERKAIT:</p>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:150px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 15;
maxNumberOfPostsPerLabel = 50;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
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 &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
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 = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type='text/javascript'>RelPost();</script>
</div>
</b:if>

5. Kemudian cari kode ]]></b:skin>
6. Copy-paste code CSS berikut ini tepat diatasnya

Lihat Code

.rbbox{border: 1px solid #000000;padding: 5px;
background-color: #F2F2F2;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #EFFBEF;}
.rbbox ul li {
display : block;
background : url(http://i1237.photobucket.com/albums/ff469/indolaron/icon/007.png) no-repeat 0px 0;
margin-left : -10px;
padding-top : 0;
padding-right : 0px;
padding-bottom : 1px;
padding-left : 20px;
margin-bottom : 5px;
line-height : 1em;
border-bottom:1px dotted #cccccc;}

 Terakhir klik Save/Simpan
KETERANGAN:
*ARTIKEL TERKAIT,bisa Anda ganti sesuai keinginan...misal:Related Post,Baca Juga,dll
*maxNumberOfPostsPerLabel = 50; adalah jumlah posting atau artikel terkait yang ingin di tampilkan *maxNumberOfLabels = 3; adalah jumlah label terkait yang ingin ditampilkan
*background-color: #F2F2F2; adalah warna background kotakan(bisa anda ganti sesuai keinginan)
*background-color: #EFFBEF; adalah warna background waktu disorot kursor(bisa diganti sesuai keinginan)
*http://i1237.photobucket.com/albums/ff469/indolaron/icon/007.png adalah icon didepan link(bisa diganti sesuai keinginan,usahaka size gambarnya kecil)
Contoh hasilnya:

 Catatan: karena semua template berbeda-beda maka jangan salahkan saya yah kalo ga berhasil yang jelas cara ini sudah saya praktekan dan berhasil sesuai gambar di atas atau di dalam blog ini

Continue Reading

Cara menambah gadget di bawah header Blog

Cara menambah gadget di bawah header Blog -  selain menambah gadget di halaman sidebar ataupun bagian bawah kita juga bisa menambah gadget/widget di bawah ataupun di atas blog salah satunya adalah bagaimana caranya menambah gadget di bawah header ?

Contoh gadget di bawah header  tampilannya seperti ini

Buat sahabat  yang ingin menambahkan gadget di bawah header silakan ikuti langkah langkah berikut ini :

• Masuk ke blogger
• Pilih Template
• Klik Edit HTML
• Klik Lanjutkan
• Centang kotak Expand Template Widget
• Cari kode di bawah ini di dalam template sahabat gunakan Ctrl + F untuk mempermudah pencarian

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

• Nah jika sudah ketemu kode seperti di atas silakan sahabat ganti dengan kode di bawah in

 <b:section class='header' id='header' preferred='yes'>

• Klik pratinjau dahulu untuk mencegah hal hal yang tidak diinginkan
• Jika sudah ok lanjut klik simpan template
• Selesai

terima kasih dan selamat mencoba.

Continue Reading

Cara Membuat Halaman Page Baru Di Blog

Cara Membuat Halaman Page Baru Di Blog 

Sama seperti ketika membuat artikel, membuat halaman blog juga tidak sulit. Jadi, jika anda terbiasa menulis artikel di Ms.Word, anda pasti bisa menulis artikel di blog. Jika anda bisa menulis artikel di blog, anda juga bisa membuat halaman blog dan mengisinya dengan artikel yang di inginkan. ok 

Contohnya seperti gambar berikut:

Halaman blog tidak hanya bisa di isi oleh tulisan saja, apapun bisa anda masukkan atau anda pasang di halaman blog tersebut. Seperti gambar, musik, Daftar isi Dll bahkan jika anda memiliki toko online, anda bisa membuatnya disana. 

Berikut panduan cara membuat halaman blog

• Masuk ke akun blogger anda
• Pilih menu Laman yang ada disebelah kiri dashboard blogger dan pilih Laman baru lalu klik Laman kosong

•  Isi Judul halaman (page) dan artikelnya sesuai tanda panah gambar di bawah. Isi dengan sesuatu yg di butuhkan setelah selesai klik publiskan

• Ubah pil“Jangan tampilkan” dengan pilihan “Tab atas”. Lalu klik Tombol “Simpan Pengaturan”.

Pada menu ini, ada 3 opsi yaitu;

trima kasih ;)

• Tab atas
  Merupakan pengaturan standart dari blogger yang secara otomatis akan tampil setiap kali anda membuat halaman baru. Laman atau halaman blog akan berada di atas blog atau tepatnya dibagian bawah header atau judul blog anda dan tampilan yang umum digunakan. Contohnya adalah blog ini.
• Tautan samping
  Merupakan pengaturan standart dari blogger yang secara otomatis akan tampil setiap kali anda membuat halaman baru. Laman atau halaman blog akan berada di samping blog atau tepatnya dibagian sidebar blog. Jarang digunakan.
• Jangan tampilkan
  Laman atau halaman blog tidak akan ditampilkan alias tersembunyi dan untuk menampilkannya, anda hanya bisa menggunakan cara manual dengan membuat halaman blog sendiri.
Dari ketiga opsi diatas, saya sendiri biasanya dan selalu memilih opsi yang ketiga, Jangan tampilkan.

Continue Reading

Cara Membuat Tag Cloud Berputar Di Blog

Cara Membuat Tag Cloud Berputar Di Blog

Pada kesempatan kali ini saya akan posting tentang bagaimana cara membuat label tag clould berputar

Setelah cari-cari di Google akhirnya ketemu juga langsung saya share dech

Tidak semua template bisa mendukung untuk dikasih tag cloud. Dan sebelum kamu nyoba bikin label tag cloud berputar ini, kamu download template punyamu dulu biar agar terjadi kesalahan kamu tidak pusing ,

Caranya Adalah sebagai berikut:

• Login ke  Blogger 
• Klik Design/Rancangan >> Edit HTML >> Centang Expand Templates Widget,  Cari kode : <b:section class='sidebar' id='sidebar' preferred='yes'>  ( kalau kesulitan nyarinya pakai Ctrl + F aja)
• Lalu copy paste kode di bawah ini tepat berada di bawah kode tadi

Lihat Code

<b:widget id='Label99' locked='false' title='Tag Cloud' type='Label'>

<b:includable id='main'>

<b:if cond='data:title'>

<h2><data:title/></h2>

</b:if>

<div class='widget-content'>

<script src='http://anvity.googlecode.com/files/swfobject.js' type='text/javascript'/>

<div id='flashcontent'>Blogumulus by <a href='http://www.anvity.blogspot.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a> Distributed by <a href='http://www.anvity.blogspot.com'>Tifan Dwi Avianto</a></div>

<script type='text/javascript'>

var so = new SWFObject("http://sites.google.com/site/ruangsc/enes/tagcloud.swf", "tagcloud", "250", "300", "7", "#ffffff");

// uncomment next line to enable transparency

//so.addParam("wmode", "transparent");

so.addVariable("tcolor", "0x333333");

so.addVariable("mode", "tags");

so.addVariable("distr", "true");

so.addVariable("tspeed", "100");

so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");

so.addParam("allowScriptAccess", "always");

so.write("flashcontent");

</script>

<b:include name='quickedit'/>

</div>

</b:includable>

</b:widget>

Keterangan :ganti tulisan yang berwarna merah dengan keinginan anda
1.Lebar widget : 250px
2. Tinggi widget : 300px
3. Warna latar (background) : #ffffff (putih)
4. Warna huruf : 0x333333 (abu-abu)
5. Ukuran huruf : 12 

perlu tau juga manfa'at tag cloud lihat di Apa itu Tag Cloud?
Selamat mencoba semoga bermanfa'at

Continue Reading

Apa itu Tag Cloud?

itu Tag Cloud? Kalau kita pisahkan dan mengartikan per kata maka didapat, tag artinya tanda, dan cloud artinya awan. Tetapi jangan diartikan sebagai "tanda awan". Dalam dunia SEO, tag cloud dartikan sebagai kumpulan penanda yang akan mewakili web mengenai isi content, penanda tersebut berupa kumpulan kata/keyword yang biasanya dibedakan dengan besar kecilnya huruf tiap kata yang ditampilkan. Semakin tebal atau semakin besar ukuran huruf berarti website dominan dengan kaApa itu Tag Cloud? 
 Dalam dunia SEO, tag cloud atau kalau bahasa kita adalah label dartikan sebagai kumpulan penanda yang akan mewakili web mengenai isi content , penanda tersebut berupa kumpulan kata/keyword yang biasanya dibedakan dengan besar kecilnya huruf tiap kata yang ditampilkan. Semakin tebal atau semakin besar ukuran huruf berarti website dominan dengan kata tersebut.

 
Maanfaat Tag Cloud :

• Content dan isi website akan lebih terstruktur
• Dapat diketahui tingkat content yang terpopuler.
• Dapat meningkatkan traffic pengunjung website.
• Meningkatkan jumlah halaman terindex di search engine
• Mempermudah website dikenali Search Engine

Dari manfaat diatas dapat disimpulkan, bahwa Tag Cloud berperan sangat penting bagi website/blog anda terutama dalam hal SEO. Anda dapat memilih cara-cara untuk membuat tag cloud, sesuai jenis website/blog anda. jika ingin membuatnya silahkan baca postingan tentang

Cara Membuat Tag Cloud Berputar Di Blog

Continue Reading

Cara Mudah Membuat Scroll Di Area Komentar Blog

Cara Mudah Membuat Scroll Di Area Komentar Blog
Scroll mempunyai menfaat tersenderi bagi para blogger terlebih untuk menghemat panjang pada suatu elemen seperti komentar . terkadang ketika kita menulis postingan dengan banyak komentar sehingga membuat tampilan harus megikuti panjang sekaligus menyesuaikan dengan banyak komentar yang ada. nah disinilah scroll berperan untuk menghemat element tersebut.

berikut cara membuat sroll area komentar blog :

1. Masuk ke Rancangan kemudian pilih Edit HTML dan centang Expand Template Widget.
2. Cari kode ini : #comments h4{

3.  Copy Paste script  di bawah ini dan simpan sebelum"di atas" kode  #comments h4{

#comments { height:200px; overflow:auto; }

4.  setelah itu save, kemudian lihat hasilnya maka akan muncul seperti ini atau lihat di blog ini:

Catatan:  height:200 adalah panjang nya kolam anda bisa menggantinya sesusai ke inginan

Selamat mencoba semoga berhasil

Continue Reading

Cara Mengatur Posisi Komentar Blog

Cara Mengatur Posisi Komentar Blog  Dengan adanya fasilitas komentar di blog, maka kita bisa melakukan interaksi dengan pengunjung blog. Biasanya fasilitas komentar sudah tersedia di blog kita.  kali ini saya akan membahas cara mengatur posisi komentar di blog bahkan cara untuk menyembunyikannya.

Langkah 1 :

Buka Setelan>Pos dan Komentar

Langkah 2 :

Pada bagian Lokasi komentar, silahkan anda pilih posisi kotak komentar.

• Tersemat : Kotak komentar berada dibawah postingan
• Halaman penuh : Ketika pengunjung ingin memberikan komentar maka akan terbuka satu halaman penuh 
• Jendela munculan : Ketika pengunjung ingin memberikan komentar maka akan terbuka jendela baru
• Sembunyikan : Kotak komentar tidak ditampilkan

Langkah 3 : 

Klik tombol Simpan setelan yang terdapat dibagian atas.

Tambahan :

Berikut ini tampilan kotak komentar jika memilih Tersemat.

sumber:http://rikorapar.blogspot.com

Continue Reading

Cara Membuat Daftar Link Teman Berjalan

Cara Membuat Daftar Link Teman Berjalan
Tanpa basa basi kita langsung saja ke pokok utama di 
 Cara Membuat Daftar Link Teman Berjalan

• Login ke Blogger

• Pergi Ke Tata Letak  >> Tambah Gaget >> HTML/Java Script

• Copy Kode Di Bawah Ini lalu Pastekan ke kotak script yg tersedia.

<marquee align="center" direction="up" height="200" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2" width="210">

<a href="URL Blog Teman" rel="dofollow">Link1</a>
<br /><a href="URL Blog Teman" rel="dofollow">Link2</a>
<br /><a href="URL Blog Teman" rel="dofollow">Link3</a>
<br /><a href="URL Blog Teman" rel="dofollow">Link4</a>
<br /><a href="URL Blog Teman" rel="dofollow">Link5</a>

</marquee>

Jika Sobat ingin menambahkan lagi copy kode berikut sebelum kode </marquee>

<br /><a href="URL Blog Teman" rel="dofollow">Link6</a>
<br /><a href="URL Blog Teman" rel="dofollow">Link7</a>
<br /><a href="URL Blog Teman" rel="dofollow">Link8</a>
<br /><a href="URL Blog Teman" rel="dofollow">Link9</a>
<br /><a href="URL Blog Teman" rel="dofollow">Link10</a>

• Simpan Dan Hasilnya Seperti di bawah ini. 

Link1
Link2
Link3
Link4
Link5

Continue Reading

Cara Mudah Membuat Laman Tukar Link Di Blog

Buat Sahabat Blogger Yang Ingin Berbagi tautan atau bertukar link yang dapat bermanfaat sebagai tips penambah jumlah pengunjung atau meningkatkan traffic di blog.

cara ini sudah banyak di lakukan para blogger tetapi yang namanya traffic sangat susah untuk ditebak, tetapi dengan cara ini kita sesama blogger bisa dengan senantiasa meningkatkan traffic secara berkesinambungan.

Sebagai seorang blogger yang masih pemula memang, saya ingin mencoba share apa yang telah  sukses di mata "Search Engine Optimization" SEO salah satunya dengan menerapkan istilah Tukaran link,

Ikuti langkah-langkah berikut ini:

• Pertama silahkan kunjungi situs Mister Linky's

• Setelah terbuka lalu klik Register untuk melakukan pendaftarandan isi semua kotak yang di perlukan dan kemudian klik register

• Setelah anda selesai mendaftar dan mengofirmainya, selanjutnya silahkan klik Login 

• Setelah berhasil Login klik Wizard pada bagian atas lihat gambar di bawah ini:

• Setelah terbuka silahkan ikuti langkah-langkah seperti tanda panah gambar di bawah ini jika kurang jelas bisa di klik untuk memperbesar :)

• Pada bagian step 2 bagian widget Anda bisa mengaturnya sesuka hati untuk melihatnya klik (click for preview) oyah pada gambar di atas step 3 nya kelewat anda bisa meng editnya, setelah selesai klik Generate Code

Setelah mendapatkan codenya copas dan letakan di Laman bagian HTML bukan Compose pada blog anda 
Semoga Berhasil :)

Continue Reading

Cara Memperbaiki Balas Komentar Yang Hilang

Cara Memperbaiki Balas Komentar Yang Hilang
senangnya setelah saya lihat sana sini edit sana sini untuk lebih mempercantik blog, setelah seketika saya menemukan template yang sesuai dengan yang di inginkan, tetapi masalahnya adalah bagaian menu balas komentar tidak ada alias hilang entah kemana, setelah sempat kebingungan dan  search sana sini akhirnya ketemu juga masalahnya,

Bagi para sahabat blogger yang mengalami permasalahan sama seperti penulis atau bagi sahabat yang ingin menambahkan fitur threaded_comments asli bawaan blogger, namun tidak mau templatenya berubah atau editan hilang, maka caranya sbb:

1. Masuk ke Rancangan kemudian pilih Edit HTML dan centang Expand Template Widget.
2. Cari kode ini : ----(untuk mempercepat pencarian tekan F3)----

       <div class='post-outer'>

     atau ini :

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

3. Di antara kedua kode tersebut terdapat kode seperti berikut :

        <b:if cond='data:blog.pageType == &quot;static_page&quot;'>

          <b:include data='post' name='comments'/>

         </b:if>

    <b:if cond='data:blog.pageType == &quot;item&quot;'>

          <b:include data='post' name='comments'/>

         </b:if>

         </div>

4. Hapus semua kode tersebut dan ganti dengan kode yang ada di bawah ini :

           <b:if cond='data:blog.pageType == &quot;static_page&quot;'>

           <b:if cond='data:post.showThreadedComments'>

        <b:include data='post' name='threaded_comments'/>

           <b:else/>

           <b:include data='post' name='comments'/>

          </b:if>

         </b:if>

     <b:if cond='data:blog.pageType == &quot;item&quot;'>

           <b:if cond='data:post.showThreadedComments'>

         <b:include data='post' name='threaded_comments'/>

           <b:else/>

           <b:include data='post' name='comments'/>

          </b:if>

         </b:if>

        </div>

5. Terakhir tekan Simpan Template.

Note : Sebelum disave ada baiknya sahabat blog meninjau dengan menekan Pratinjau terlebih dahulu, hal ini untuk berjaga-jaga jika ada kegagalan, atau memback-up terlebih dahulu template sobat.

Selamat mencoba semoga berhasil

Continue Reading

Cara Membuat Efek Glow Pada Link Blog

Cara Membuat Efek Glow Pada Link Blog

Efek Glow ini berfungsi jika saat kita mengarahkan mouse pointer ke link blog kita. Jika kita mengarahkannya maka terlihat bayangan link tersebut. Jika belum paham lihat gambar diatas :) .
Baik tanpa basa-basi lagi langsung saya jelaskan. Simak langkah-langkah berikut ini !

• Tentunya kamu harus masuk ke akun blogger
• Selanjutnya masuk ke Rancangan > Edit Html > Jangan lupa klik centang Expand Template Widget.
• Tekan CTRL + F pada keyboard dan cari kode a:link nanti akan muncul semiripnya seperti berikut!

a:link{ color:#006699; text-decoration:none}
a:visited{ color:#006699; text-decoration:none}
a:hover{ color:#000; text-decoration:none}

• Kode yang saya beri warna biru silahkan ganti dengan kode 

text-decoration:none;text-shadow:0 0 10px blue  

Sehingga hasilnya seperti berikut ini!

a:link{ color:#006699; text-decoration:none}
a:visited{ color:#006699; text-decoration:none}
a:hover{ color:#000; text-decoration:none;text-shadow:0 0 10px blue;}

• pada kode 10x bisa anda ganti sesuai keinginan anda semakin tinggi nilainya semakin besar efek cahaya yang muncul. Dan kode blue bisa di ganti dengan red, black, green, dsb sesuai dengan kebutuhan anda :).
• Jika semuanya sudah selesai jangan lupa klik SIMPAN TEMPLATE dan lihat hasilnya.  
  jika ingin menambah kan efek bintang nya lanjutkan dengan meng-editnya seperti di bawah ini:
  Cari kode a:hover{ atau  a:visited{ (Tekan CTRL + F untuk mempermudah pencarian)
  Letakkan kode di bawah ini, di bawah kode a:hover{ atau a:visited{
  
  

  a:hover{background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFzr1JI3zXFqO51HD1sjCf4f2v4gftTFO9qx2aGGGjZnfIQ2ZduN2WufeP2Xfd9w3iuzttuS4E7Tjh3BIz6A4DvhhRLWF8mdEGM4Hw5WCmSwPS6vTJx9M1Zb2FUZ6WvWv4B_bSvTD4qXY/s1600/stars.gif);} 

   Lalu klik simpan template.

Continue Reading

Cara Mudah membuat Widget Di Atas Header

Cara Mudah membuat Widget Di Atas Header
Pada umunya template blog bawaan tidak bisa menempatkan widget di atas header,Tapi kita sering melihat di blog lain Laman,Banner,Link dll berada di atas Header,Lalu bagaimana cara bisa membuat widget  atau Gadget di atas header?Jawabannya adalah ayo kita simak cara-caranya berikut ^_^

1. Login > Template > Edit Template ,Lalu Cari kode:

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

 2. Lalu Hapus dan Ganti Menjadi

<b:section class='header' id='header' preferred='yes'> 

  

3. Selesai deh,Mudah dan cepat
                                               

Hasilnya:

 

 

Continue Reading

Cara Menampilkan Jumlah Komentar Di Samping Judul Posting

Cara Menampilkan Jumlah Komentar Di Samping Judul Posting 
Pada kesempatan kali ini  saya akan memposting bagaimana cara untuk menambahkan sebuah ikon bubble ke sebelah judul post anda yang menampilkan jumlah komentar dari postingan tersebut.

• Login ke Blogger > Layout > Edit HTML
• Ceklis "Expand Template Widgets"
• Cari kode berikut

<h3 class='post-title entry-title'>

Sesudah kode tersebut ketemu, tambahkan kode di bawah ini tepat dibawahnya :

<!--COMMENT-BUBBLES-STARTS--><b:if cond='data:post.allowComments'>

<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>

</b:if><!--COMMENT-BUBBLES-STOPS-http://www.trikblogspot.co.cc/-->

• Setelah itu cari dan temukan kode berikut :

</head>

Setelah ketemu Letakan kode di bawah ini tepat setelah kode </head> :

Lihat Code

<!--COMMENT-BUBBLES-STARTS--><style type="text/css">
.comment-bubble {
float: right;
background: url(http://i49.tinypic.com/2vugahu.jpg) no-repeat;
width: 55px;
height: 38px;
font-size: 18px;
margin-top: -15px;
margin-right: 2px;
text-align: center;
}
</style><!--COMMENT-BUBBLES-STOPS-http://www.trikblogspot.co.cc/-->

Edit kode yang berwarna Biru tersebut sesuai dengan gaya blog anda. Ganti link warna kuning dengan link gambar yang anda sukai bisa buat sendiri atau cari di photobucket. gmpang bukan !!
Selamat mencoba semoga bermanfa'at jangan lupa like nya ya :)

Continue Reading

Cara Membuat Anchor Text Backlink

Cara Membuat  Anchor Text Backlink
Anchor Text dapat meningkatkan pageview, memper backlink dan meningkatkan trafik. Sudah pasti, bahwa anda semua sangat ingin memperoleh banyak backlink. Menurut para webmaster, backlink yang berkualitas dapat meningkatkan PR sebuah blog atau situs. Dengan kata lain, backlink yang banyak akan membuat sebuah situs memiliki tempat penting pada halaman Search Engine Result Page (SERP).

 Banyak tips dapat ditemukan tentang backlink, yang mengatakan bahwa sebuah backlink yang SEO friendly, sebaiknya menggunakan text yang mengandung arti, bukan URL yang tidak dimengerti. Dengan kata lain, backlink yang baik dapat diperoleh dengan meninggalkan anchor text yang menarik dan mengandung kata kunci yang Anda targetkan. Sehingga Anchor text yang anda buat, selain akan terbaca oleh mesin pencari, dan menguatkan posisi blog anda di SERP, juga akan menarik pengunjung untuk mengunjungi blog anda.

Berikut ini, adalah beberapa cara untuk membuat anchor text itu.

Pertama, anda dapat membuat Anchor Text sesuai judul Blog anda.
Hal ini dapat dilakukan dengan asumsi bahwa anchor text tersebut sudah mengandung keywords atau kata kunci yang anda inginkan. Misalnya jika anda membuat blog dengan judul “Tips Trik Blog | Dan Cara Buat Website
” maka backlink yang baik adalah dengan menggunakan langsung kata “Tips Trik Blog | Dan Cara Buat Website” tersebut. Untuk membuat backlink dengan anchor text seperti itu Anda bisa menggunakan kode HTML seperti ini:

 <a href="http://blogzafar.blogspot.com/" title="Tips Trik Blog | Dan Cara Buat Website">Tips Trik Blog</a>

  Sehingga anchor text yang anda buat akan tampil seperti ini:

Tips Trik Blog

nah selamat mencoba dan semoga bermanfa'at 

Continue Reading

Cara Membuat Like Fanspage Melayang Di Blog

Cara Membuat Like Fanspage Melayang Di Blog- 
Kali ini saya akan sare Cara Membuat Like Fanspage facebook Melayang Di Blog dengan 2 cara atau 2 style yang bisa anda pilih sesuai keinginan
Langsung saja yaaa ;-) silahkan ikuti langkah-langkah berikut ini:
Contoh style box pertama sebagai berikut:

•  Login ke akun Blogger
•  Tata Letak (Layout), pilih add gadget.
•  Pilih HTML, copy kode berikut :

Lihat Code

     <style type="text/css">
        #topbar{
        position:absolute;
        padding-left:-100px;
        background-color: transparancy;
        width: 300px;
        visibility: hidden;
        z-index: 200;
        }
        </style>
        <script type="text/javascript">
        var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
        var startX = 25 //set x offset of bar in pixels
        var startY = 25 //set y offset of bar in pixels
        var verticalpos="fromtop" //enter "fromtop" or "frombottom"
        function iecompattest(){
        return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
        }
        function get_cookie(Name) {
        var search = Name + "="
        var returnvalue = "";
        if (document.cookie.length > 0) {
        offset = document.cookie.indexOf(search)
        if (offset != -1) {
        offset += search.length
        end = document.cookie.indexOf(";", offset);
        if (end == -1) end = document.cookie.length;
        returnvalue=unescape(document.cookie.substring(offset, end))
        }
        }
        return returnvalue;
        }
        function closebar(){
        if (persistclose)
        document.cookie="remainclosed=1"
        document.getElementById("topbar").style.visibility="hidden"
        }
        function staticbar(){
        barheight=document.getElementById("topbar").offsetHeight
        var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
        var d = document;
        function ml(id){
        var el=d.getElementById(id);
        if (!persistclose || persistclose && get_cookie("remainclosed")=="")
        el.style.visibility="visible"
        if(d.layers)el.style=el;
        el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
        el.x = startX;
        if (verticalpos=="fromtop")
        el.y = startY;
        else{
        el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
        el.y -= startY;
        }
        return el;
        }
        window.stayTopLeft=function(){
        if (verticalpos=="fromtop"){
        var pY = ns ? pageYOffset : iecompattest().scrollTop;
        ftlObj.y += (pY + startY - ftlObj.y)/8;
        }
        else{
        var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
        ftlObj.y += (pY - startY - ftlObj.y)/8;
        }
        ftlObj.sP(ftlObj.x, ftlObj.y);
        setTimeout("stayTopLeft()", 10);
        }
        ftlObj = ml("topbar");
        stayTopLeft();
        }
        if (window.addEventListener)
        window.addEventListener("load", staticbar, false)
        else if (window.attachEvent)
        window.attachEvent("onload", staticbar)
        else if (document.getElementById)
        window.onload=staticbar
        </script>
        <br />
        <div class="clear">
        </div>
        <div id="topbar">
        <div style="text-align: right;">
        <a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0exlnXV7UItseVcLiYhzntAIH7QYsjNrTSPysPevHuBBkHgTcpoXrng-4ZWa0Oj6jDcBr1ls_BuDXGHSQFAyHXsyOi1ujokzAWTWxEQhXiMzOU_wVaaeh8gebvKTEkqmULjS7FeBFFWvs/s1600/close3.png" /></a></div>
        <center>
        <div style="background: #fff;">
        <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2F//www.facebook.com/pages/Siti-saleha/422921667774550&amp;width=300&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;appId=285523954858712" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>
        </div>
        </center>
        </div>

•  Simpan Gadget

Catatan : Tulisan yang berwarna merah ganti dengan script fanspage anda jika punya, jika tidak ganti url fanspage yang berwarna blue dengan URL fanspage anda dan script warna merah yang isi nya "300px" tersebut adalah untuk merubah ukuran.

Untuk style ke 2
Atau cara yang ke 2 di bawah ini:
Contoh hasilnya :

langkah"nya sama seperti contoh yang pertama yang membedakan adalah style box nya dengan code berikut

Lihat Code

<!-- FB melayang tombol close ala RaxterBlog awal --!>
<style type='text/css'>
#kotak-facebook {
position:fixed !important;
position:absolute; /* IE6 */
bottom:-1000px;
right:10%;
margin:0px 0px 0px -182px;
width:auto;
height:auto;
padding:16px;
-webkit-box-shadow: 0px 0px 7px #222;
-moz-box-shadow: 0px 0px 7px #222;
box-shadow: 0px 0px 7px #222; background-color:#a3cea5; font:normal 1em Cambria,Georgia,Serif;
color:#111;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;}
    #kotak-facebook a.close {
position:absolute;
top:-10px;
right:-10px;
background:#333;
font:bold 16px Arial,Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#fff;
border:2px solid #fff;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
cursor:pointer;
}
</style>
<script src='http://raxterblog.googlecode.com/files/tombolclosemenu.js'/></script>
<div id='kotak-facebook'>
like nya dooong...! :)
<br/>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com/pages/Siti-saleha/422921667774570?ref=hl&amp;width=290&amp;height=260&amp;colorscheme=#7fff85&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=true' style='border:none; overflow:hidden; width:290px; height:260px;'/></iframe>
<a class='close' href='#'>&times;</a></div>
<!-- FB melayang tombol close ala RaxterBlog akhir --!>

Catatan:
Untuk code yang berwarna kuning adalah warna becround box nya bisa di ganti dengan warna yang di inginkan
Dan untuk yang berwarna orange adalah tulisan judul box nya
Untuk code biru adalah ukuran lebar panjang box nya
Tulisan yang berwarna merah ganti dengan URL fanspage anda

selamat mencoba

Continue Reading