Buat Komentar Dibawah Postingan

1. Masuk draft.blogger.com ingan draft.blogger.com bukan blogger.com
   
2. Terus ke menu Setting ---> Comments kemudian ganti "Comment Form Placement" menjadi "Embedded below post"
3. Kemudian tekan Save Setting
4. Lalu ke menu Layout ---> Edit HTML kemudian
5. Lalu centang "expand widget templates" lalu cari Code dibawah ini
   
   <p class='comment-footer'>
   <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
   <data:postCommentMsg/></a>
   </p>
   
   
6. Kemudian ganti dengan Code dibawah ini
   
   
   <p class='comment-footer'>
   
   <b:if cond='data:post.embedCommentForm'>
   
   <b:include data='post' name='comment-form'/>
   
   <b:else/>
   
   <b:if cond='data:post.allowComments'>
   
   <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
   
   </b:if>
   
   </b:if>
   
   </p>
7. Lalu Simpan.... dan lihat hasilnya..

Coba kamu cek ada sebuah comments gak di bawah artikel yang kamu posting...

Mengganti Haloscan Ke Comment Blogger

1. pertama-tama ke menu Layout--->Edit HTML
   
2. "Download Full Tempaltes" Untuk membackup Template
   
3. Centang Checkbox "Expand widgets Tempaltes"
   
4. Kemudian Cari Code dibawah



<span class='post-comment-link'>

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

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

