Cara memasang iklan dibawah judul dan dibawah postingan

Memasang iklan dibawah judul dan dibawah postingan blog tentu akan membuat tampilan menjadi menarik untuk dilihat termasuk ukuran dan posisi iklan juga sangat menentukan memberi kesan blog itu tersendiri, disamping itu memasang ikan dibawah judul dan dibawah postingan akan mempermudah orang melihat apa yang kita iklankan diblog, Apabila belum punya atau belum mendaftar di Google Adsense silahkan KLIK DISINI Cara memasang Iklan Google Adsense diblog, berikut cara memasang iklan dibawah judul dan dibawah postingan blog :
  1. Masuk Ke Google Adsense >> klik Iklan saya >> Klik +Unit Iklan Baru


  2. Silahkan Isi data form :
    Nama seperti contoh “namaanda_iklan dibawah header”
    Ukuran Iklan klik tanda bawah pilihan ukuran sesuaikan selera anda dst


  3. Klik Simpan dan dapatkan kode


  4. Apabila kode HTML sudah ditampilkan silahkan parse kode tersebut


  5. Bungkus kode yang diparse tadi seperti ini :

  6. <div style='clear:right; float:center; margin-left:15px;'>
    Kode Adsense yang sudah diparse disini
    </div>

  7. Sign in di blogger
  8. Klik Opsi lainnya
  9. Klik Templete
  10. klik Edit HTML
  11. Centang tulisan Expand Widget Templates
  12. Cari kode :
    <div class='post-header-line-1'/>  untuk dibawah judul
    <data:post.body/>  untuk dibawah postingan
    (gunakan tombol CTRL + F untuk mempermudahkan pencarian kode)
  13. copy dan pastekan kode yang sudah dibungkus dan diparse tadi dibawah kode :
    <div class='post-header-line-1'/>  untuk dibawah judul
    <data:post.body/>  untuk dibawah postingan
    (biasanya ada 2 kode , cari dan pasangkan di kode yang kedua)
  14. Klik Pratinjau dan apabila tidak ada kesalahan >> klik Simpan
Demikian postingan saya kali ini mudah – mudahan bermanfaat

Cara memasang iklan Google Adsense di gadget

Dalam membuat iklan di gadget haruslah ditentukan posisi iklan tersebut ditempatkan dan disesuaikan dengan tata letak template blog yang dipakai, kita dapat mengatur ulang Tata letak tempelate blog apabila posisi untuk menempatkan iklan tidak sesuai dengan keinginan. Berikut cara memasang iklan diblog. Cara memasang iklan di Sidebar atau Gadget
  1. "Sign in" diblogger
  2. Klik Opsi Lainnya
  3. Klik "Tata Letak" >> Klik "Tambahkan Gadget/Add Gadget"
  4. Selanjutnya gulir kebawah apabila sudah mendaftar di Google Adsense akan ada tulisan "Adsense", apabila belum dikaitkan dengan Google Adsense silahkan KLIK DISINI Cara memasang Iklan Google Adsense diblog"
  5. Lalu klik Adsense



  6. Selanjutnya tampil menu "Mengonfigurasi Adsense" untuk mengatur iklan



  7. Silahkan Atur format iklan seperti Ukuran iklan yang akan dipasang digadget, Warna iklan agar menarik ditampilan blog silahkan atur sesuai selera



  8. Klik Simpan

  9. Demikian postingan saya kali ini mudah – mudahan bermanfaat

Cara memasang Iklan Google Adsense diblog

