Tampilkan postingan dengan label Memperindah Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Memperindah Blog. Tampilkan semua postingan

Artikel Terakhir dari Blog Ridho Tawaka

Artikel Terakhir dari Blog Ridho Tawaka - Tak terasa Blog Ridho Tawaka telah berjalan 3 tahun lebih lamanya. Saya pribadi mengucapkan terima kasih kepada pembaca setia dan mohon maaf jika blog ini banyak kekurangannya dari segi isi artikel, template dsb. Sebenarnya blog ini tetap ada tapi tidak akan di update (walau di update pasti akan dikerjakan beberapa tahun kedepan).

Alasan saya meninggalkan blog ini karena ingin fokus di Mr. Tawaka dan urusan lainnya. Memang berat meninggalkan sesuatu yang susah payah dibangun yang menghabiskan banyak waktu, apalagi yang ditinggalkan tersebut sudah lama bersama. Bercerita sedikit tentang pengalaman saya di dunia blog. Saya mengenal blog sekitar tahun 2012, saat itu saya sedang mencari artikel (lupa judulnya) lalu saya menemukan blog yang berisi kalau hanya lewat blog bisa membangun komunitas, "ketenaran", kalau blog sobat beruntung sobat bisa mendapatkan penghasilan dsb. Awalnya saya ragu untuk terjun langsung ke dunia blog karena saya pikir pasti banyak negatifnya, tapi pada awal tahun 2013 saya memberanikan diri untuk memulainya. Dari yang nggak ngerti apa itu blog, apa isi blog, bagaimana ini, bagaimana itu wah pokoknya dari yang nol sampai 40% mengerti blog saat itu.

Ucapan Terima Kasih
Artikel Terakhir dari Blog Ridho Tawaka - Karena pada akhir tahun 2015 saya rehat dari dunia blog, awal tahun 2016 ini tingkat perkembangan saya pada blog malah menurun 10%. Untuk alasan kenapa saya melanjutkan kembali dunia blog karena misi saya ada yang belum tercapai dan ada yang baru muncul saat saya rehat kemarin.

Pengalaman atau perjalanan karir Muhammad Ridho Tawaka bersama Blog Ridho Tawaka penuh suka dan duka. Kenapa saya sebut perjalanan karir, karena menurut saya seseorang yang baru, sedang atau sudah membuat karya yang bermanfaat untuk dirinya sendiri atau orang lain dengan atau tanpa imbalan itu disebut karir. Dalam satu blog atau website itu sebaiknya memiliki satu topik, kalau banyak (seperti blog ini) sebaiknya yang memang dicari saat ini atau beberapa bulan kedepan. Kenapa harus begitu? Begini, kalau sobat memiliki blog hanya satu topik apa yang terjadi? Blog tahu tujuannya mau kemana, pengunjung akan tetap tapi pasti ada kurangnya kan? Sayang, saya belum memiliki opini untuk kekurangannya. Kalau sobat memiliki blog banyak topik apa yang terjadi? Topik pasti banyak pilihan, pengujung dari berbagai "jenis" akan senang sama blog sobat tapi kurangnya apa? Blog bingung arahnya mau kemana, sobat sendiri kewalahan karena misal sobat lagi bercerita topik a tapi belum beres, disisi lain topik b ternyata ada masalah dan akhirnya topik c didiemin deh.

Sebenarnya nggak masalah sobat memiliki blog satu topik atau banyak, yang jelas sobat harus punya target mau diapakan itu blog, gimana jalan ceritanya dan kalau di akhiri ceritanya harus meriah. Maaf bagi sobat yang nggak mengerti dunia blog, tapi kalau sobat jadi tertarik memiliki blog bahkan website bisa ko dicari di blog ini atau cari di blog teman lainnya. Oh ya, biar sobat lebih tertarik lagi tentang blog, sobat tahu Raditya Dika? Manusia serba bisa yang awal karirnya dari blog! Memang isi blognya banyak topik dan nggak penting tapi dia tahu mau di kemanain itu blog. Nah, itu dia salah satu maksud saya.

Sudah kemana-mana ini isi artikel, saya cukupkan saja sampai disini. Terima kasih banyak untuk sobat pembaca setia Blog Ridho Tawaka dan selamat membaca artikel-artikel sederhana saya ini. Sampai jumpa di waktu yang tidak bisa di tentukan.
SELANJUTNYA

Cara Mudah Memasang Widget Lagu Di Blog

Cara Mudah Memasang Widget Lagu Di Blog - Walau widget ini termaksud Widget Yang Sebaiknya Tidak Ada Di Blog, namun setelah saya pikir-pikir widget ini berguna jika blog tersebut mempublikasikan artikel tentang sebuah band (ex: blog mengenai band avenged sevenfold, masukanlah lagu avenged sevenfold dari album pertama sampai yang terbaru).

Music! My Life


Cara Mudah Memasang Widget Lagu Di Blog:

1. Silahkan sobat kunjungi SCM Music Player

2. Pilih tampilan mana yang akan sobat pasang di blog lalu tekan tombol

Membuat music 1
Keterangan: Kolom merah untuk mengatur tampilannya


3. Masukkan:
  1. Nama Band
  2. Judul lagu
  3. Link URL: Bisa dari: Soundcloud atau Youtube (Jika dari youtube, saya sarankan ambil link-nya dari official music video karena terkadang url di youtube ada yang ga keluar suaranya).
Membuat music 2

4. Atur sesuai keinginan sobat (Auto Play harus sobat centang) lalu tekan tombol

Membuat music 3
Keterangan:
  • Auto Play: Agar lagunya bisa dimainkan (mulai dengan otomatis)
  • Shuffle Playback: Memutar lagu secara acak
  • Default Volume: Volume suara
  • Repeat Mode: Terbagi 3:
- Play Playlist Once: Hanya memutar 1 lagu
- Repeat Playlist: Mengulang lagu
- Repeat Item: Mengulang lagu setelah semua lagu selesai dimainkan
  • Placement of Player Bar: Posisi scmplayer
  • Show Playlist by Default: Menampilkan daftar lagu di samping kanan

5. Copy kode tulisan yang block warna biru

Membuat music 4

6. Lalu sobat pergi ke:

  • Blogger sobat => Template => Edit HTML
  • Cari kode <body> atau <body (Tekan CTRL+F agar mudah)
  • Paste tulisan yang diblock warna biru tadi (yang dapat di scmplayer) lalu pasang DIBAWAH <body> atau <body
  • Prantijau terlebih dahulu. Jika tidak error, simpan
7. Selesai

Begitulah artikel Cara Mudah Memasang Widget Lagu Di Blog yang saya buat untuk sobat.
SELANJUTNYA

Widget Komentar Blog Ada Di Blog

Widget Komentar Blog Ada Di Blog - Jika sobat sudah membaca artikel saya yang berjudul Widget Yang Sebaiknya Ada Di Blog Sobat, sekarang saat lah bagi sobat untuk (mungkin) melakukan saran yang saya tulis di artikel tersebut.

Widget Komentar Blog Ada Di Blog:

1. Login ke Blogger Sobat

2. Pilih Tata Letak => Tambah Gadget

3. Copy script dibawah ini:


    <div style="overflow:auto; width:100%px; height:250px; padding:0px; border:1px solid #999999;">
    <style type="text/css">
    #recentcomment {
    width:98%;
    margin-left:5px;
    }
    img.recentcomment-avatar {
    background:#fff;
    float:right;
    padding:2px;
    margin:2px -2px 0px 0px;
    height:30px;
    width:30px;
    border:solid #ddd 1px;
    }
    td div.recentcomment-content a,td div.recentcomment-content a:hover{
    font-family: 'trebuchet ms';
    font-size:1.00em!important;
    color:#2C2929;
    text-decoration:none;
    }
    div.recentcomment-content{
    font-size:1.00em!important;
    text-decoration:none;
    line-height:1.45em;
    letter-spacing:0.03em;
    background: #fff;
    padding:4px;
    border:1px solid #ddd;
    }
    </style><script type="text/javascript">
    ava_mode = "all";
    var cm_num = 10;
    var cm_desc = 13;
    var homepage = "http://ridhotawaka.blogspot.com/";
    </script>

    <script src="http://youdhie.googlecode.com/files/Recent%20Comment%20Thumbnail.js " type="text/javascript"></script>
    </div>

4. Simpan

Keterangan:
  • Warna Hijau: Ketinggian widget
  • Warna Merah: Total orang yang komentar 
  • Warna Biru: Url blog
  • Sebenarnya masih ada lagi yang bisa sobat ubah, namun saya yakin sobat bisa mengubahnya sendiri
Begitulah cara memunculkan Widget Komentar Blog Ada Di Blog. Semoga bermanfaat untuk sobat.
SELANJUTNYA

Tanda - Tangan Sobat Di Akhir Postingan (Otomatis)

Tanda - Tangan Sobat Di Akhir Postingan (Otomatis) - Sebaiknya sobat membaca artikel Tanda Tangan Sobat Berada Di Akhir Postingan terlebih dahulu karena pada tutorial Tanda - Tangan Sobat Di Akhir Postingan (Otomatis) adalah kelanjutannya. Selamat membaca dan mengikuti tutorial Tanda - Tangan Sobat Di Akhir Postingan (Otomatis).

Ridho Tawaka
Tanda - Tangan Sobat Di Akhir Postingan (Otomatis):

1. Login ke blogger => Setelan

Tutorial Membuat Tanda Tangan 12


2.
Tutorial Membuat Tanda Tangan 13


Jika muncul gambar seperti di atas, sobat pilih yang di beri kotak merah (Pos dan komentar)

3. Sobat cari tulisan Template Entri

4.
Tutorial Membuat Tanda Tangan 14

Keterangan:
  1. Masukan kode html tadi lalu sobat tekan nomor 2 (lihat gambar) karena
  2. Agar kode html tadi tersimpan secara permanen
  3. Untuk mengetes atau sobat sudah yakin untuk membuat sebuah artikel ada tanda tangan (otomatis)
  4. Jika sobat ingin menghilangkan kode tadi
5. Untuk melihat hasilnya:

Tutorial Membuat Tanda Tangan 15

Keterangan:
  1. Mode Html
  2. Mode Compose
Begitulah tutorial Tanda - Tangan Sobat Di Akhir Postingan (Otomatis). Semoga bermanfaat untuk sobat.
SELANJUTNYA

Membuat Bingkai Pada Postingan Blog

Membuat Bingkai Pada Postingan Blog - Pada bahasan sebelumnya, telah saya tulis bagaimana cara membuat Kotak Scroll dan Kotak Copy All pada postingan. Jika kali ini saya akan memberi informasi bagaimana cara Membuat Bingkai Pada Postingan Blog.

Membuat Bingkai Pada Postingan Blog:

  • 1. Pilih yang mana sobat inginkan:
1. Dashed

<div style="border: 1px dashed #000000; background-color:lime; padding: 5px; width: 300px;">Disini Tulisan Sobat</div>

2. Dotted

<div style="border: 1px dotted #000000; background-color:lime; padding: 5px; width: 300px;">Disini Tulisan Sobat</div>

3. Solid

<div style="border: 1px solid #000000; background-color:lime; padding: 5px; width: 300px;">Disini Tulisan Sobat</div>

4. Groove

<div style="border: 4px groove #000000; background-color:lime; padding: 5px; width: 300px;">Disini Tulisan Sobat</div>

5. Double

<div style="border: 4px double #000000; background-color:lime; padding: 5px; width: 300px;">Disini Tulisan Sobat</div>

6. Ridge

<div style="border: 4px ridge #000000; background-color:lime; padding: 5px; width: 300px;">Disini Tulisan Sobat</div>