<!-- start haloscan (part 1) -->
<script src='http://www.haloscan.com/load/lovemanisa' type='text/javascript'> </script>
<span class='post-comment-link'>
<a class='comment-link' expr:href='&quot;http://www.haloscan.com/comments/lovemanisa/&quot; + data:post.id + &quot;/&quot;' expr:onclick='&quot;HaloScan(&quot; + &quot;\&quot;&quot;+ data:post.id + &quot;\&quot;&quot; + &quot;);return false;&quot;'>
<script type='text/javascript'>postCount(&#39;<data:post.id/>&#39;);</script>
</a> |
<a class='comment-link' expr:href='&quot;http://www.haloscan.com/tb/lovemanisa/&quot; + data:post.id + &quot;/&quot;' expr:onclick='&quot;HaloScanTB(&quot; + &quot;\&quot;&quot;+ data:post.id + &quot;\&quot;&quot; + &quot;);return false;&quot;'>
<script type='text/javascript'>postCountTB(&#39;<data:post.id/>&#39;);</script>
</a>
</span>
<!-- end haloscan -->

</b:if>
</b:if>


</span>



5. Kemudian ganti Code diatas Dengan Code dibawah ini
   
   
   
   
   <span class='post-comment-link'>
   
   <b:if cond='data:blog.pageType != "item"'>
   
   <b:if cond='data:post.allowComments'>
   
   <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
   
   <b:if cond='data:post.numComments == 1'>1
   
   <data:top.commentLabel/>
   
   <b:else/>
   
   <data:post.numComments/>
   
   <data:top.commentLabelPlural/>
   
   </b:if></a>
   
   </b:if>
   
   </b:if>
   
   </span>
   
   
6. Kemudian ke langkah selanjutnya, cari Code dibawah
   
   
   
   <b:includable id='comments' var='post'>
   
   <div class='comments' id='comments'>
   <a name='comments'/>
   <b:if cond='data:post.allowComments'>
   
   <!-- start haloscan (part 2 - post) -->
   <script src='http://www.haloscan.com/load/lovemanisa' type='text/javascript'> </script>
   <span class='post-comment-link'>
   <p><a class='comment-link' expr:href='&quot;http://www.haloscan.com/comments/lovemanisa/&quot; + data:post.id + &quot;/&quot;' expr:onclick='&quot;HaloScan(&quot; + &quot;\&quot;&quot;+ data:post.id + &quot;\&quot;&quot; + &quot;);return false;&quot;'>
   <script type='text/javascript'>postCount(&#39;<data:post.id/>&#39;);</script>
   </a> |
   <a class='comment-link' expr:href='&quot;http://www.haloscan.com/tb/lovemanisa/&quot; + data:post.id + &quot;/&quot;' expr:onclick='&quot;HaloScanTB(&quot; + &quot;\&quot;&quot;+ data:post.id + &quot;\&quot;&quot; + &quot;);return false;&quot;'>
   <script type='text/javascript'>postCountTB(&#39;<data:post.id/>&#39;);</script>
   </a></p>
   <script expr:src='&quot;http://www.haloscan.com/comments/lovemanisa/&quot; + data:post.id + &quot;/?m=1&quot;' type='text/javascript'/>
   <noscript><a expr:href='&quot;http://www.haloscan.com/comments/lovemanisa/&quot; + data:post.id + &quot;/&quot;'>Comments</a> | <a expr:href='&quot;http://www.haloscan.com/tb/lovemanisa/&quot; + data:post.id + &quot;/&quot;'>Trackback</a></noscript><br/>
   </span>
   <!-- end haloscan -->
   
   </b:if>
   
   
   
   <div id='backlinks-container'>
   <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
   <b:if cond='data:post.showBacklinks'>
   <b:include data='post' name='backlinks'/>
   </b:if>
   </div>
   </div>
   </div>
   </b:includable>
   
   
   
   
7. kemudian langkah selanjtnya adalah gantilah Code Diatas dengan Code dibawah ini
   
   
   
   <b:includable id='comments' var='post'>
   
   <div class='comments' id='comments'>
   
   <a name='comments'/>
   
   <b:if cond='data:post.allowComments'>
   
   <h4><b:if cond='data:post.numComments == 1'>1
   
   <data:commentLabel/>:<b:else/><data:post.numComments/>
   
   <data:commentLabelPlural/>:
   
   </b:if>
   
   </h4>
   
   <dl id='comments-block'>
   
   <b:loop values='data:post.comments' var='comment'>
   
   <dt class='comment-author' expr:id='"comment-" + data:comment.id'><a expr:name='"comment-" + data:comment.id'/>
   
   <b:if cond='data:comment.authorUrl'><a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/>
   
   </a><b:else/><data:comment.author/></b:if><data:commentPostedByMsg/>
   
   </dt>
   
   <dd class='comment-body'>
   
   <b:if cond='data:comment.isDeleted'>
   
   <span class='deleted-comment'>
   
   <data:comment.body/>
   
   </span><b:else/>
   
   <p><data:comment.body/></p>
   
   </b:if></dd><dd class='comment-footer'>
   
   <span class='comment-timestamp'>
   
   <a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
   
   <data:comment.timestamp/>
   
   </a>
   
   <b:include data='comment' name='commentDeleteIcon'/>
   
   </span>
   
   </dd>
   
   </b:loop>
   
   </dl>
   
   <p class='comment-footer'>
   
   <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a></p>
   
   </b:if>
   
   <div id='backlinks-container'>
   
   <div expr:id='data:widget.instanceId + "_backlinks-container"'>
   
   <b:if cond='data:post.showBacklinks'>
   
   <b:include data='post' name='backlinks'/>
   
   </b:if>
   
   </div>
   
   </div>
   
   </div>
   
   </b:includable>
   
8. Setelah langkah diatas selesai mari kita lanjut ke langkah selanjutnya
   
9. Cari Code dibawah Ini
   
   <p class='comment-footer'>
   <b:if cond='data:post.allowComments'>
   <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
   </b:if>
   </p>
   
10. Kemudian ganti Dengan Code dibawah ini
    
    <p class='comment-footer'>
    <b:if cond='data:post.embedCommentForm'>
    <b:include data='post' name='comment-form'/>
    <b:else/>
    <b:if cond='data:post.allowComments'>
    <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
    </b:if>
    </b:if>
    </p>
    
    
11. selesai kemudian Save Template dehhh

Mengatur Link Pada Blog

Masuk menu Layout kemudian masuk ke Edit HTML kemudian cari Code CSS seperti dibawah ini


a:link {
color:#346ba4;
text-decoration:underline;
}
a:visited {
color:#800000;
text-decoration:underline;
}
a:hover {
color:#56b9ff;
text-decoration:underline;
}

Nah jik anda ingin mengotak-atik akan saya terangkan dibawah ini..


a:link { <<<-- Link aktif 
color:#346ba4; <<<---- Ini adalah warna Link aktif yang belum tersentuh apapuntext-decoration:underline;
}
a:visited { <<-- Link jika sudah dibuka/diklik
color:#800000; <<<--- Ini adalah warna Link jika URLnya sudah pernah dikunjungi text-decoration:underline;
}
a:hover { <<--Link jika pointer berada pada Link 
color:#56b9ff; <<<--- Ini adalah ini adalah warna jika Pointer diarahkan pada Linktext-decoration:underline;
}

Ganti tulisan yang berwarna merah dengan code warna yang anda sukai.
Tulisan yang tercetak biru diatas menandakan Link bergaris bawah anda bisa merubah menjadi tidak bergaris bawah dengan mengganti tulian underlinemenjadi none

Jika anda ingin mengatur Link Postingan anda berbeda dengan yang lain tambahkan Code CSS dibawah ini

#main .post-body a:link{
color:#346ba4;
text-decoration:underline;
}
#main .post-body a:visited{
color:#800000;
text-decoration:underline;
}
#main .post-body a:hover{
color:#56b9ff;
text-decoration:none;
}

Rubahlah sesuai keinginan kamu seperti cara diatas tadi

Membuat Link Read More Beserta Judul Postingya

Oke kita langsung aja ke cara pembuatanya deh 

1. Log In ke Blogger Dan masuk ke menu Layout lalu masuk Edit HTML

2. Jangan Lupa centang kotak "Expand Widget Templates"

3. Kemudian Cari Link Raed More Anda misalnya Punya aku seperti ini

<p><data:post.body/>

<a expr:href='data:post.url'>...Baca Selengkapnya </a></p>

Kamu Lihat tulisan yang tercetak tebal diatas itu adalah Link Read More punya aku

4. Kamu tambahkan Code <data:post.title/> dan Kamu tempatkan di sebelah Link read More, Lihat Contoh Dibawah

<p><data:post.body/>

<a expr:href='data:post.url'>...Baca Selengkapnya dari.."<data:post.title/>"</a></p>

Nah diatas Adalah Contoh dari Link read More Punya ku.. kamu bisa merubah sesuai keinginan kamu

5. Save..

Sekian deh semoga bermanfaat bagi Anda...

Mengganti Background Blog Dengan CSS

Langkah pertama adalah masuk menu Layout (tata letak) kemudian masuk menuEdit HTML

Lalu cari CSS dari body seperti dibawah ini

body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

Kalau mau mencari CSS diatas perhatikan code yang berwarna hijau saja.

perhatikan Code CSS background diatas
$bgcolor adalah variabel definisi, jika Anda ingin menggantinya bisa dengan code warna misalnya ganti dengan warna putih code warnanya adalah : #FFFFFF atau warna hitam #000000. Atau warna yang lain bisa dilihat disini.


Mengganti background blog dengan gambar :

untuk membuat background gambar kita perlu sebuah gambar yang sudah diupload di hosting. Atau Anda bisa mencari di google image search dan copy URL gambarnya.
Kalu sudah tersedia gambar yang mau dijadikan background perhatikan dibawah ini.

background:#FFFFFF url(URL_GAMBAR) ;

URL_GAMBAR ini bisa Anda ganti dengan URL gambar yang Anda pilih misalnya gambar :



URLnya : http://i725.photobucket.com/albums/ww258/anasceria/plays.jpg

Mengantur Background Gambar

background:#FFFFFF url(URL_GAMBAR) no-repeat top left;

no-repeat : berarti gambar didak akan mengulang, Bisa Anda ganti dengan

repeat : Mengulang-ulang gambar
repeat-x : mengulang secara horizontal
repeat-y : Mengulang secara vertikal

top left : Adalah posisi background bisa anda ganti misalnya bottom right

Panduan Awal Membuat Blog

Cara Membuat Blog di Blogger

1. Masuk alamat www.blogger.com
   
2. Lalu klik tombol navigasi "Ciptakan Blog Anda"
   
3. Lalu isi form yang mucul dengan benar sesuai data diri Anda
   
   Setelah diisi dengan benar contreng kotak "Saya Menerima..." Lalu klik tombol "Lanjutkan"
   
4. Lalu akan muncul konfigurasi nama blog Anda seperti dibawah ini, isi judul blog dan alamat blog Anda
   
   
   
   Setelah diisi klik tombol "Lanjutkan"
   
5. Setelah langkah ke empat selesai sekarang pilih sebuah template Anda. Pilih template yang Anda sukai kemudian klik tombol "Lanjutkan"
   
6. Dan blog Anda sudah jadi apabila ingin memposting silahkan klik tombol "Mulai Blogging"

Mudah kan membuat blog itu? dengan blog Anda bisa lebih keren lho . Happy blogging!!

Recent Post Dengan Thumbnail

Hai sobat, gimana kabarnya nih ?, semoga dalam keadaan sehat. Nah kali ini saya mencoba menulis lagi tentang widget pada blogspot, tak lain adalah widget recent post yang sebelumnya sudah pernah saya tulis di blog ini dengan berbagai versi.
Namun kali ini sedikit agak berbeda dengan bentuk widget ini dengan adanya tambahan gambar thumbnail yang ada di postingan, dengan tujuan agar pembaca blog kita tertarik dengan postingan yang kita suguhkan setelah melihat thumbnail gambar yang mungkin unik, lucu, mempesona dsb.

Widget ini cocok bagi Anda yang mempunyai blog bernuansa gallery, misalnya gallery template, foto, desain dan sebagainya.

Untuk membuatnya silahkan ikuti langkah-langkah dibawah ini .

Pada menu Dashboard klik menu "Design - > Page Elements"

Lalu pilih area pada layout anda dan klik "Add a Gadget" dan pilih "HTML / JavaScript"

Dan taruh script dibawah ini kedalamnya.

<script language="JavaScript">

imgr = new Array();


imgr[0] = "http://i725.photobucket.com/albums/ww258/anasceria/Tutorial-jitu/no-image1.gif";

imgr[1] = "http://i725.photobucket.com/albums/ww258/anasceria/Tutorial-jitu/no-image2.gif";

imgr[2] = "http://i725.photobucket.com/albums/ww258/anasceria/Tutorial-jitu/no-image3.gif";

imgr[3] = "http://i725.photobucket.com/albums/ww258/anasceria/Tutorial-jitu/no-image4.gif";

imgr[4] = "http://i725.photobucket.com/albums/ww258/anasceria/Tutorial-jitu/no-image5.gif";
showRandomImg = true;

boxwidth = 230;

cellspacing = 8;

borderColor = "#ffffff";

bgTD = "transparent";

thumbwidth = 40;

thumbheight = 40;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = false;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://sangmerak.blogspot.com/";

</script>

<script src="https://sites.google.com/site/anasceria/recentposts_thumbnail.js" type="text/javascript"></script>

Keterangan :

boxwidth = 230; untuk menentukan lebar dari widget yang harus Anda sesuaikan dengan lebar Layout Anda.
Ganti URL "http://inilinkterserahkamu.blogspot.com/" dengan alamat blog Anda.
Dan untuk modifikasi yang lain silahkan ubah keterangan-keterangan yang ada diatas.

Nah kalau sudah tinggal SAVE.

Cara Menghilangkan Widget Attribution Blogger

Caranya cukup simple dan mudah banget, ikuti Saja langkah dibawah ini.

pertama masuk pada "Design" Lalu "Edit HTML"

masukkan code css dibawah ini diatas code ]]></b:skin>