Sambil menyelam minum air kata yang sudah tidak asing terdengar ditelinga kita, kalau diartikan secara sederhana maksudnya “cari uang tambahan”…heheheh..artikan sendiri deh…Sekarang banyak blog yang sudah dikaitkan dengan iklan Google Adsense untuk mendapatkan uang tambahan sehingga para blogger mendesign blognya sedemikian rupa agar kelihatan menarik, Google Adsense adalah salah satu fitur dari layanan Google yang merupakan suatu cara yang mudah dan gratis bagi para untuk mendapatkan uang dengan menampilkan iklan Google di websitenya, bagi para blogger yang ingin mendaftarkan blognya dengan iklan Google Andsense silahkan ikuti cara memasang iklan Google Adsense sebagai berikut :
  1. Sign in diblogger
  2. Klik Opsi Lainnya >>Klik Setelan >>Klik Bahasa dan Pemformatan >> Lihat Bahasa dan ganti menjadi Bahasa English (United Kingdom)
  3. Klik Simpan
  4. Selanjutnya kembali kehalaman utama blog dan Klik Opsi Lainnya sekali lagi >> Klik Penghasilan
  5. Maka akan muncul halaman Blogger + Google Adsense >> Klik Mendaftar Adsense


  6. Selanjutnya akan muncul halaman “Langkah 1:Pilih Akun Google Anda” >> Klik "Ya, gunakan namaakun @Gmail.com" lihat gambar


  7. Kemudian tampil halaman Langkah 2 : "Beri tahu kami tentang konten anda" >> lalu pilih "Bahasa konten" >> klik "Lanjutkan"


  8. Tampil menu Langkah 3 : "Kirim permohonan Adsense" dan isi data pada form dengan data anda dengan sebenarnya sebagai penerima pembayaran >> tandai “pilih jenis email yang dikirim google adsense kepada saya" >> klik "Kirim permohonan saya"


  9. Selanjutnya muncul tampilan menu "Selamat………">> Klik "Lanjutkan"


  10. Muncul "Nama blog anda. Penghasilan" dan ada tulisan Akun Adsense anda sedang dalam antrian persetujuan >>lihat juga tulisan "Tampilkan" dan pilih posisi tab iklan yang ingin ditentukan >> Klik "Simpan"


  11. Masih di halaman menu yang tadi klik "Tampilkan dasbord"


  12. Kemudian tampil menu "Sign In ke Google Adsense" >> Tinggal isikan passward anda >> Klik "Masuk"


  13. Akhirnya muncul menu utama "Dasbord Adsense" untuk mendapatkan scrift iklan dari Google Adsense, statistik penghasilan dll.


Demikian postingan saya kali ini mudah – mudahan bermanfaat

Cara mengambil gambar dilayar monitor atau copy dektop

Dalam membuat sebuah tutorial blog gambar diperlukan untuk mempermudah pengunjung mengulas ataupun melakukan apa yang kita maksud dan dengan gambar akan memperjelas tutorial tersebut, sehingga daya tangkap pembaca terhadap kalimat atau tutorial tersebut lebih mudah dimengerti. Untuk mengambil gambar dilayar monitor atau copy dektop dapat dilakukan sebagai berikut :
  1. Pilih gambar dilayar dektop yang ingin dicopy atau diambil gambarnya


  2. Tekan tombol “PrtScr” atau tombol "Print Screen SysRq" pada keyboard tombol ini biasanya berada dipojok atas kanan sejajar dengan tombol F1 sampai dengan F12 (tergantung dari masing2 keybord computer)


  3. Selanjutnya klik “Start” atau tombol bulat bawah kiri dilayar dektop dan klik “All Program” klik “Accessories” lalu pilih “Paint”


  4. Setelah keluar jendela Paint dilayar dektop lalu klik “paste” (atau tekan Ctrl+V), akan keluar tampilan seperti yang kita inginkan tinggal diatur gambar yang mau disimpan sesuaikan dengan keperluannya dengan cara crop dan sebagainya silahkan diutak atik


  5. Setelah serasa cukup silahkan klik “Save” atau “Save As” maka kita akan diarahkan dimana gambar yang kita sudah edit ini disimpan? Jangan lupa isi nama file dan format gambar (format jpeg, gif, png, atau tiff ) setelah itu klik “Save” kembali


  6. Dan terakhir lihat hasilnya, buka gambar yang sudah kita simpan tadi

Mudah-mudahan artikel saya ini bisa bermanfaat selamat mencoba

Cara mudah upload video di youtube

