Best Blogger Tips
Baca Juga Artikel Internet Gratis Di Blog Saya Yang Lainnya http://luxury-agency.blogspot.com

Kamis, 14 Maret 2013

Highlight Author Comment

Highlight Author Comment fungsinya adalah supaya komentar author (pemilik blog) berbeda dengan komentar orang lain . Untuk komentar pemilik blog akan ada bordernya dan ada efek lainnya. Nha berikut ini akan aku beberkan cara untuk membuat Highlight Author Comment ini. Dah siap semuanya ? OK Lansung aja Ke TKP :)

1. Login ke blogger trus ke menu "Layout --> Edit HTML"
2. Beri tanda centang pada kotak "Expand Widget Templates"
3. Copy script berikut ini sebelum kode ]]></b:skin> atau copy ke dalam kode CSS.
.comment-body-author {
background: #E6E6E6; /* Warna Background */
border-top: 1px dotted #223344;border-bottom: 1px dotted #223344;border-left: 1px dotted #223344;border-right: 1px dotted #223344;
margin:0;
padding:0 0 0 20px;
}

4. Kemudian cari kode2 seperti berikut. Mungkin kode yg ada di HTML kamu akan beda, tp walaupun beda usahakan semirip mungkin dengan kode berikut ini :
<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>
said...
</dt>

<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<p><data:comment.body/></p>
</dd>
<b:else/>

<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>

</b:if>

<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>

5. Kode yang berwarna merah adalah kode yang harus kamu tambahkan di HTML kamu. Posisinya harus benar, ingat itu.

6. Kalo sudah terus disave template kamu.

NB : Comment author ini berdasarkan profil dari pemilik blog tsb. Jadi supaya efeknya muncul sebelum memberi komentar kamu harus login dulu di blogger. OK.
Oh ya ini bukan untuk komentar dari haloscan lho. Tapi hanya untuk kotak komentar yg dari blogger murni

Oke sob itu saja trik untuk Highlight Author Comment yang saya bisa sampaikan, Jangan lupa ya sob tinggalkan jejak nya :)
Read More ->>

Rabu, 13 Maret 2013

Cara Memasang Emoticon di Kotak Komentar


Cara Memasang Emoticon di Kotak Komentar - Dengan adanya emoticon di kotak komentar tentunya akan membuat blog menjadi lebih hidup. Para komentator menjadi lebih bisa mengekspresikan perasaannya melalui icon2 (emoticon). Kalau di wordpress mungkin feature ini sudah tersedia. Tapi untuk blogspot kita harus mengotak-atik dan mengakalinya supaya bisa menampilkan emoticon di area komentar. Gimana? kamu mau memasang emoticon ini?

Seperti biasanya, di trik ini akan diberikan dua macam emoticon, yaitu emoticon kucing (seperti punyaku ini) dan emoticon yahoo. Kamu tinggal pilih mana yang kamu suka.


