Kotak Komentar Di bawah Posting

Duh rupanya banyak yang salah paham nih tentang postingan kang rohman yang kemaren, saya tegaskan bahwa postingan itu khusus bagi anda yang sudah me modifikasi kotak komentar dengan kotak komentar yang di buat oleh jackbook. Bagi anda yang belum pernah memodifikasi kotak komentar sebelumnya alias masih perawan, silah baca postingan oom yang di sini atau mungkin ingin kang rohman yang nulis :D ya udah kalau gitu kang rohman tulis aja deh sekalian.


Sekali lagi saya tegaskan bahwa tutorial pasang kotak komentar di bawah posting ini khusus bagi anda yang belum pernah memodifikasi kotak komentar anda sebelumnya atau dengan kata lain masih asli dari sononya. Yukkk...kita mulai saja biar cepat kelar.

  1. Silahkan Login ke http://draft.blogger.com dengan ID blogger anda. Ingat! bukan login ke blogger.com tapi ke draft.blogger.com karena fasilitas ini masih dalam tahap uji coba.


  2. Tuju pada blog yang akan anda pasang kotak komentarnya. Klik pada Pengaturan


  3. Klik tab Komentar, tuju ke tulisan Penempatan Formulis Komentar, kemudian beri tanda pada radio button untuk Disemat di bawah entri. Biar lebih jelas, sok dilihat gambarnya :


  4. pilihan komentar bawah posting

  5. Klik tombol Simpan Pengaturan yang ada di bagian bawah layar monitor anda.


  6. Selesai. Silahkan lihat hasilnya, mudah-mudahan langsung sukses.



Duhhh... saya belum berhasil nih!!! gimanaaaa??????

Jika belum berhasil, bisa mencoba langkah-langkah di bawah ini (biasanya jarang ada yang gagal kalau yang ini).

Langkah #1
  1. Masih dalam posisi yang tadi, klik Tata Letak.


  2. Klik Edit HTMl.


  3. Klik pada tulisan Download Template Lengkap di bagian sebelah atas monitor. Silahkan di Backup dulu templatenya (sangat penting).


  4. Beri tanda centang pada kotak kecil di samping tulisan Expand Template Widget.






  5. Tunggu beberapa saat sampai proses selesai.


  6. Cari kode yang seperti di bawah ini( karena kadang kode template berbeda-beda, silahkan fokus ke kode yang warna hijau, dan biasanya kode ini ada dua, pilih kode yang posisinya di bagian bawah ya!)
  7.  


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



     


  8. Hapus / delete kode diatas, lalu ganti dengan kode di bawah ini :




  9.  



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



     


  10. Klik tombol Simpan Template.




  11. Langkah #1 selesai, yuk dulu biar lebih santai gitu lhohhh..





Sudah belum minum nya? kalau sudah, kita mulai lagi dech. nyok encang encing enya babeh kita mulai lagi main bajidor nya ya.



Langkah #2


  1. Klik pada Pengaturan




  2. Klik tab Komentar, tuju ke tulisan Penempatan Formulis Komentar, kemudian beri tanda pada radio button untuk Disemat di bawah entri. Biar lebih jelas, sok dilihat gambarnya :




  3. pilihan komentar bawah posting




  4. Klik tombol Simpan Pengaturan yang ada di bagian bawah layar monitor anda.




  5. Selesai. Silahkan lihat hasilnya.





Biasanya kalau dengan cara yang kedua ini jarang gagal, jika masih gagal juga, ya udah kang rohman ucapkan "kaciaaaaaaaaan dech loe"

Setting Kotak Komentar Dibawah Posting

Akhirnya sekarang pengguna blogspot boleh untuk sedikit berbangga hati karena pihak blogger.com sudah meluncurkan fitur-fitur barunya walaupun masih dalam tahap uji coba seperti yang telah kang rohman tulis di sini. Kini anda tidak perlu lagi minder karena sering mendapat cemoohan di sebabkan urusan kotak komentar Blogspot yang konon katanya sangat ribet, kini anda bisa membuat backup blog hanya dengan satu kali klik saja, tidak perlu lagi khawatir tidak akan terindeks di google karena Webmaster Tools sudah terintegrasi dengan blogger. Duh... semakin hari saya makin Love aza nih ama blogspot...iiiiiihhhh.. gregetan deh jadinya


Seperti janji kang rohman kemarin bahwa akan membuat tutorial cara mengembalikan template yang sudah di modifikasi seperti yang kang rohman tulis di sini. Yuk... kita mulai aja biar cepat-cepat merasakan kotak komentar langsung di bawah posting.