7. Outset

<div style="border: 4px outset #000000; background-color:lime; padding: 5px; width: 300px;">Disini Tulisan Sobat</div>

  • 2. Jika sudah, ambil kode tersebut lalu masukan pada kolom HTML, bukan compose. 
  • 3. Selesai
Keterangan:
border: Tebal tipisnya jenis dan warna bingkai
background-color: Warna latar bingkai (jika tidak menginkan ada warna, bisa sobat hapus)
padding: Jarak antar bingkai dengan tulisan
widgth: Lebar bingkai
Begitulah cara Membuat Bingkai Pada Postingan Blog. Semoga bermanfaat untuk sobat.
SELANJUTNYA

Widget Popular Post (Pos Terpopuler) Diberi Scroll

Widget Popular Post (Pos Terpopuler) Diberi Scroll -  Jika pada artikel sebelumnya saya memberi tahu bagaimana cara memasang Widget Label dan Arsip Blog Diberi Scroll. Untuk kali ini, saya akan memberikan cara memasang Widget Popular Post (Pos Terpopuler) Diberi Scroll. Untuk selengkapnya silahkan dilihat tutorialnya.

Widget Popular Post (Pos Terpopuler) Diberi Scroll:

1. Pastikan sobat sudah memasang widget popular post

2. Template => Edit Html

3. Cari kode <div class='widget-content popular-posts'> (tekan CTRL + F)


4. Jika sudah, ganti kode nomor 3 dengan kode: <div class='widget-content popular-posts' style='overflow:auto;width:ancho;height:300px'>

5. Prantijau terlebih dahulu, jika tidak error


6. Simpan

- Note: Sesuaikan tinggi (height) dengan blog sobat 

Begitulah postingan tentang Widget Popular Post (Pos Terpopuler) Diberi Scroll. Semoga bermanfaat.
SELANJUTNYA

Tanda Tangan Sobat Berada Di Akhir Postingan

Tanda Tangan Sobat Berada Di Akhir Postingan - Buat apa sobat memasang tanda tangan di blog, salah satunya agar tulisan sobat terasa lebih khusus. Dan ternyata cara memasang Tanda Tangan Sobat Berada Di Akhir Postingan adalah mudah dan hasilnya cukup memuaskan. Ikuti langkah membuat Tanda Tangan Sobat Berada Di Akhir Postingan.

Ridho Tawaka
Tanda Tangan Sobat Berada Di Akhir Postingan:

1. Silahkan sobat kunjungi web mylivesignature

2.
Tutorial Membuat Tanda Tangan 1

Keterangan:
  1. Proceed : Jika sobat ingin membuat tanda tangan baru namun tanpa harus register
  2. Login : Sobat diharuskan register terlebih dahulu (nomor 3) lalu tekan nomor ini
  3. Register : Jika sobat ingin daftar, maka sobat tekan nomor ini
3.
Tutorial Membuat Tanda Tangan 2

Jika muncul gambar seperti diatas, sobat pilih yang diberi kotak merah (using the signature creation wizard)

4. Untuk membuat tanda tangan, ada langkah - langkahnya. Silahkan sobat ikuti langkah - langkahnya:

Tutorial Membuat Tanda Tangan 3

Step 1: Sobat masukan nama sobat di tempat yang sudah disediakan

Tutorial Membuat Tanda Tangan 4

Step 2: Sobat pilih jenis font yang sobat inginkan.

Keterangan:
  1. Jenis - jenis font
  2. Hasil tulisan dari berbagai jenis - jenis font
Tutorial Membuat Tanda Tangan 5
 

 Step 3: Jenis ukuran teks dari terkecil hingga terbesar


Step 4: Warna tanda tangan

Keterangan:
  1. Warna background
  2. Warna Tulisan 
  3. Menyesuaikan background dengan background halaman blog
  4. Hasil dari eksperimen sobat
Tutorial Membuat Tanda Tangan 7

Step 5: Tingkat kemiringan dari tulisannya. Silahkan sobat pilih apakah agak miring, miring atau sangat miring

Tutorial Membuat Tanda Tangan 8

Step 6: Menyimpan Gambar

Keterangan:
  1. Save Image As: Untuk menyimpan gambarnya di komputer sobat
  2. Want to use this signature?: Untuk menyimpan tanda tangan sobat di akhir postingan (otomatis)
Jika sobat memilih nomor 2, ikuti langkah di bawah ini:


Tutorial Membuat Tanda Tangan 9

Step 7: Setelah sobat memilih Want to use this signature?, sobat akan menuju halaman baru lalu sobat pilih yang di beri kotak merah (Generate HTML Code)

Tutorial Membuat Tanda Tangan 10

Step 8: Silahkan tekan tulisan Generate a code for my handwritten signature untuk mengambil kode html

Tutorial Membuat Tanda Tangan 11






Finishing: Lihat kode yang ada di tulisan Generated HTML Code for your signature: untuk di simpan di akhir postingan (otomatis)

Setelah di copy sobat paste. Namun sebelumnya sobat lihat artikel yang berjudul Tanda Tanda Sobat Di Akhir Postingan (Otomatis).

Begitulah cara memasang Tanda Tangan Sobat Berada Di Akhir Postingan. Semoga berhasil dan bermanfaat.
SELANJUTNYA

Beginilah Cara Mengganti / Menambah Emoticon Cbox

Beginilah Cara Mengganti / Menambah Emoticon Cbox -Cbox atau kepanjangan dari Chat Box adalah tempat atau sarana untuk berkomunikasi, memberikan kritik atau saran kepada pemilik blog tersebut.

Buku Tamu

Beginilah Cara Mengganti / Menambah Emoticon Cbox:

1. Sebelumnya sobat harus Membuat Buku Tamu Di Blogspot terlebih dahulu

2. Jika sudah memiliki, sobat login di Cbox

3.
Cbox 1

Lalu lihat pojok kanan atas: Option --> Smilies