Youtube….sudah tidak asing lagi kita mendengar kata ini karena hampir semua orang diseluruh dunia sudah tahu apa itu youtube dan bahkan youtube sudah menjadi portal video terbesar karena berbagai video di seluruh dunia di upload disitus ini dan sudah disaksikan oleh berjuta pemirsa dari berbagai penjuru dunia. Bahkan tidak jarang orang mendadak terkenal karena telah mengupload video diyoutube. Namun dibalik semua itu ternyata banyak juga orang yang ingin mengupload video, namun tidak mengerti bagaimana cara melalukannya. Nah…pada postingan kali ini saya mencoba berbagi cara mudah upload video di youtube :

  1. Siapkan file video yang akan kita Upload apakah melalui kamera Handphone, Camera Digital ataupun media yang lainnya, yang penting sudah berupa video.

  2. Silahkan masuk ke alamat "www.youtube.com"

  3. Apabila sudah memiliki akun email Gmail silahkan masukan akun Gmail dan Sandi lalu klik Masuk, namun apabila anda tidak memiliki akun Gmail silahkan "KLIK DISINIcara membuat akun Gmail


  4. Selanjutnya klik "Upload" yang ada dipojok kanan atas disamping pencarian lihat gambar


  5. Kemudian pilih file video yang akan diupload dengan klik "Pilih file untuk diupload"


  6. Cari pilihan video yang akan diupload selanjutnya klik "open" maka secara otomatis video tersebut mulai diupload


  7. Sambil menunggu video tersebut diupload silahkan isi data - data form yang dibutuhkan seperti:
  8. Info Dasar
    1. Judul video = Sesuaikan dengan hasil rekaman
    2. Deskrepsi = Sesuaikan (boleh tidak diisi)
    3. Thumbnail Video = berupa tampilan gambar thumbnail akan muncul setelah video selesai diupload dan pilih salah satu gambar tersebut
    4. Setelan privasi = pilih publik saja
    5. Kategori Video = Sesuaikan


    Setelan lanjutan
    1. Lokasi video = tempat perekaman
    2. Tanggal Perekaman = sesuaikan


  9. Apabila video sudah diupload 100% maka akan muncul di thumbnail berupa tiga buah gambar pilih salah satu sesuai selera dan tunggu proses selanjutnya sampai video benar - benar selesai diupload...dan lihat hasilnya

  10. Demikian postingan saya kali ini mudah - mudahan bermanfaat.....

Cara membuat menu dropdown dibawah dan diatas header

Dalam membuat sebuah blog maka secara default kita sudah memiliki menu dengan bentuk horizontal yang letaknya diatas Header yang disebut navbar (Navigasi Bar). Pada navbar default tersebut kita sudah disediakan navbar tinggal memilh saja, namun bagi sebagian para blogger menu tersebut dihilangkan dan di atur ulang sesuai selera sehingga tampilan blog terlihat menarik.

Contoh gambar