Langkah #1
  1. Silahkan Login ke http://draft.blogger.com dengan ID blogger anda, ini di maksudkan agar nanti memasang kotak komentarnya langsung bisa di lakukan.


  2. Tuju pada blog yang akan anda ubah kodenya. Klik pada Tata Letak


  3. Klik tab Edit HTML.


  4. Klik pada tulisan Download Template Lengkap di bagian sebelah atas monitor. Silahkan di Backup dulu templatenya (sangat penting).


  5. Beri tanda centang pada kotak kecil di samping tulisan Expand Template Widget.






  6. Tunggu beberapa saat sampai proses selesai.


  7. Cari kode yang seperti di bawah ini :


  8. <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.url + "#comments"' >

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


  9. Gantilah kode di atas dengan kode di bawah ini :




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

     



  11. Cari kode seperti di bawah ini, lalu hapus / delete saja :



  12. <!-- www.jackbook.com --><!-- this to hide and show el -->

    <script languange='javascript'>
    function showcomment(a,b){var jackbookdotcom = document.getElementById(a);jackbookdotcom.style.display = 'none';jackbookdotcom = document.getElementById(b);jackbookdotcom.style.display = 'block';}

    </script><!-- www.jackbook.com -->




  13. Cari kode yang seperti di bawah ini :



  14. <b:includable id='comments' var='post'>
    <div class='comments' id='comments'>
    <a name='comments'/>
    <b:if cond='data:post.allowComments'>

    <!-- jackbook.com part 1 start -->
    <!--
    <h4>
    <b:if cond='data:post.numComments == 1'>
    1 <data:commentLabel/>:
    <b:else/>
    <data:post.numComments/> <data:commentLabelPlural/>:
    </b:if>
    </h4>
    -->
    <div class='onepx'>
    <dl id='comments-block' style='height: 1px;overflow:hidden;'>
    <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>
    </div>
    <!--
    <p class='comment-footer'>
    <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
    </p>
    -->
    <!-- jackbook.com part 1 ends -->
    <!-- actually i almost do nothing with your template, just add that comment, you did it :) -->

    <div id='comment-parent' onmouseover='showcomment("hoverme", "comment-child");' style='margin-bottom: 50px;'>
    <h3 id='hoverme' style='display:block;'>
    <img alt='Your cOmment"s Here! Hover Your cUrsOr to leave a cOmment.' src='http://img229.imageshack.us/img229/5559/htmlcodeleavecommentfi5.gif' title='Your cOmment"s Here! Hover Your cUrsOr to leave a cOmment.'/>
    </h3>

    <!-- this iframe below is your comment form. you can change the height, or add more style property into it -->
    <div id='comment-child' style='border:none; display: none; height:750px; width: 440px; margin-bottom: 5px; background: #fff none; border: 1px solid #FCO;'>
    <iframe expr:src='data:post.addCommentUrl' height='100%' scrolling='yes' style='border:none;' width='100%'/>
    <br/>
    <a href='http://www.jackbook.com/2007/06/how-to-make-readers-leave-comment.html' title='Want to have this on your blogger/blogspot?'>Comment Form under post in blogger/blogspot</a>
    </div>
    <!-- end of iframe -->

    </div>


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

     


  15. Ganti kode di atas dengan kode di bawah ini :



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



  17. Langkah #1 Selesai, silahkan sejenak beristirahat dulu agar suasana menjadi tambah rileks.



Sudah istirahatnya? siap untuk melanjutkan? yuuukkkk.... mulai lagi jika sudah siap.