Emoticon Yahoo : 
:)) :)] ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} ~x( :-t b-( :-L x( =)) 

Emoticon Kucing : 
:f :D :) ;;) :x :$ x( :? :@ :~ :| :)) :( :s :(( :o  
Gini nih cara membuatnya :

1. Pertama login ke blogger, trus ke "Layout (Tataletak) --> Edit HTML "
2. Beri tanda centang pada kotak "expand widget template"
3. Lalu letakkan script berikut sebelum kode </body>

Untuk Emoticon Yahoo :

<script src='http://kendhin.890m.com/emoticon/smile1.js' type='text/javascript'/>

Untuk Emoticon Kucing :

<script src='http://kendhin.890m.com/emoticon/smile2.js' type='text/javascript'/>


4. Kemudian cari kode berikut 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>


5. Kalo sudah ketemu letakkan kode2 berikut setelah kode <p class='comment-footer'>

Ini untuk Yahoo emoticon:


<b><img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/> :))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/> :)]
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif'/> ;))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/> ;;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/> :D
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/> ;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/> :p
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/> :((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/> :)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/> :(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/> :X
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/> =((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/> :-o
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/> :-/
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/> :-*
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/> :|
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/> 8-}
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/> ~x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/> :-t
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif'/> b-(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif'/> :-L
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/> x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/> =))
</b>
Kalo mo yang emoticon kucing pake yang ini :


<b><img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/capek.gif'/> :f
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/bigsmile.gif'/> :D
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/hi.gif'/> :)
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/kagum.gif'/> ;;)
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/love.gif'/> :x
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/malu.gif'/> :$
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/marah.gif'/> x(
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/bingung.gif'/> :?
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/mumet.gif'/> :@
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/muntah.gif'/> :~
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/mentok.gif'/> :|
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/ngakak.gif'/> :))
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/sedih.gif'/> :(
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/senang.gif'/> :s
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/tolong.gif'/> :((
<img border='0' src='http://i654.photobucket.com/albums/uu264/mastegar/kucing%20gif/wow.gif'/> :o
</b>

6. Kalo sudah trus di "save" dan coba lihat hasilnya

Tambahan
* Kadang-kadang ada beberapa template memiliki kode yang beda. Kalau caranya sudah dilaksanakan dengan benar tapi hasilnya tidak terjadi apa2 atau kodenya tidak berubah menjadi emoticon, kemungkinan itu karena Kode untuk templatenya berbeda atau bisa juga karena mungkin hosting untuk menaruh file emoticon dan javascriptnya sedang bermasalah.


Oke sob selamat mencoba, Jangan lupa tinggalkan jejak ya sob :)
Read More ->>

Cara Membuat Contact Form Blog


Membuat contact form dengan cepat, dengan hanya beberapa detik saja contact form Anda sudah jadi.
Layanan ini gratis dan terintegrasi anti spam.

Bagi Anda yang ingin berkominikasi dengan pengunjung blog mungkin secara privasi bisa membuatnya dan memasang contact form ini pada blog Anda.
Jika Anda membuat toko online contact form akan menjadi sangat penting kegunaannya.

Untuk yang ingin memasang contact form pada blog, bisa membuatnya melalui situs layanan ini dengan cara yang cukup mudah.
Caranya:


1. Buka halaman http://www.foxyform.com/

2. Dari halaman tersebut Anda akan melihat tampilan contact form yang akan Anda buat.

3. Lakukan setting untuk tampilan contact form menurut selera.

4. Anda bisa merubah tulisan dan warna untuk tampilan contact form tersebut.

5. Setelah itu masukkan Email Anda.

6. Kemuadian pilih Create Formular.

7. Maka akan terbuka halaman baru yang terdapat kode html yang harus Anda masukkan ke halaman  blog Anda.

8. Selanjutnya copy code yang diberikan.

Setelah menyalin kodenya, login ke blog Anda untuk memposting code tersebut.

Sebaiknya Anda membuat halaman statis untuk meletakkan contact form ini.
Cara membuat halaman statis bisa Anda lihat di sini. Beri judul contact atau contact me dan letakkan pada tempat yang mudah dilihat oleh pengunjung.

Dan selamat contact form Anda sudah jadi. Semoga Bermanfaat, Jangan Lupa Tinggalkan Jejak sob.. :)
Read More ->>

CARA MEMBUAT HALAMAN STATIS DI BLOGSPOT

Halaman statis adalah halaman yang berdiri sendiri yang tidak akan mempengaruhi halaman dinamis. Berbeda dengan halaman dinamis yang mana ketika Anda posting akan menggeser halaman sebelumnya.
Halaman statis ini tidak akan muncul pada halaman muka ketika Anda posting artikel baru. Yang artinya ini tidak akan menggantikan halaman posting awal.