4.
Cbox 2


Keterangan Kolom:
  1. Code: Rumus atau tulisan untuk menampilkan gambar yang diinginkan
  2. Alt.code: Tidak apa - apa jika ingin diisi atau tidak diisi
  3. Url: Masukan url gambar yang diinginkan sobat untuk dijadikan emoticon. Jika bingung atau tidak mengetahui, sobat bisa lihat di: Addemoticons
  4. Jika sobat ingin menambah url gambar, silahkan sobat gulir kebawah dan tekan tombol:
5. Jika sudah semua, sobat tekan tombol:

6. Selesai

Semoga dengan adanya tutorial Beginilah Cara Mengganti / Menambah Emoticon Cbox buku tamu sobat semakin banyak yang mengisinya.
SELANJUTNYA

Widget Yang Sebaiknya Tidak Ada Di Blog

Widget Yang Sebaiknya Tidak Ada Di Blog - Kali ini saya akan memberikan informasi kepada sobat tentang Widget Yang Sebaiknya Tidak Ada Di Blog. Karena sebelumnya saya telah mempublikasikan artikel yang berjudul Widget Yang Sebaiknya Ada Di Blog Sobat. Bagi sobat yang belum paham tentang widget atau gadget, di artikel sebelumnya telah saya jelaskan.

Widget Yang Sebaiknya Tidak Ada Di Blog:

  • Lagu
   Bagi sobat yang berniat atau sudah memasang gadget lagu, sebaiknya hindari atau hapus saja gadget ini. Selain membuat loading blog menjadi lama, pikirkan pengunjung (karena selera manusia berbeda). Jika pengunjung tidak menyukai lagu yang sobat pasang di blog, bisa - bisa pengunjung tadi malah kabur.

  • Label 
   Menurut opini beberapa blogger, gadget ini jika di pasang akan merugikan untuk blog, karena gadget ini tidak akan di indeks oleh google.

  •  IP Detector Widget
   Gadget ini berguna untuk memberikan informasi dari ip address, sistem operasi apa yang dipakai, dsb. Tapi informasi yang diberikan bukan informasi dari pemilik blog melainkan pengunjung. Jika sobat memakai gadget ini, pengunjung akan merasa bahwa ia sedang di mata - matai oleh pemilik blog.

  • Widget Salam Melayang
   Biasanya widget ini bertulisan: "Selamat Datang Di Blog bla bla bla" Silahkan klik "Ok" untuk melanjutkan. Kalau sobat ingin memberi salam atau sekedar perkenalan dari admin, sobat bisa menuliskannya di laman lalu simpan di menu navigasi. Selain praktis, pengunjung tidak akan di buat kesal karena ia tidak di suruh menekan tombol ok (lagi).

  • Kalender dan Jam
   Di rumah ada, saat sobat membuka hp atau komputer ada, di sekolah atau kantor juga ada. Jadi buat apa di pasang di blog. Lagi pula ke dua widget ini bisa memakan kecepatan loading blog juga

Untuk postingan yang saya buat yang berjudul Widget Yang Sebaiknya Tidak Ada Di Blog saya akhiri dan semoga bermanfaat.
SELANJUTNYA

Widget Yang Sebaiknya Ada Di Blog Sobat

Widget Yang Sebaiknya Ada Di Blog Sobat - Widget yang biasanya dibuat dalam bentuk javaScript, Css, DHTML atau Adobe Flash ini, dapat dipasang atau digunakan oleh halaman web atau blog yang tujuannya agar pengunjung senang dan betah di blog tersebut. Namun ga semua gadget atau widget itu dapat dipasang oleh blogger untuk blognya, ada beberapa yang harus dan tidak dipasang di blog tersebut. Kali ini saya akan memberi sedikit info gadget yang harus ada di blog.

Widget Yang Sebaiknya Ada Di Blog Sobat:

  • 1.  Search Engine
      Search engine atau mesin pencari adalah Widget nomor satu yang sebaiknya harus sobat pasang di blog. Karena gadget ini hanya membutuhkan kata kunci yang pembaca inginkan, dan itu biasanya bekerja secara tepat dan cepat.

  • 2. Related Posts
     Related Posts atau dalam bahasa indonesianya "Artikel Terkait" akan mempermudah pengunjung untuk membaca artikel yang sama dengan tulisan yang sedang di baca oleh pengunjung. Selain mempermudah, menurut beberapa blogger yang lebih banyak pengalaman di dunia blog, artikel terkait atau related posts ini salah satu widget yang bersifat seo, sehingga setiap blog harus memasangnya

  • 3. Recent Comment
     Adalah Sebuah gadget yang berisikan komentar - komentar terbaru. Jika ada pengunjung yang berkomentar di blog tersebut dan pengunjung tersebut atau lainnya membaca komentarnya ada dan langsung ditanggapi pemilik blog dengan cepat, tak heran jika pengunjung lainnya akan bersemangat untuk berkomentar di blog tersebut


  • 4. Popular Post
     Yaitu Sebuah widget yang menampilkan artikel terbaik atau terpopuler yang sobat miliki. Namun gadget ini masih diperbincangkan oleh blogger lainnya apakah gadget ini harus atau sebaiknya jangan dipasang blog. Karena ada yang bilang, widget ini justru akan merugikan si pemilik blog tersebut "Karena gadget ini akan memberikan jalan kepada spammers untuk menCopas pada artikel terpopuler tersebut"

  • 5. Blog Archives 
    Dengan memasang widget ini blog, pengunjung akan mengetahui postingan yang ada di blog tersebut dalam bulan tertentu. Widget ini dapat mengelompokkan postingan pada bulan Januari, Februari Dst


Begitulah postingan tentang Widget Yang Sebaiknya Ada Di Blog Sobat. Semoga bermanfaat untuk sobat.

Untuk postingan tentang Widget Yang Sebaiknya Tidak Ada Di Blog <= Silahkan dilihat.
SELANJUTNYA