Langkah #2

  1. Masih dalam posisi Edit HTML dan pastikan kotak kecil di samping tulisan Expand Template Widget masih dalam keadaan tercentang.


  2. Cari kode yang seperti di bawah ini( karena kadang kode template berbeda-beda, kalau kata oom "focus saja ke kode yang warna hijau.


  3.  

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



  4. Hapus / delete semua kode di atas lalu ganti dengan kode di bawah ini :


  5.  

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



  6. Klik tombol Simpan Template.


  7. Akhirnya langkah #2 pun selesai juga, silahkan santai sejenak kembali untuk menghapai ujian yang terakhir.



Sudah habis nya? siap menghadapi ujian yang terakhir :D yukkkk....


Langkah #3

  1. Klik tab Pengaturan.


  2. Klik sub tab Komentar. Tuju Penempatan Formulis Komentar, pilih untuk pilihan Disemat di bawah entri.

    pilihan komentar bawah posting



  3. Klik tombol Simpan Pengaturan yang ada di bagian bawah layar monitor anda.


  4. Selesai. Silahkan lihat hasilnya, mudah-mudahan langsung sukses.



hore berhasil...berhasil hore berhasil...berhasil hore berhasil...berhasil LUV U Blogger

Fitur Fitur baru Dari Blogger.com

Setelah sekian lama menunggu, akhirnya blogger akan segera meluncurkan fitur-fitur barunya. Ini di terangkan pada blog mereka yakni di http://bloggerindraft.blogspot.com, bahwa mereka sudah membuat fitur fitur baru yang sangat di nanti-nanti oleh jutaan pengguna blog di blogger alias blogspot. Fitur-fitur tersebut adalah Webmaster Tools Verification, Star ratings, Impost/export of blogs, New Post Editor, dan yang paling di nanti-nanti selama ini adalah fitur Embedded comment form alias Kotak Komentar langsung di bawah Posting. Walaupun masih dalam tahap draft alias masih percobaan, anda sudah bisa mencobanya melalui http://draft.blogger.com, tinggal login dengan user name serta password blogger anda.

Ada satu yang lucu yaitu karena akhir-akhir ini kang rohman jarang Online di blog, informasi ini pertama kali kang rohman dapat bukan dari situs asli blogger in draft akan tetapi dari blog sahabat kang rohman yaitu OOM. Tentang semua yang kang rohman tulis di atas sudah di bahas tuntas, silahkan baca di sini, di sini, di sini, di sini, dan di sini.

Khusus untuk kotak komentar langsung di bawah posting, bagi anda yang kode kotak komentarnya masih perawan alias belum di otak atik semisal bikin komentar memakai iframe seperti blog saya ini sebelumnya, tentu cukup hanya melakukan tutorial yang oom berikan. Namun bagaimana kalau sudah di otak atik seperti yang kang rohman posting di sini!, tentu saja anda tidak bisa begitu saja membuat kotak komentar langsung di bawah posting namun harus mengembalikan kepada kondisi semula.

Jikalau anda sedikit kreatif, tentu saja langkahnya sangat gampang yaitu anda tinggal baca tutorial kang rohman tersebut secara terbalik dari posting bawah ke posting atas, benarkan? namun jika masih bingung, pada posting berikutnya akan kang rohman posting. Kenapa tidak sekalian sekarang aja? hihihi... udah malem banget nih, kang rohman nnnngantuxxx..zzzzzz... jadi tunggu aja ya, besok pagi saya buatin dech... yu babay ah...mo tidur dulu........zzzzzzzzzz.

Tips Atasi Error Hasil Copy Paste Kode Dari Posting Wordpress

Dua hari yang lalu, ada pertanyaan yang masuk ke postingan Yang ini. Pertanyaan seperti ini :

aneh, sewaktu aku menambahkan tag script di template supa menampilkan read more githu deh di blog, bloger bilang ada kesalahan,

Dia bilang seperti ini : maafkan kami, kami minta maaf atas ketidaknyamanan ini, kirimkan kode error berikut untuk menyelesaikan masalah anda.

kode itu dikirim kemana ? Kenapa hal itu terjadi

Saya menambahkan scriptnya itu dari disini dan setelah aku simpan, terjadilah kesalahan itu.

Menurut yang berpengalaman, bagaimana menyelesaikannya

http://genalmadep.blogspot.com

makasih sebelumnya


Hayoh kenapa bisa error? begini nih ceritanya... sebenarnya mas fatih sendiri sudah menerangkan di akhir postingannya yaitu seperti ini :

Itu artinya tanda petik / kutip buka tutup (quote/unquote) yakni tanda ‘ dalam kode tidak cocok dengan font template. Yang perlu dilakukan adalah buang tanda kutip ['] itu dan kasih tanda kutip yang baru di tempat yang sama. Dan coba klik lagi SIMPAN


Akan tetapi ternyata masih tetap ada yang belum paham, ini terbukti dengan adanya pertanyaan yang seperti tadi di atas, Untuk itu kang rohman akan mencoba sedikit mengulasnya dan tentu saja dengan pandangan dan bahasa kang rohman sendiri. Namun sebelumnya saya mohon maaf untuk mas fatih guru ngeblog saya, bukan bermaksud untuk so so an pamer kepandaian namun hanya bermaksud berbagi informasi kepada teman-teman yang lain yang belum mengerti.

Kembali kepada pertanyaan di atas, kenapa sampai ada pesan error dari blogger? itu karena anda meng copy paste kode dari postingan blog yang menggunakan mesin Wordpress bukan dari postingan blog yang menggunakan mesin Blogger. Lho... ko ada apa dengan mesin worpress. Begini, antara mesin wordpress dengan blogger tentu saja ada perbedaan, begitupun dengan mesin posting nya. Jika anda menuliskan kode atau script semisal HTML ataupun javascript di dalam postingan, maka tanda kutip satu ( ' ) ataupun tanda kutip dua ( " ) akan secara otomatis di ubah. Apakah terlihat perubahannya? perubahannya tidak terlalu terlihat namun memang ada. tanda kutip yang asli bentuknya hampir tegak lurus dan kalau yang sudah di ubah, bentuk tanda kutif akan terlihat miring.

Kenapa hanya di karenakan bentuknya yang miring tapi fatal kejadiannya? tentu saja ini fatal, karena tanda kutif yang sudah di ubah oleh mesin posting wordpress tadi tidak di anggap atau bukan bagian dari bahasa perintah suatu script. Bagaimana cara mengantisipasinya? cara menantipasinya adalah tentu saja anda harus mengubah tanda kutip yang ada pada kode hasil dari copy paste dengan tanda kutip yang baru, berikut adalah ilustrasi dengan memakai bantuan gambar :


kode



Jika anda cermati gambar di atas, terlihat bahwa kode script hasil dari copy paste, tanda kutipnya terlihat bengkok-bengkok dan tanda kutip yang sudah di perbaiki terlihat tekag lurus. Sedikit tips dari kang rohman untuk lebih mempercepat penggantian tanda kutip tersebut adalah dengan menggunakan fasilitas replace, caranya adalah seperti ini :

  1. Copy paste kode yang mau di ubah ke dalam notepad.


  2. Klik menu Edit yang ada di bar menu bagian paling atas. Setelah keluar option pilihan, pilih Replace....



  3. replace option


  4. Copy tanda kutip dua ( “ ) yang ada (yang mau di ubah), kemudian paste pada kolom find what (ingat! harus di copy paste, jangan di ketik). Ketik tanda kutip dua ( " ) secara manual dari keyboard anda pada kolom Replace With. Kemudian klik pada tombol Replace All, maka secara otomatis seluruh tanda kutip dua ( “ ) akan di ubah semuanya dalam hitungan detik saja.



  5. replace all


  6. Ulangi langkah di atas untuk tanda kutip satu ( ' ).


  7. Selesai.


Perlu di perhatikan pula bahwa hasil pengubahan oleh mesin wordpress tersebut mengubah tanda kutip satu (') dan kutip dua ( " ) menjadi dua bentuk yaitu berdiri dan terbalik ( silahkan perhatikan benar-benar kodenya ), sehingga ketika melakukan langkah di atas anda harus melakukan unutk ke empat bentuk tersebut.

Langkah di atas bisa lebih mempersingkat kerja anda, karena walaupun tanda kutip berjumlah ribuan akan di ubah secara otomatis hanya dalam beberapa detik saja. Langkah selanjutnya tentu saja adalah kode yang di ubah sudah siap untuk di pasang pada template anda.

Buat anda pengguna wordpress.com yang suka menuliskan kode atau script di dalam postingan, agar terhindar dari hal yang tidak menyenangkan karena pembaca anda banyak yang berkomentar mengalami kegagalan ketika mengcopy paste kode dari anda, alangkah baiknya menyimpan script yang asli pada server lain semisal google pages. Misalkan di dalam postingan anda terdapat kata-kata seperti ini : kode lengkapnya bisa anda copy paste di sini!. Atau jika anda menggunakan mesin wordpress dengan hosting sendiri, anda bisa menggunakan plugin IG Syntax agar bisa menampilkan kode atau script langsung di dalam postingan anda.

Selamat mencoba.

Sahabat kang Rohman (5) : Nur Kholis Majid

Siapa yang tidak kenal sosok Nur Kholish Majid? pasti nama tersebut tidak asing lagi di telinga anda sekalian. Apakah sahabat kang rohman kali ini adalah Nur Kholish Majid yang di masksud? eeee.. bukan, ternyata serupa tapi tak sama, satu nama namun beda rasa.



Nur Kholish Majid adalah sahabat kang rohman yang menggeluti dunia design, biar tambah akrab berikut adalah profile beliau :





Nur Kholish Majid




  • Jenis Kelamin: Pria



  • Industri : Enjinering



  • Lokasi: Kebon Jeruk : Jakarta : Indonesia




Mengenai Saya



Saya bekerja di sebuah perusahaan IT di Jakarta, tepatnya di divisi Design.



Minat



3D Design, Graphic Design





Untuk mendedikasikan minat dan bakat beliau di bidang design, salah satunya adalah dengan membuat sebuah blog yang beralamat di http://3d-design-info.blogspot.com. Sesuai dengan nama dari alamat blog yang beliau miliki, topik yang banyak di tulis adalah seputar design 3D alias 3 dimenasi (awas jang ketuker dengan 3D yang lain ya: Di lihat, Di raba, Di terawang). Informasi yang di sajikan sangat menarik dan penuh dengan manfaat, sesekali ada free download software design 3D.



Penasaran seperti apa blognya Nur Kholish Majid? yuk kita ramai-ramai untuk mengunjungi blognya di http://3d-design-info.blogspot.com.


Free Logo Maker

Sebuah informasi ringan namun mudah-mudahan bermanfaat. Bagi anda yang ingin membuat sebuah logo yang unik untuk blognya, namun sedikit gaptek terhadap software-software grafik design, anda tidak usah berbingung ria dan larut dalam kesedihan yang amat sangat mendalam karena di alam cyber sana banyak sekali situs alias website yang menyediakan tool pembuat logo atau istilah kerennya yaitu Logo Maker Tool (hihihi.. ko segala istilah yang berbau bahasa bule di bilang keren ya. Padahal belum tentu lho!) yang di persembahkan untuk anda secara gratiss..tiss..tiss alias tidak bayar dhenk. Satu diantara ribuan website penyedia layanan ini yang perbah kang rohman jajal kemampuanya yaitu situs yang beralamat di http://www.logoease.com. Logo sederhana yang pernah saya coba adalah seperti gambar berikut ini :


 logo ku


Buat anda yang ingin mencoba, silahkan daftar dulu sebelum membuat sebuah logo, karena itu salah satu syarat yang dia minta. Proses cepat dan tidak rumit. Jika penasaran, coba saja kunjungi http://www.logoease.com.

Tutorial navigasi : Dynamic-FX Slide-In Menu (v 6.5)

slide in menu Beberapa hari yang lalu sahabat Wizurai meminta kang rohman untuk membuatkan tutorial cara membuat menu yang ada di blognya dengan alasan banyak sekali dari teman-temannya yang menanyakan cara membuat menu tersebut kepada beliau, dan..yepp.. kang rohman buatkan nih tutorialnya.

Menu yang ada di blog sobat Wizurai tersebut di namakan dengan Dynamic-FX Slide-In Menu (v 6.5), original source code serta contoh dari menu tersebut bisa anda lihat di dynamicdrive.com. Apa keunikan dari Dynamic-FX Slide-In Menu (v 6.5)? keunikanya yaitu menu atau navigasi tersembunyi di sebelah kiri layar monitor dan yang terlihat hanyalah bar menu nya saja, apabila menu tersebut di sorot oleh mouse komputer maka keluarlah menu-menu yang ada di dalamnya. Yang lebih menarik perhatian adalah menu tersebut selalu bergerak mengikuti gerakan scrolling sehingga akan selalu muncul di layar sebelah kiri layar monitor.

Tertarik membuat menu tersebut di blog anda, nih kang rohman tuliskan tutorial cara membuatnya :

Silahkan download dahulu source code yang nanti akan anda pakai. Klik pada gambar di bawah :


download here!



Setelah anda download file yang tadi, silah di ekstrak terlebih dahulu dengan software ekstraktor seperti winzip atau winrar.

ekstrak seperti ini!

Apabila file tersebut sudah diekstrak, maka akan menghasilkan dua buah file java seperti yang tampak pada ilustrasi gambar di atas. dua buah file java tersebut mempunyai nama ssm.js dan ssmItems.js, yang harus anda lakukan sebelum file tersebut di upload ke file server adalah melakukan editing untuk file ssmItems.js yaitu mengganti link-link yang ada dengan link yang anda inginkan untuk di simpan pada menu tersebut. Bagaimana cara mengedit file tersebut? agar tidak terlalu repot, maka saya akan menerangkan mengedit file tersebut dengan hanya menggunakan notepad, caranya adalah seperti ini :

  1. Klik kanan pada file yang bernama ssmItems.js, kemudian pilih open with lalu pilih notepad karena yang akan di gunakan adalah software tersebut.


  2. Setelah itu anda akan melihat file seperti ini :



  3. <!--

    /*
    Configure menu styles below
    NOTE: To edit the link colors, go to the STYLE tags and edit the ssm2Items colors
    */
    YOffset=150; // no quotes!!
    XOffset=0;
    staticYOffset=30; // no quotes!!
    slideSpeed=20 // no quotes!!
    waitTime=100; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
    menuBGColor="black";
    menuIsStatic="yes"; //this sets whether menu should stay static on the screen
    menuWidth=150; // Must be a multiple of 10! no quotes!!
    menuCols=2;
    hdrFontFamily="verdana";
    hdrFontSize="2";
    hdrFontColor="white";
    hdrBGColor="#170088";
    hdrAlign="left";
    hdrVAlign="center";
    hdrHeight="15";
    linkFontFamily="Verdana";
    linkFontSize="2";
    linkBGColor="white";
    linkOverBGColor="#FFFF99";
    linkTarget="_top";
    linkAlign="Left";
    barBGColor="#444444";
    barFontFamily="Verdana";
    barFontSize="2";
    barFontColor="white";
    barVAlign="center";
    barWidth=20; // no quotes!!
    barText="SIDE MENU"; // <IMG> tag supported. Put exact html for an image to show.

    ///////////////////////////

    // ssmItems[...]=[name, link, target, colspan, endrow?] - leave 'link' and 'target' blank to make a header
    ssmItems[0]=["MENU"] //create header
    ssmItems[1]=["Home", "http://www.blogspottutorial.com", ""]
    ssmItems[2]=["Free Template", "http://www.blogspottutorial.com/search/label/free%20template",""]
    ssmItems[3]=["Top Download", "http://www.blogspottutorial.com/2008/05/magazine-template-1.html", ""]
    ssmItems[4]=["SEO Ebook", "http://www.blogspottutorial.com/2008/05/free-seo-ebook-search-engine.html", "_new"]
    ssmItems[5]=["Submit Script", "http://www.dynamicdrive.com/submitscript.htm", ""]
    ssmItems[6]=["Link to Us", "http://www.blogspottutorial.com", ""]

    ssmItems[7]=["FAQ", "#nogo", "", 1, "no"] //create two column row
    ssmItems[8]=["Email", "#nogo", "",1]


    ssmItems[9]=["External Links", "", ""] //create header
    ssmItems[10]=["Blog Kang Rohman", "http://kolom-tutorial.blogspot.com", ""]
    ssmItems[11]=["Kang Rohman Dot Com", "http://kangrohman.com", ""]
    ssmItems[12]=["Unique Template", "http://template-unik.blogspot.com", ""]


    buildMenu();

    //-->



Pada prinsip dasarnya, kode-kode di atas adalah untuk mengatur tampilan dari Dynamic-FX Slide-In Menu (v 6.5) semisal warna tulisan warna background, bentuk hurup, besarnya hurup dan lain-lain. Akan tetapi karena keterbatasan waktu (cape dhenk kalo di bahas atu-atu mah), maka kang rohman hanya akan menerangkan acara mengganti tulisan menu serta link yang ada dengan link yang anda inginkan untuk dipasang pada menu ini, untuk kreasi yang lainnya silahkan explor sendiri oleh anda. Untuk mempermudah pengeditan, pada kode di atas sengaja kang rohman bedakan, ada yang berwarna hijau, biru serta warna merah. Tulisan yang berwarna hijau dengan tulisan SIDE MENU adalah tulisan yang akan muncul pada bar menu tersebut, anda bisa mengubahnya sesuka hati anda, misal mengganti tulisan tersebut dengan MY MENU, MENU GUE, NAVIGASI atau apa sajalah terserah anda. Tulisan yang berwarna biru adalah tulisan link yang akan muncul pada menu tersebut, tulisan-tulisan ini tentu saja bebas untuk anda ubah sendiri sesuai dengan keinginan, misal tulisan Home anda ingin ubah menjadi Depan atau apa saja.

Tulisan yang biru ini akan berpasangan dengan tulisan yang berwarna merah yang ada di sampingnya. Tulisan yang berwarna merah adalah link target yang anda inginkan, misal : tulisan Home apabila di klik ingin menuju halaman yang beralamat http://www.blogspottutorial.com, nah alamat http://www.blogspottutorial.com harus di ubah dengan alamat yang anda inginkan. Mudah-mudah dapat di mengerti.

Apabila anda sudah mengedit kode-kode di atas tadi, maka langkah selanjutnya adalah menyimpan file tersebut, caranya adalah klik pada file yang ada di bar menu, kemudian klik Save.

Setelah anda melakukan semua hal-hal yang saya tulis di atas, langkah yang harus anda lakukan adalah mengupload kedua file java tersebut ke server, agar lebih mudah silahkan anda upload file tersebut ke google pages. Belum tahu cara upload file ke google pages? hihihi..... sok atuh baca dulu tulisan kang rohman yang ini!. Kalau sudah di upload, jangan lupa untuk meng copy alamat URL kedua file tersebut.

Sekarang kita waktunya untuk beraksi, silahkan ikuti langkah-langkah berikut ini :

  1. Silahkan logi ke blogger dengan ID anda.


  2. Klik Tata Letak.


  3. Klik Edit HTML.


  4. Copy paste kode berikut di atas kode </head>


  5. <style type="text/css">
    <!--
    A.ssmItems:link {color:black;text-decoration:none;}
    A.ssmItems:hover {color:black;text-decoration:none;}
    A.ssmItems:active {color:black;text-decoration:none;}
    A.ssmItems:visited {color:black;text-decoration:none;}
    //-->
    </style>

    <SCRIPT SRC="http://kangrohman.googlepages.com/ssm.js" language="JavaScript1.2">
    //Dynamic-FX slide in menu v6.5 (By maXimus, http://maximus.ravecore.com/)
    //Updated July 8th, 03' for doctype bug
    //For full source, and 100's more DHTML scripts, visit http://www.dynamicdrive.com

    </SCRIPT>
    <SCRIPT SRC="http://kangrohman.googlepages.com/ssmItems.js" language="JavaScript1.2"></SCRIPT>


  6. Gantilah kode yang berwarna merah dengan kode milik anda (file yang tadi di upload).


  7. Klik tombol SIMPAMN TEMPLATE.


  8. Selesai. Silahkan lihat hasilnya.



Selamat mencoba!

Kang Rohman Kemana Aja nih, Ko Tidak Pernah Nongol?

Heuheuheu.. buntut dari kang rohman yang hampir seminggu tidak pernah muncul alias nongol di blog ini maka banyak pertanyaan yang berlalu lalang yang di antaranya adalah seperti judul postingan ini yaitu "kang rohman kemana aja nih, ko tidak pernah nongol? ada juga salah seorang sahabat kang rohman yaitu sobat masenchipz yang komentar kaya gini"what's up kang... kemana aja... lgi sibuk yakz... bnyk yg nanya2 tuh... dijawab kang... ntr pengunjungnya pada ngambek lho...hiks...hiks... "

Emangnya kalo kang rohman tidak ngeblog pada rindu ya sama kang rohman? , ya udah kalo emang pada rindu kang rohman ngeblog lagi dech biar ntuh kerinduanmu tidak di pendam dalam hati, ntar jadi jerawat batu lho, kan bahaya tuh . Trus kemana aja kang rohman selama tidak ngeblog? tidak kemana-mana sih cuma sedikit sibuk mempersiapkan beberapa blog baru untuk mau di terbitkan, salah satunya adalah mengganti blog kang rohman yang beralamat di http://rohman-freeblogtemplate.blogspot.com dengan domain milik sendiri agar lebih terlihat profesional yaitu dengan http://www.blogspottutorial.com.

Rencananya blog ini akan di garap (sawah kalii yee pake di garap segala) oleh dua orang yaitu saya sendiri dengan mas iwan free 7. Sesuai dengan nama URL nya yaitu http://www.blogspottutorial.com maka tema atau bahan yang akan di tulis adalah seputar blog lebih spesifik lagi mengenai blogging di blogspot atau blogger, namun selain tentang blog tutorial sebagai tamabahan seringkali ada free download template, free tool serta free ebook juga. Sayangnya blog ini tidak menggunakan bahasa indonesia namun memakai bahasa orang bule yaitu bahasa inggris, kenapa sih harus bahasa inggris tidak bahasa indonesia saja biar mudah di mengerti? mohon maaf! blog ini selain tempat untuk bagi-bagi ilmu namun sebagai tempat cari duit kang rohman serta kang iwan, yah kang rohman mata duitan dech? ya itu sih hak anda untuk menilai tapi yang jelas saya realistis saja, kang rohman juga manusia biasa butuh uang untuk keperluan keluarga kang rohman. Jadi, yang mau mencari ilmu serta berbagi rezeki ke kang rohman, sok atuh mampir ke blognya kang rohman yang di http://www.blogspottutorial.com.

Selain blog tadi, kang rohman juga sedang mempersiapkan satu blog yang membahas khusus tentang masalah template blogger, jadi bagi anda yang suka dan ingin tahu tentang design template blogger sepertinya cocok banget tuh, namun kang rohman masih bingung nih mau pakai bahasa inggris atau bahasa indonesia, jika pake bahasa inggris.. duhh report banget euy soalnya terus terang kang rohman tidak terlalu pandai berbahasa inggris, atau pake bahasa indonesia aja? ah orang indonesia mah kayanya sedikit pelit deh buat klik iklan yang ada, kan report jadinya "besar pasak daripada tiang" (dasar mata duitan).. yah gimana ntar dech, lagi di pikirkan dulu baik buruknya. Trus alamat URL nya mana? ada dech..masih rahasia, mallu soalnya masih telanjang belum ada isinya.

Eh terus gimana nasibnya kang rohman dot com sekarang? duhhh blog itu ya? masih blom sempet di urus, kemaren tuh isinya di hapus dan mau di jadiin situs portal, tapi akhirnya berubah fikiran juga dan rencananya tuh blog mau di jadikan blog pribadi kang rohman, isinya paling nanti cuma catatan-catatan kecil kang rohman , sepertinya tidak akan terlalu menarik untuk di simak.

Ada satu yang lupa, dulu kang rohman pernah meminta do'a nya para sobat setia kang rohman agar mendo'a kan kang rohman bisa bekerja di rumah pada pertengahan tahun ini dan ternyata meleset di sebabkan orang tua kang rohman tidak mengizinkan kalo untuk bulan ini, beliau (orang tua kang rohman) memberikan izin setelah hari raya idul fitri. Jadi, minta do'a nya lagi nih supaya setelah hari raya idul fitri kang rohman bisa full ngeblog di rumah.

Ya udah.. postingan ini hanya sekedar intermezo saja alias mengisi kekosongan yang mengakibatkan kerinduan bagi sebagian sahabat kang rohman. Sampai jumpa kembali pada tulisan-tulisan kang rohman berikutanya.. caw.. babayyy..

Sejak Kapan Kang Rohman Memakai Rok ?

Jum'at kemarin kang rohman pulang ke bandung menemui istri dan anak-anak kang rohman yang ada di bandung. Tak terasa dua hari berlalu begitu cepatnya, hari senin ternyata begitu semangatnya menghampiri kang rohman sehingga walaupun rasa kangen kepada keluarga belum terlalu terlampiaskan, dengan sangat terpaksa pakaian seragam untuk bekerja yang selalu melekat setiap sedang bekerja harus kembali melekat ke tubuh kang rohman.

Jam 5 pagi kaki ini sudah di langkahkan menuju terminal leuwi panjang bandung. Sesampainya di terminal tak lupa membeli sedikit oleh-oleh untuk teman di kantor, setelah itu langsung bergegas menuju bis jurusan tanjung priok. Kira-kira jam 6 pagi, bis baru mulai di berangkatkan. Awalnya arus lalulintas lancar dan terkendali (bapak polantas bilangnya begitu), sesampainya di kawasan pintu tol halim arus lalu lintas macet walaupun sedikit padat merayap (penyiar radio sonora bahasanya begitu). Situasi seperti itu memang sudah biasa terjadi di kawasan tersebut, akan tetapi hari ini sedikit berbeda, biasanya jika sudah melewati pintu tol halim arus menjadi lancar kembali dan ternyata hari ini memang beda, arus tetap macet walaupun tidak macet total alias padat merayap. Wal hasil jam 10 siang baru sampai di kantor tempat kang rohman bekerja. Kesiangankah saya? jelas kesiangan, soalnya jam masuk kerja adalah jam 9 (telat satu jam dech).

Setelah jam istirahat tiba, kang rohman coba buka email? duhhhh... banyak banget nih email, baru di tinggal 2 hari saja email yang masuk lebih dari seratus jumlahnya. Diantara email yang bejibun tersebut, ada satu email yang isinya lucu dan menggemaskan... mau tau isinya...? begininih (nama pengirim dan email pengirim tidak akan saya sebutkan..rahasia la yaw)...


mbak tolong ajarin aku cara ngganti template pada blokku dunk mbak ya plis.

.........blogspot.com


Aduhhhhhhh... sejak kapan kang rohman memakai rok?

Nah kalo gitu kita kenalan dulu dech biar tidak ada lagi kekeliruan di antara kita...hayoohhh...

Nama : (abdur) Rohman
Jenis kelamin : Pria tulen bho

Ngga percaya bahwa ane lelaki tulen? ini nih tampang yang sering di jumpai di sudut-sudut terminal di kota anda..

 

preman mangga dua

 

Ada juga yang terbaru, di photo hari ini (gara-gara mo buktiin kelelakianku) :

 

aku (untuk indonesiaku)

 

Masih belum yakin saya laki-laki? keterlaluan dech lho... ntar kang rohman laporin ke komnas perlindungan anak...hayoooohhhh..