#Attribution1 {height:0px; 
visibility:hidden;
display:none
}

Tinggal SAVE deh.

Menampilkan Widget Di Halaman Tertentu

Langkah pertama yang harus Anda lakukan adalah masuk menu "Design" kemudian masuk ke bagian "Edit HTML" lalu centang kotak "Expand widget templates"

lalu cari code widgetnya seperti ini

<b:widget id='HTML1' locked='false' title='Pesan' type='HTML'>
<b:includable id='main'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:includable>
</b:widget>

Untuk mempermudah pencarian silahkan masukkan judul widget seperti "Pesan" kedalam kotak pencarian browser (ctrl + F)

Kemudian tambah code

<b:if cond='data:blog.url == data:blog.homepageUrl'>

dan ditutup dengan code </b:if> untuk menempatkan di hanya halaman depan saja

dan ditempatkan seperti dibawah ini

<b:widget id='HTML1' locked='false' title='Pesan' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<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>

Perhatikan penempatan code yang berwarna hijau !

kemudian save.

Dan dibawah ini adalah code yang bisa digunakan untuk penempatan lainya

Untuk menempatkan di halaman depan/index digunakan code

<b:if cond='data:blog.pageType == data:blog.homepageUrl'>

Untuk menempatkan di halaman Archive saja