Untuk mengaturnya kembali atau membuat menu sendiri diperlukan beberapa kode CSS dan langkah-langkah dibawah ini :
  1. Sign in di blogger
  2. Klik Opsi lainnya
  3. Klik Templete
  4. klik Edit HTML
  5. Centang tulisan Expand Widget Templates
  6. Cari kode ]]></b:skin>  (gunakan tombol CTRL + F3 untuk mempermudahkan pencarian kode)
  7. Copy paste kode CSS dibawah ini dan letakan diatas kode ]]></b:skin>  

  8. /* Menu Horizontal Dropdown ----------------------------------------------- */ #menuwrapperpic{background: #ff0000 repeat-x;width:980px;margin:0 auto;padding:0 auto} #menuwrapper{width:980px;height:35px;margin:0 auto} .menusearch{width:300px;float:right;margin:0 auto;padding:0 auto} .clearit{clear:both;height:0;line-height:0.0;font-size:0} #menubar{width:100%} #menubar,#menubar ul{list-style:none;font-family:Arial, serif;margin:0;padding:0} #menubar a{display:block;text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase;color:#000000;border-right:1px solid #191919;padding:12px 10px 8px} #menubar a.trigger{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7sKlZ1ctefYLy7N24ZY8aXKJKHr4F2pXqxrJOod0SW8WAexg0TFETTDT7DyWxjPZXfzb5wiJoFbx_DUA1vrifg-yxLQn3P_xfYDYV0eV-j45_22ulqGgGfgOvbFSggbGKF-xoq2nQCHI/s1600/arrow_white.gif);background-repeat:no-repeat;background-position:right center;padding:12px 24px 8px 10px} #menubar li{float:left;position:static;width:auto} #menubar li ul,#menubar ul li{width:170px} #menubar ul li a{text-align:left;color:#fff;font-size:12px;font-weight:400;text-transform:none;font-family:Arial;border:none;padding:5px 10px} #menubar li ul{z-index:100;position:absolute;display:none;background:#222;padding-bottom:5px;-moz-box-shadow:0 2px 2px rgba(0,0,0,0.6);-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.6)} #menubar li:hover a,#menubar a:active,#menubar a:focus,#menubar li.hvr a{background-color:#222;color:#E98C0A} #menubar li:hover ul,#menubar li.hvr ul{display:block} #menubar li:hover ul a,#menubar li.hvr ul a{color:#edfdfd;background-color:transparent;text-decoration:none} #menubar li ul li.hr{border-bottom:1px solid #444;border-top:1px solid #000;display:block;font-size:1px;height:0;line-height:0;margin:4px 0} #menubar ul a:hover{background-color:#555!important;color:#fff!important;text-decoration:none}

  9. Kemudian cari kode

    1. <header> : untuk menu di atas header blog
    2. </header>: untuk menu di bawah header blog

  10. Copy dan pastekan kode dibawah ini dan letakkan diatas kode <header> dan atau </header> untuk menu dibawah header

  11. <div id='menuwrapperpic'>
    <div id='menuwrapper'>
    <ul id='menubar'>
    <li><a href='nama-alamat-blog.html' target='new'>Home </a></li>
    <li><a href='nama-alamat-blog.html' target='new'>Menu 1</a></li>
    <li><a href='nama-alamat-blog.html' target='new'>Menu 2</a></li>
    <li><a class='trigger'>Menu 3</a>
    <ul>
    <li class='hr'/>
    <li><a href='nama-alamat-blog.html' target='new'>Sub Menu 3</a></li>
    <li class='hr'/>
    <li><a href='nama-alamat-blog.html'  target='new'>Sub Menu 3</a></li>
    <li class='hr'/>
    <li><a href='nama-alamat-blog.html'  target='new'>Sub Menu 3</a></li>
    </ul>
    </li>
    <li><a class='trigger'>Menu 4</a>
    <ul>
    <li class='hr'/>
    <li><a href='nama-alamat-blog.html'  target='new'>Sub Menu 4</a></li>
    <li class='hr'/>
    <li><a href='nama-alamat-blog.html'  target='new'>Sub Menu 4</a></li>
    </ul>
    </li>
    </ul> <div class='menusearch'>
    <div style='float:right;padding:8px 8px 0 0;'>
    <form action='http://ketutjoel.blogspot.com/search' method='get' target=''>
    <input name='sitesearch' style='display:none;' value='http://ketutjoel.blogspot.com'/>
    <input id="search-box" name="q" size="25" type="text" style="background: #EEEDED; border: 1px solid #000000 "/>
    <input id="search-btn" value="Search" type="submit"/>
    </form></div></div><br class='clearit'/></div><div style='clear:both;'/></div>

    Keterangan

    1. Kode berwarna merah adalah Warna background, lebar Menu utama , lebar menu dan lebar Menu Search (sesuaikan dengan lebar blognya kawan)
    2. Kode berwarna merah adalah Url tujuan, ganti dengan Url pada blognya kawan
    3. Kode berwarna kuning adalah judul menu bar ganti dengan judul nya kawan
    4. Kode berwarna biru adalah sub judul dropdown ganti dengan judul nya kawan
    5. Kode berwarna hijau adalah alamat pencarian ganti dengan alamat blognya kawan

Demikianlah postingan saya kali ini tentang cara membuat menu dropdown diatas header atau dibawah header, semoga bermanfaat.

Cara membuat 1, 2, 3 kolom gadget diatas atau dibawah header dan post

Cara membuat kolom gadget artinya menambah ataupun menciptakan kolom gadget yang letaknya bisa dimana saja sesuai keinginan dan kebutuhan blog dengan cara memasukan dan membuat kode-kode scrift HTML sendiri, biasanya para blogger menambah kolom gadget digunakan untuk memasang iklan atau menambah aksesoris diblog sehingga blog kelihatan menarik, caranya sebagai berikut :

A. Cara membuat 1 kolom gadget diatas post, caranya sebagai berikut :
  1. Sign in di blogger
  2. Klik Opsi lainnya
  3. Klik Templete
  4. klik Edit HTML
  5. Centang tulisan Expand Widget Templates
  6. Cari kode <b:section class='main' id='main' showaddelement='no'> (gunakan tombol CTRL + F3 untuk mempermudahkan pencarian kode)
  7. Apabila sudah ketemu ganti tulisan showaddelement='no' menjadi showaddelement='yes'
  8. Klik Simpan dan lihat hasilnya di tata letak diatas post