Cara Membuat Buku Tamu Menempel Dipinggir Blog

Cara Membuat Buku Tamu Menempel Dipinggir Blog - Sebelum melangkah lebih jauh untuk membuat buku tamu berada di samping blog, bagi sobat yang belum membuat buku tamu, silahkan membaca artikel sebelumnya Membuat Buku Tamu Di Blogspot. Setelah memiliki buku tamu, sekarang saatnya memperindah buku tamu tersebut, yakni Cara Membuat Buku Tamu Menempel Dipinggir Blog (lebih tepatnya dikiri). Untuk membuatnya, silahkan disimak caranya.

Cara Membuat Buku Tamu Menempel Dipinggir Blog:

1. Login ke blogger => Tata Letak => Html/Javascript

2. Masukan kode dibawah ini dan paste di kotak html tersebut

<style> #hcl { position:fixed; top:135px; left:20px; z-index:+500; } * html #hcl {position:relative;} .hcltab { height:200px; width:30px; float:left; cursor:pointer; background:url('http://imageshack.us/a/img818/8991/eoil.png') no-repeat; } .hclcontent { float:left; border:4px solid #5F9EA0; background:#F5F5F5; padding:3px; } .hc-credit {font-size:9px}
 .hc-credit a {text-decoration:none} </style> <script type="text/javascript"> function showHidehcl(){ var hcl = document.getElementById("hcl"); var w = hcl.offsetWidth; hcl.opened ? movehcl(0, 30-w) : movehcl(20-w, 0); hcl.opened = !hcl.opened; } function movehcl(x0, xf){ var hcl = document.getElementById("hcl"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; hcl.style.left = x.toString() + "px"; if(x0!=xf){setTimeout("movehcl("+x+", "+xf+")", 10);} } </script> <div id="hcl"> <div class="hclcontent">

<--- Letakan Kode Buku Tamu Disini --->

<div style="text-align: right; font-size: 10px;">
              Widget by
              <a href="http://ridhotawaka.blogspot.com/2013/04/membuat-buku-tamu-di-blogspot.html">
                  Blog Ridho Tawaka
              </a>
          </div>


<br /> <div class="hc-credit"> <span style="float:left"> <!-- THIS CREDIT MUST STAY INTACT FOR LEGAL USE -->  </span> <span style="float:right"> <a href="javascript:showHidehcl()">  </a> </span> </div> </div> <div class="hcltab" onclick="showHidehcl()"> </div>   <script type="text/javascript"> var hcl = document.getElementById("hcl"); hcl.style.left = (30-hcl.offsetWidth).toString() + "px"; </script></div>

Note: Kode <---Letakan kode buku tamu disini---> ganti dengan kode script buku tamu sobat

4. Simpan


Itulah postingan tentang Cara Membuat Buku Tamu Menempel Dipinggir Blog yang bisa saya berikan. Semoga Bermanfaat.
SELANJUTNYA

Widget Label Dan Arsip Blog Diberi Scroll

Apakah arsip atau label sobat memanjang kebawah? Sehingga membuat tampilannya terlihat tidak rapi atau tidak enak dilihat. Jika benar, tidak ada salahnya sobat mencoba trik yang saya beri ini, selain terlihat rapi, trik ini bisa membuat blog tidak terlihat berantakan dan enak dilihat. Ok langsung saja silahkan dicoba triknya:

Label Blog Diberi Scroll
:
1. Pastikan sobat sudah memasang widget label di blog

2. Template --> Edit Html

3. Cari kode <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'> (tekan CTRL + F)

4. Jika sudah, copy kode <div style='overflow:auto; width:ancho; height:220px;'> dan paste dibawah kode nomor 3

5. Cari lagi kode </b:includable>

6. Kemudian copy kode </div>  dan paste diatas kode nomor 5

7. Prantijau terlebih dahulu, jika tidak error

8. Simpan

Note:
  • Jika kode nomor 3 tidak ketemu, silahkan cari kode <div class='widget-content'>
  • Sesuaikan tinggi (height) dengan blog sobat
Arsip Blog Diberi Scroll:
1. Pastikan sobat sudah memasang widget arsip blog

2. Template --> Edit Html
 
3. Kemudian cari kode type='BlogArchive'  (tekan CTRL + F)

4. Lalu perhatikan kode seperti dibawah ini

<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div class='widget-content'>
  <div id='ArchiveList'>

5. Tambahkan kode style='overflow:auto; height:200px'  setelah kode warna merah, nanti tampilannya seperti:

<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div class='widget-content' style='overflow:auto; height:200px'>
  <div id='ArchiveList'>

6. Prantijau terlebih dahulu, jika tidak error

7. Simpan

Note: Sesuaikan tinggi (height) dengan blog sobat

Semoga postingan tentang Widget Label Dan Arsip Blog Diberi Scroll sobat mengerti dan paham.
SELANJUTNYA

Cara Membuat Link Blog Menari

Cara Membuat Link Blog Menari - Sebelumnya telah saya bahas tentang cara Membuat Menu Tab View. Kali ini saya ingin memberikan tutorial yang cukup menarik. Kelebihan memakai kode script ini, jika ada teks yang diberi link, teks tersebut akan bergerak. Nah bagi sobat yang ingin memakainya, silahkan dilihat tutorialnya Cara Membuat Link Blog Menari.

Cara Membuat Link Blog Menari:

1. Login ke blogger => Template => Edit HTML

2. Cari kode </head>

3. Copy kode dibawah ini dan pasang DIATAS kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
$('a').hover(function() { //mouse in
$(this).animate({ marginLeft: '12px' }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});</script>

4. Simpan

Mudah kan caranya? Itulah tutorial tentang Cara Membuat Link Blog Menari yang bisa saya berikan untuk sobat, semoga bermanfaat.
SELANJUTNYA

Widget Twitter Dan Berbagai Warnanya Di Blog

Widget Twitter Dan Berbagai Warnanya Di Blog - Twitter adalah layanan jejaring sosial yang sangat populer selain Facebook dan Google+. Tentu sobat sudah mengetahui bahkan sudah mempunyai, agar twitter sobat tambah dikenal orang, tak ada salahnya sobat memasang widget burung twitter ini di blog sobat. Untuk cara memasang Widget Twitter Dan Berbagai Warnanya Di Blog lihat di bawah ini.

Follow

Widget Twitter Dan Berbagai Warnanya Di Blog:

1.  Login ke blogger sobat => Tata Letak => Tambahkan Gadget => Html/JavaScript

2. Masukan kode dibawah ini:

<!-- floating twitter Bird -->
<script type="text/javascript" src="http://bloggerpeer.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="http://2.bp.blogspot.com/-7doZyLsr9yI/TqNtUCClP4I/AAAAAAAAAF8/ld0bdD3WWj8/s1600/burung+twitter+terbang.png";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");
var twitterAccount = "http://twitter.com/nama sobat";
var tweetThisText = "Twitter - UserID http://bloggerpeer.blogspot.com/";
tripleflapInit();
</script>

3. Simpan

Note: Warna merah: Nama twitter sobat

Pilihan Warna - Warna Burung Terbang Twitter

Jika sobat ingin mengganti warna burung menjadi warna lain, lihat caranya:

Warna Ungu
    http://3.bp.blogspot.com/-Ec4JlrN6yc4/TqN5tIAXDpI/AAAAAAAAAG0/ywnjHeG4ASM/s1600/purple+bird.png
Warna Hitam
    http://1.bp.blogspot.com/-N3RvHfV3MUk/TqN5iPPqAEI/AAAAAAAAAGU/oYKSvsOj108/s1600/black+bird.png
Warna Biru
    http://3.bp.blogspot.com/-FNowQ1mqsLg/TqN5kxq86EI/AAAAAAAAAGc/VzatkjsUAEc/s1600/Blue+bird.png
Warna Kuning
    http://3.bp.blogspot.com/-xL1Dk6Bhi4g/TqN5gbyvSCI/AAAAAAAAAGM/jxsjBiRWMLw/s1600/yellow+bird.png
Warna Hijau
    http://3.bp.blogspot.com/-SJP4OZmyeCU/TqN5qcyXgGI/AAAAAAAAAGs/jKQaqHF9EkA/s1600/Green+bird.png
Warna Merah
    http://1.bp.blogspot.com/-knGCnCFCahI/TqN59awa61I/AAAAAAAAAHE/mniE1h9IW14/s1600/red+bird.png
Warna Coklat
    http://3.bp.blogspot.com/-b-9ncuDJxm0/TqN5nrOnTCI/AAAAAAAAAGk/LREurKp_tLc/s1600/brown+bird.png
Warna Putih
    http://1.bp.blogspot.com/-qsxd6A0vUFU/TqN5vZVI2-I/AAAAAAAAAG8/lb0Ol5Nbrvw/s1600/white+bird.png
Begitulah cara memasang Widget Twitter Dan Berbagai Warnanya Di Blog yang bisa saya berikan untuk sobat.
SELANJUTNYA

Membuat Menu Tab View Tanpa Edit HTML

Membuat Menu Tab View Tanpa Edit HTML - Sobat tahu apa itu menu tab view di blog? Itu loh yang satu kotak biasanya beri isi 2 atau 3 widget. Jika sobat ingin membuatnya? Ikuti langkah dibawah ini.

Membuat Menu Tab View Tanpa Edit HTML:

1. Login ke blogger => Tata Letak => Tambah Gadget => Html/Javascript

2. Copy kode dibawah ini


<style type="text/css">
.blogtabs {padding: 0px !important;border: 0 solid #bbb;}
.blogtabs h2 {float: left;margin: 0 2px 4px 0;font-size: 12px;padding: 3px 5px;border: 1px solid #2ac427;overflow: hidden;position: relative;background: #000000;cursor:pointer;}
html .blogtabs h2.active {background: #ffffff;}
.blogtabs .widget-content {border: 1px solid #000000;padding: 10px;-moz-box-shadow: 1px 1px 10px #888;
-webkit-box-shadow:1px 1px 10px #888;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;;background: #ffffff;clear:both;margin:0;}
.btab, #showtabs {display:none;}
</style><br />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script><br />
<script type="text/javascript" src="http://magetan-project.googlecode.com/files/SimpleTabViewJQuery.js"></script><br />
<script type="text/javascript">
$(document).ready(function() {
$('#showtabs').simpleBlogTab ({organictabs: 3});
});
</script><br />
<div id="showtabs">
</div>



Note: Untuk pemasangannya begini:

Tata Letak Blog RT


  • Warna hijau: Warna GARIS kotak DI TAB 2 dan 3. Silahkan sobat sesuaikan dengan selera sobat
  • Warna biru: Warna KOTAK DI TAB 2 dan 3. Silahkan sobat sesuaikan dengan selera sobat
  • Warna merah: Warna KOTAK DI TAB 1. Silahkan sobat sesuaikan dengan selera sobat
  • Warna kuning: Warna GARIS kotak DI WIDGET. Silahkan sobat sesuaikan dengan selera sobat
  • Warna oren: Warna KOTAK DI WIDGET. Silahkan sobat sesuaikan dengan selera sobat
3. Simpan

Semoga dengan adanya artikel yang berjudul Membuat Menu Tab View Tanpa Edit HTML bias bermanfaat bagi sobat
SELANJUTNYA

Membuat Kotak Scroll Di Postingan Blog

Membuat Kotak Scroll Di Postingan Blog - Saya akan memberikan trik lagi agar blog sobat lebih menarik. Ok tanpa panjang lebar lagi, langsung ke TKP.

Membuat Kotak Scroll Di Postingan Blog:

1. Login ke blogger => Pos => Entri Baru

2. Copy kode dibawah ini dalam bentuk HTML, bukan compose:

<span><span style="font-style: italic;"><span style="font-style: italic;"><div style="height: 150px; width: 250px; font: 16px/26px Georgia,Garamond,Serif; overflow: scroll;">Masukan tulisan, gambar atau HTML disini</div>

3. Maka hasilnya akan seperti ini:


Masukan tulisan, gambar atau HTML disini

4. Prantijau terlebih dahulu, jika sudah yakin.

5. Publikasikan

Note:
  • Warna hijau: Tingginya 150px, ganti dengan selera sobat
  • Warna biru: Lebarnya 250px, ganti dengan selera sobat
  • Warna merah: Tulisan, gambar atau HTML yang ingin ditampilkan didalam scroll

Begitulah postingan tentang Membuat Kotak Scroll Di Postingan Blog semoga bermanfaat postingan saya ini.
SELANJUTNYA

Membuat Header Blog Ber-Link

Membuat Header Blog Ber-Link - Header blog atau bisa disebut judul nama blog sobat yang terletak diatas blog. Jika sobat ingin merubah blog sobat yang cuman tulisan doang, menjadi tulisan + gambar + bisa di klik lagi. Ikuti langkah dibawah ini.

Blog Ridho Tawaka

Membuat Header Blog Ber-Link:

Jika sobat ingin membuat header ber-link, sobat harus menyiapkan:
  1. Desain header (.jpg .png .jpeg dll)
  2. Adobe Dreamwaver
  3. Akun Image Hosting
Setelah semua siap, langsung meluncur ke TKP.

  • 1. Desain Header

Tentu sobat harus mendesain header sobat se kreatif mungkin. Sobat bisa memakai Photoshop, Photoscape, Paint Dll 

  • 2. Adobe Dreamwaver


Adobe Dreamwaver 1

Jika sudah jadi headernya, sobat ikuti langkah ini: Buka Adobe Dreamwaver => File => New => html => Create

Adobe Dreamwaver 2

Jika sudah tampilannya seperti diatas, sobat pilih Insert => Image => Cari header yang sobat buat => Ok

 Adobe Dreamwaver 3


Sobat block tulisan setelah tag <body> sampai </body> seperti gambar diatas. Setelah itu lihat gambar seperti dibawah ini.

Adobe Dreamwaver 4

Lihat yang kolom yang didalam garis merah. Sobat pilih bentuk yang kotak, oval atau poligon yang nanti bisa di klik

Adobe Dreamwaver 5

Lihat yang saya beri nomor:
  1. Link: Isi dengan link yang nanti jika ditekan akan menuju sebuah web atau blog
  2. Target: "Blank" => Jika di klik akan muncul di tab baru. "Parent" => Tab yang sama dll
  3. Alt: Dikosongkan juga tidak apa-apa
Jika sudah pilih: File => Save As => Ok

  • 3. Akun Image Hosting

Silahkan sobat pilih akun mana yang bisa meng upload header. Bagi sobat yang belum punya akun image hosting, sobat bisa pilih akun imageshake (Karena saya pakai yang imageshake). Nah kalau sudah, silahkan sobat upload header tersebut (bukan yang dari adobe dreamwaver, tapi yang dari desain awal). Kalau sudah ambil deh kodenya yang ada di share it --> Direct



Sobat buka file HTML yang tadi sobat buat dari adobe dreamwaver menggunakan Notepad. Cara membukanya: Klik Kanan di file tersebut => Open with => Notepad  

Notepad 1

Lihat yang saya block, sobat ganti kode tersebut dengan url yang sobat upload tadi. Kalau sudah di ganti sobat pilih File --> Save. Sobat buka lagi file HTML tadi dengan Klik Kanan di file tersebut => Open with => Notepad. Jika sudah sobat copy yang ada di tag antara <body> sampai </body>

Notepad 2

Kalau sudah, sobat: Login ke blogger => Tata Letak => Tambah Gadget => HTML/Javascript => Masukan kode yang tadi (file HTML) disitu.

Note:
  1. Penempatan widget yang isinya kode html tadi di atas ya (kan namanya juga Header (atas), kalau bisa diatas header, jika sobat tidak tahu cara Menambah Kolom Diatas Header <= lihat caranya 
  2. Template yang bisa diganti template bawaan blogger (bukan bawaan blogger saya kurang mengetahui)
Selamat sekarang header blog sobat berubah. Begitulah cara Membuat Header Blog Ber-Link yang bisa saya berikan.
SELANJUTNYA

Mengubah Tampilan Sidebar Blog

Mengubah Tampilan Sidebar Blog - Sidebar blog itu tempatnya berada di samping posting (kiri atau kanan blog). Jika sobat menginginkan sidebar blog bawaan blogger terlihat menarik. Silahkan lihat cara dibawah ini.

Mengubah Tampilan Sidebar Blog:

1. Login ke blogger --> Template --> Edit HTML

2. Cari kode .sidebar h2 {.  Jika tidak ada, cari kode h2 { 

3. Jika blog sobat terdapat kode h2 {. Maka tampilannya seperti dibawah ini:

/* Headings
h2 {
     font: $ (widget. title. font) ;
     text-transform: $ (widget. title. text. transform) ;
     color: $ (widget. title. color) ;
     margin: .5em 0;  

4. Ganti kode berwarna merah dengan di bawah ini:

.sidebar h2 {

font-size:110%;

font-weight:bold;

text-transform:uppercase;

text-align:right;

border: 1px solid #000;

background:#ffffff;

padding;10px;

}

Note:

  • 110%: Nilai huruf judul sidebar. Bisa sobat ganti menjadi nilai satuan Persen, atau Pixel, yang persen bisa menjadi 100%, 150%, 200% dan angka lainnya. Jika yang pixel menjadi 10 px, 15 px, 20 px dan angka lainnya.
  • Bold: Berarti tulisan di judul sidebar tebal. Jika ingin tulisannya biasa saja, ubah menjadi normal. Jika ingin tulisannya miring, ubah menjadi italic.
  • Uppercase: Berarti huruf judul sidebar besar semua, jika ingin huruf depannya saja (Inisial) ubah menjadi capitalize. Jika ingin huruf kecil semua, ubah menjadi lowercase.
  • Right: Berarti posisi tulisannya di kanan. Jika ingin tulisannya di kiri, ubah menjadi left. Jika ingin tulisannya di tengah, ubah menjadi center.
  • 1px solid #000: Berarti ada garis mengelilingi judul sidebar. Judul sidebar disini berukuran 1 px dengan warna hitam. Bisa sobat ubah sesuai keinginan sobat.
  • ffffff: Berarti warna background putih. Jika ingin warna lain, bisa sobat ubah sesuai keinginan sobat dengan melihat di: Kode Warna Html.
  • 10px: Berarti ukuran padding sebesar 10 px. Perlu anda tambahkan apabila sobat menggunakan warna background (Jika sobat tidak memakai background, akan terlihat kurang menarik). Fungsi dari padding agar tidak terlihat bertabrakan dengan bagian luar.

Note: Ukuran padding blog saya menjadi: 10px 13px 8px 30px

Peringatan: Cara ini berguna untuk template bawaan blogger

Berikut cara Mengubah Tampilan Sidebar Blog yang bisa saya berikan untuk sobat
SELANJUTNYA

Membuat Recent Post Di Blog

Membuat Recent Post Di Blog - Recent post adalah suatu tempat yang menyediakan artikel terkini atau postingan terbaru yang baru saja sobat buat. Jika sobat ingin recent post ada di blog sobat, silahkan di simak.

Recent Post

Membuat Recent Post Di Blog:

1. Login ke blogger --> Tata Letak --> Tambah Gadget --> HTML/Javascript

2. Masukan kode ini:

     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">
    </script>
    <style media="screen" type="text/css">
    <!--
    #spylist {
    overflow:hidden;
    margin-top:5px;
    padding:0px 0px;
    height:350px;
    }
    #spylist ul{
    width:220px;
    overflow:hidden;
    list-style-type: none;
    padding: 0px 0px;
    margin:0px 0px;
    }
    #spylist li {
    width:208px;
    padding: 5px 5px;
    margin:0px 0px 5px 0px;
    list-style-type:none;
    float:none;
    height:70px;
    overflow: hidden;
    background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
    border:1px solid #ddd;
    }
    #spylist li a {
    text-decoration:none;
    color:#4B545B;
    font-size:11px;
    height:18px;
    overflow:hidden;
    margin:0px 0px;
    padding:0px 0px 2px 0px;
    }
    #spylist li img {
    float:left;
    margin-right:5px;
    background:#EFEFEF;
    border:0;
    }
    .spydate{
    overflow:hidden;
    font-size:10px;
    color:#0284C2;
    padding:2px 0px;
    margin:1px 0px 0px 0px;
    height:15px;
    font-family:Tahoma,Arial,verdana, sans-serif;
    }
    .spycomment{
    overflow:hidden;
    font-family:Tahoma,Arial,verdana, sans-serif;
    font-size:10px;
    color:#262B2F;
    padding:0px 0px;
    margin:0px 0px;
    }
    -->
    </style>
    <script language="JavaScript">
    imgr = new Array();
    imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
    showRandomImg = true;
    boxwidth = 255;
    cellspacing = 6;
    borderColor = "#232c35";
    bgTD = "#000000";
    thumbwidth = 70;
    thumbheight = 70;
    fntsize = 12;
    acolor = "#666";
    aBold = true;
    icon = " ";
    text = "comments";
    showPostDate = true;
    summaryPost = 40;
    summaryFontsize = 10;
    summaryColor = "#666";
    icon2 = " ";
    numposts = 15;
    home_page = "http://ridhotawaka.blogspot.com/";
    limitspy=4
    intervalspy=4000
    </script>
    <div id="spylist">
    <script src="http://infonetmu.googlecode.com/files/recentpostthumbslideshow.js" type="text/javascript">
    </script></div>

3. Simpan

Note:
Warna merah: JUMLAH post yang ingin ditampilkan. Ganti sesuai kebutuhan sobat
Warna biru: URL blog. Ganti dengan url blog sobat

Begitulah postingan tentang cara Membuat Recent Post Di Blog. Semoga sobat paham dan mengerti.
SELANJUTNYA

Membuat Kotak Copy All Di Postingan Blog

Membuat Kotak Copy All Di Postingan Blog - Tombol ini berguna untuk pengunjung meng copy tulisan atau kode html/javasript secara langsung. Ok daripada panjang lebar, langsung meluncur ke caranya.

Membuat Kotak Copy All Di Postingan Blog:

1. Login ke blogger --> Buat entri baru --> Pilih mode HTML

2. Masukan kode ini:

<div><form name="copy"><div align="center"><span><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" value="Copy all" type="button"> </span></div><p align="center"><textarea style="width: 200px; height: 100px;" name="txt" rows="5" wrap="VIRTUAL" cols="20">Masukan Teks Tulisan Atau Kode Html/Javascript Disini</textarea></p></form></div>

3. Maka hasilnya akan seperti ini:


4. Selesai

Note:
  • Warna merah: Bisa sobat ganti dengan kata-kata sobat (ex: Highlight All, Tekan Ini Dsb)
  • Warna biru: Lebar widget
  • Warna hijau: Tinggi widget
  • Warna oren: Teks atau kode Html/Javasript yang ingin sobat masukan
Begitulah postingan tentang Membuat Kotak Copy All Di Postingan Blog, Semoga berhasil dan bermanfaat bagi sobat.
SELANJUTNYA

Sponsor: Dmca ǀ Tynt ǀ Copyscape ǀ Pengunjung
Gambar template oleh A330Pilot. Diberdayakan oleh Blogger.