<b:if cond='data:blog.pageType == "archive"'>

Untuk menempatkan dihalaman item/posting saja digunakan code

<b:if cond='data:blog.pageType == "item"'>

Dan untuk pada halaman pages atau static page blogger digunakan

<b:if cond='data:blog.pageType == "static_page"'>

Dan untuk tambahan, jika Anda ingin menempatkan di halaman tertentu dengan menggunakan URL gunakan code dibawah ini

<b:if cond='data:blog.url == "URL_HERE"'>

Ganti code URL_HERE dengan URL yang ingin anda tampilkan.

Dan untuk pengecualian, misalnya anda tidak menempatkan widget hanya di halaman depan saja dengan cara mengganti tanda = pertama dengan tanda !

Contoh

<b:if cond='data:blog.pageType != data:blog.homepageUrl'>

Nah tidak terlalu sulit kan? semoga bermanfaat bagi Anda

CARA MEMBUAT SENDIRI AKUN BLOG BARU DI BLOGSPOT

Untuk membuat sebuah akun di blogspot sangatlah mudah. Bahkan anak SD saja sudah banyak yang mengetahui cara ini, jadi saya yakin saudara pun tidak akan mengalami kesulitan di sini.

1. Silahkan kunjungi alamat www.blogger.com dan masukkan username dan password dari akun Gmail anda.
2. Dalam halaman dasbor anda akan melihat gambar anda, dan di bawah gambar itu ada sebuah tombol "Blog Baru". Klik pada tombol itu untuk memulai membuat blog anda.
   
3. Anda akan melihat sebuah formulir yang harus diisi untuk membuat blog baru anda. Di dalam formulir ini anda diminta mengisi Judul Blog, Alamat Blog, dan Template Dasar.
   
4. Panduan untuk anda: 
• Pastikan Judul, dan Alamat Subdomain yang anda pilih mengandung kata kunci yang anda targetkan. Atau sembarang saja jika anda berniat mengganti subdomain blogspot anda dengan domain sendiri nantinya (entah itu .com, .org, .net, dll). 
• Untuk bisnis online sangat disarankan untuk mengganti nama domain agar terlihat lebih profesional dan tentunya menunjang SEO jika nama domain anda bisa tepat sama dengan kata kunci yang anda kejar. (Biayanya cuma Rp.100.000/tahun)
5. Setelah anda selesai di formulir ini silahkan klik tombol BUAT BLOG, dan selesai