B. Cara membuat 1 kolom gadget diatas header, caranya sebagai berikut :
  1. Sign in di blogger
  2. Klik Opsi lainnya
  3. Klik Templete
  4. klik Edit HTML
  5. Centang tulisan Expand Widget Templates
  6. Cari kode <div class="region-inner header-inner"> (gunakan tombol CTRL + F3 untuk mempermudahkan pencarian kode)
  7. Tambahkan Kode scrift ini <b:section class="header" id="topheader" preferred="yes">
    dibawah kode tersebut
  8. Selanjutnya dibawah kode diatas akan melihat kode ini <b:section class="header" id="header" maxwidgets="1" showaddelement="no"> ganti tulisan showaddelement='no' menjadi showaddelement='yes'
  9. Klik Simpan dan lihat hasilnya di tata letak diatas post
Cara menempatkanya lihat gambar dibawah ini


C. Cara membuat 1 kolom gadget dibawah header, caranya sebagai berikut :
  1. Sign in di blogger
  2. Klik Opsi lainnya
  3. Klik Templete
  4. klik Edit HTML
  5. Centang tulisan Expand Widget Templates
  6. Cari kode ]]></b:skin> 
  7. (gunakan tombol CTRL + F3 untuk mempermudahkan pencarian kode)
  8. Copy paste kode CSS dibawah ini dan letakan diatas kode ]]></b:skin> 


  9. #under_header
    { float:left; width:100%;
    }

  10. Cari kode  <div class="region-inner header-inner"> (gunakan tombol CTRL + F3 untuk mempermudahkan pencarian kode)
  11. Tambahkan Kode <b:section class="header" id="underheader" preferred="yes"> letakkan dibawah kode <div class="region-inner header-inner">
  12. Klik Simpan dan lihat hasilnya di tata letak diatas post
D. Cara membuat 2 kolom gadget dibawah Header caranya sebagai berikut :
  1. Sign in di blogger
  2. Klik Opsi lainnya
  3. Klik Templete
  4. klik Edit HTML
  5. Centang tulisan Expand Widget Templates
  6. Cari kode ]]></b:skin> (gunakan tombol CTRL + F3 untuk mempermudahkan pencarian kode)
  7. Copy paste kode CSS dibawah ini dan letakan diatas kode ]]></b:skin>

  8. #box-kolom-widget { clear:both;
     }
     .box-widget { padding:0px 10px 10px 10px; border:1px dotted $bordercolor;
     }

  9. Setelah itu cari kode dibawah ini :

    1. <div id="main-wrapper">
    2. atau <div id="main-outer">
    3. atau <div class="main-outer"> sesuai dengan versi HTML nya kawan (gunakan tombol CTRL + F3 untuk mempermudahkan pencarian kode)

  10. Copy paste kode dibawah ini dan letakan diatas salah satu kode diatas

  11. <div id='box-kolom-widget'>
    <div id='box1' style ='width: 50%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget'id='col1'  preferred='yes'  style='float:left;'/>
    </div>
    <div id='box2' style='width: 50%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget' id='col2' preferred='yes' style='float:left;'/>
    </div>
    <div style='clear:both;'/>
    </div>

  12. Klik Pratinjau, siapa tahu ada kesalahan
  13. Klik Simpan

E. Cara membuat 3 kolom gadget dibawah Header caranya sebagai berikut :

  1. Caranya sama seperti membuat 2 kolom gadget tinggal mengganti kode CSS dan scrift HTMLnya, seperti Copy paste kode CSS dibawah ini dan letakan diatas kode ]]></b:skin>

  2. <div id="box3" style="float: left; margin: 0; text-align: left; width: 35%;"> <b:section class="box-widget" id="col3" preferred="yes" style="float: left;">

  3. Setelah itu cari kode dibawah ini :

    1. <div id="main-wrapper">
    2. atau <div id="main-outer">
    3. atau <div class="main-outer"> sesuai dengan versi HTML nya kawan (gunakan tombol CTRL + F3 untuk mempermudahkan pencarian kode)

  4. Copy paste kode dibawah ini dan letakan diatas salah satu kode diatas

  5. <div id='box-kolom-widget'>
    <div id='box1' style='width: 35%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget' id='col1' preferred='yes' style='float:left;'/>
    </div>
    <div id='box2' style='width: 30%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget' id='col2' preferred='yes' style='float:left;'/>
    </div>
    <div id='box3' style='width: 35%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget' id='col3' preferred='yes' style='float:left;'/>
     </div>
    <div style='clear:both;'/>
    </div>

  6. Klik Simpan