Halaman statis biasa di gunakan untuk membuat halaman about me, halaman contact
atau halaman yang memang dibuat khusus.
Untuk memudahkan penggunanya, blogger telah menyediakan fitur ini.Bila Anda ingin mencoba bagaimana cara membuat halaman statis pada blogspot, untuk membuatnya Anda bisa ikuti cara di bawah ini.
  • Login ke blog Anda
  • Pilih blog yang ingin Anda buat halaman statis
  • Kemudian pilih pages.
  • Dan selanjutnya pilih blank page, seperti yang terlihat pada gambar di bawah.


  • setelah Anda pilih blank page, maka Anda akan diarahkan pada halaman posting artikel, seperti yang terlihat pada gambar.

  • Beri judul, misal contact atau about.
    Masukkan artikel Anda, kemudian publis.
    Setelah Anda publish, maka secara otomatis Anda akan dibawa lagi pada halaman pages, seperti gambar di bawah.


  • Ambil linknya pada view, bisa dengan cara langsung dibuka atau klik kanan kemudian copy link location.
    Maka kurang lebih Anda akan mendapatkan link seperti ini:
    http://www.yogie-56.blogspot.com/p/contact-me.html
  • Letakkan linknya pada menu yang Anda kehendaki, bisa pada sedebar atau pada
    menu navigasi horizontal.

Semoga bermanfaat, Jangan lupa tinggalkan jejak ya sob :)
Read More ->>

Cara Membuat Related Post Di Bawah Posting

Cara Membuat Related Post Di Bawah Posting - Relate post ini lebih sering dijumpai berada di bawah posting, walau sebanarnya bisa juga diletakkan pada sedebar.
Kegunaan related post ini sangat penting bagi pengunjung guna mencari artikel terkait atau yang berhubungan dengan artikel yang sedang mereka baca.

Jika di blog Anda belum terdapat related post, Anda bisa memasangnya pada blog Anda. Jika ingin memasangsya Anda bisa ikuti bagaimana cara membuat related post di bawah posting.

Di bawah ini adalah kode related post yang bisa diterapkan pada template blog.
Pertama yang harus Anda lakukan adalah login ke blog Anda.



  • Pilih blog yang ingin Anda pasang related post.
  • Pilih template.
  • Kemudian pilih edit HTML.
  • Beri tanda pada Expand Widget Template.
  • Cari kode :
    ]]></b:skin>

  • Letakkan kode warna hijau di bawahnya, hingga hasilnya sepeti ini:
    ]]></b:skin> <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <style type='text/css'>
    #related-posts {float:center;text-transform:none; height:100%;padding-top:15px;padding-left:5px;border: 8px double #FFCC66; margin-top:20px;}
    #related-posts .widget {padding-left:5px;margin-bottom:10px;}
    #related-posts .widget h2, #related-posts h2 {font-size:1.6em;font-weight:bold;color:#CC6600;font-family:Arial, Verdana;margin-bottom:0.75em;margin-top:0em;padding-top:0em;}
    #related-posts a {color:#;}
    #related-posts a:hover {color:#;}
    #related-posts ul {list-style-type:none;margin:6px 0 10px 12px;padding:0;text-decoration:none;font-size:13px;}
    #related-posts ul li {list-style-type:none;margin-bottom:5px;padding-left:25px;padding-top:0;display:block;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcjvYK1QCL3LustDlffjmdJytF58rrGH9dHswU8iuP4mT2SV1LVfz4xLSrR-lfAUFqAnhiljAVUCHoqrZt-ka6dhkyj_u8Ju8F0pJuWIzW3sKEl_-62OMf-4UGLQFOMaS_KwcnjnAsJtM/s1600/relatedpost.png) no-repeat;}
    </style>
    <script type='text/javascript'>
    var relatedpoststitle="Related POST";
    </script>
    <script src='http://nimbuzzin.googlecode.com/files/relatedpost.js' type='text/javascript'/>
    </b:if>
  • Kemudian mouse Anda gulir ke bawah dan temukan kode seperti ini :
    <div class='post-body entry-content'>
    <data:post.body/>
  • Letakkan kode warna hijau di bawahnya, hingga hasilnya seperti ini :
    <div class='post-body entry-content'>
    <data:post.body/>
    <div id='related-posts'>
    <b:loop values='data:post.labels' var='label'>
    <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:loop>
    <script type='text/javascript'>
    var maxresults=7;
    removeRelatedDuplicates();
    printRelatedLabels(&quot;<data:post.url/>&quot;);
    </script>
    </div>
  • Kemudian Preview atau pratinjau.
  • Setelah dirasa aman baru Save template.

Oke sob sambil di coba, sambil minum kopi :), Juga Jangan Lupa Tinggalkan Jejak Sob .. :)
Read More ->>