Cara Memasang Banner Atau Iklan Di header Blog

CARA MEMASANG BANNER ATAU IKLAN DI HEADER BLOG

Mungkin ada di antara para blogger yang ingin melakukanCara Memasang Banner atau Iklan di Header Blog. Dengan tujuan untuk meningkatkan penghasilannya dalam hal dunia publisher, tetapi bingung bagaimana caranya. Perlu anda ketahui, bahwa area header pada blog di blogger biasanya terkunci atau dikunci.

Jadi kita tidak bisa menambahkan widget di area ini, karena pada area ini hanya diperbolehkan merubah judul dan deskripsi blog anda. Nah kali ini saya akan coba menulis sekaligus memberikan Cara Memasang Banner atau Iklan di Header Blog. Jika anda ingin mencobanya, maka silahkan ikuti langkah di bawah ini :

1. Login atau masuk ke akun blogger anda, terus ke Dasbor ---> Rancangan ---> lalu klik Edit HML.

2. Jangan lupa centang Expand Template Widget.

3. Setelah itu anda juga perlu untuk membackup template awalnya terlebih dahulu dengan cara klik Download Template Lengkap dan memilih simpan/save serta menyimpannya pada hard disk. Hal ini perlu anda lakukan dengan tujuan jika terjadi masalah pada template yang anda utak-atik tadi, bisa cepat kembali ke template asal yang telah anda download tadi. Artinya cadangan ini akan bermanfaat jika ada yang tidak beres atau masalah dengan langkah-langkah yang anda lakukan dalam hal edit template.

4. Untuk memudahkannya gunakan Mozilla Firefox anda, terus klik edit dan klik Cari Ctrl+F terus cari kode dibawah ini :

<div id='header-wrapper'>

Perhatikan dengan pelan-pelan dan secara teliti ya, karena di bawah kode tersebut diatas, anda akan menemukann kode-kode seperti dibawah ini :

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Judul Blog Anda (Header)' type='Header'/>

Selanjutnya yang harus anda lakukan adalah merubah atau mengganti angka '1' menjadi '3', terus mengganti kata 'no' menjadi 'yes' serta merubah kata 'true' menjadi 'false' sehingga kodenya diatas menjadi seperti dibawah ini :

<b:section class='header' id='header' maxwidgets='3' showaddelement='yes'>
<b:widget id='Header1' locked='false' title='Judul Blog Anda (Header)' type='Header'/>

6. Terkahir klik simpan atau Save Template.

Nah, begitulah langkah yang harus anda lakukan untuk mencoba Cara Memasang Banner atau Iklan di Header Blog. Namun jika tidak terjadi perubahan pada tampilan blog anda, kemungkinan template blog anda berbeda dengan yang saya pakai atau gunakan. Dan silahkan mencoba cara lainnya yang bisa anda temukan pada google, selamat mencoba dan happy blogging.

Diposting oleh Mukhtasor Achmad 19.50 0 komentar

Tutorial membuat Recent Post Dengan Gambar Thumbnail Bergerak

Salam blogger untuk para sahabat waroeng mukhtasor dari mana saja!
Dalam tutorial atau postingan (terserah dah) kali ini blog waroeng mukhtasor akan share kepada teman-teman tentang Recent Post Dengan Gambar Thumbnail Bergerak,
untuk contoh widgetnya seperti gambar berikut:

O iya sekali lagi gambar thumbnailnya bergerak ke bawah ya bukan ke atas, hehehe...
Oke dah lansung aja ya sob, keburu pusing ni kepala!

1. Masuk ke akun blogger sobat.

2. Pada menu sobat klick Rancangan ➨ Tambah gadget(di bagian mana saja sobat ingin widget ini muncul)

3. Lalu sobat pilih elemen HTML/Java Script.

4. Selanjutnya sobat copy kode di bawah ini dan letakkan di dalamnya.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script><style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:500px;
}
#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:#ffffff; /* warna background */
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#000000;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li a:hover{color:#cc0000; text-decoration:underline}
#spylist li img {
float:left;
margin-right:5px;
background:#ffffff;
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] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidmKiokxcGfkrdIW2yDdICZYSAqC2mEXWTT3Bjkpo_6hcR-d-FurTe73Y5Y1EnX2-uo29eE8QR8Vb3Z1zNd_u_MRJ62J9uEWw8S9pxm8fuEj9nVVFTtyqoc4EJQJ8XxsZ68AA9oZU0e60/s1600/O.W.gif";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidmKiokxcGfkrdIW2yDdICZYSAqC2mEXWTT3Bjkpo_6hcR-d-FurTe73Y5Y1EnX2-uo29eE8QR8Vb3Z1zNd_u_MRJ62J9uEWw8S9pxm8fuEj9nVVFTtyqoc4EJQJ8XxsZ68AA9oZU0e60/s1600/O.W.gif";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidmKiokxcGfkrdIW2yDdICZYSAqC2mEXWTT3Bjkpo_6hcR-d-FurTe73Y5Y1EnX2-uo29eE8QR8Vb3Z1zNd_u_MRJ62J9uEWw8S9pxm8fuEj9nVVFTtyqoc4EJQJ8XxsZ68AA9oZU0e60/s1600/O.W.gif";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidmKiokxcGfkrdIW2yDdICZYSAqC2mEXWTT3Bjkpo_6hcR-d-FurTe73Y5Y1EnX2-uo29eE8QR8Vb3Z1zNd_u_MRJ62J9uEWw8S9pxm8fuEj9nVVFTtyqoc4EJQJ8XxsZ68AA9oZU0e60/s1600/O.W.gif";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidmKiokxcGfkrdIW2yDdICZYSAqC2mEXWTT3Bjkpo_6hcR-d-FurTe73Y5Y1EnX2-uo29eE8QR8Vb3Z1zNd_u_MRJ62J9uEWw8S9pxm8fuEj9nVVFTtyqoc4EJQJ8XxsZ68AA9oZU0e60/s1600/O.W.gif";
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 = 20;
home_page = "http://www.waroengmukhtasor.blogspot.com/";
limitspy=6
intervalspy=4000
</script>
<div id="spylist">
<script src='https://otowebsite-blogspot.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>

5. Simpan.

Keterangan:

• Jika di templatemu sudah terpasang jQuery 1.3.2 maka kamu tidak perlu memasang jQuery 1.3.2 di atas atau tinggal di hapus saja.
• numposts = 20 angka 20 adalah jumlah postingan terbaru yang akan di munculkan di widget ini,
• ganti url http://www.waroengmukhtasor.blogspot.com/ dengan url blog sobat.
• kode di atas masih ada yang bisa sobat ganti seperti border, heigh, weight.

Jika anda menggunaka widget ini jangan lupa komentnya, jangan berkomentar cuma bila ada kesulitan saja. 

Saya rasa cukup, silahkan tinggalkan tanggapan atau keterangan sobat tentang postingan di atas!

sumber : http://otowebsite.blogspot.com/2012/05/widget-recent-post-dengan-gambar.html

Diposting oleh Mukhtasor Achmad 10.52 1 komentar

Cara Membuat Tulisan Berjalan atau Marquee

Pernah melihat tulisan berjalan?...
Mungkin teman-teman pernah melihat tulisan berjalan di website/blog orang. Jika teman ingin mencoba membuat tulisan berjalan di blog mungkin artikel ini bisa membantu teman-teman yang ingin menghiasi blognya dengan tulisan berjalan.
Kalau ga salah didalam bahasa html tulisan berjalan ini di sebut dengan Marquee.

Berikut contoh tulisan berjalan

Cara Membuat Tulisan Berjalan Di Blog atau Cara Membuat efek Marquee

Sedangkan contoh dibawah ini adalah contoh tulisan berjalan yang ada link nya

Cara Membuat Tulisan Berjalan Di Blog atau Cara Membuat efek Marquee

Nah itulah tulisan berjalan yang saya maksud.

Lalu Bagaimana Cara Membuat tulisan berjalan seperti itu?

Berikut Kode Html yang akan membuat tulisan berjalan

<marquee> dan di tutup dengan </marquee>

Itulah kode html tersebut, jadi yang harus anda lakukan adalah membuat tulisan yang di awali dengan kode <marquee> dan kemudian tulisan tersebut di tutup dengan kode </marquee>

Contoh:

<marquee>Belajar Membuat Tulisan Berjalan Di Blog</marquee>

Hasilnya

Belajar Membuat Tulisan Berjalan Di Blog

Nah itulah kode html yang harus di tulis agar bisa membuat tulisan berjalan, mudah saja kan?...

Ini hanya dasarnya saja lho...

Teman bisa mengembangkannya lagi, misalnya membuat tulisan berjalan dengan warna tertentu, atau dengan ukuran huruf yang lebig besar, dsb.

Selamat mencoba dan semoga berhasil

Diposting oleh Mukhtasor Achmad 10.09 0 komentar

Cara Memasang Widget Jadwal Sholat di Blog

Berikut adalah beberapa widget menarik yang berfungsi untuk menampilkan waktu sholat hari ini bagi kaum muslimin untuk daerah atau kota yang telah ditentukan. 

Selain berfungsi untuk mempercantik tampilan blog kita tentunya yang paling penting dengan adanya widget berikut ini adalah agar kita senantiasa ingat akan kewajiban kita sebagai umat muslim, yang tidak dapat kita tinggalkan.

jika anda tertarik untuk memasang widget yang sangat bermanfaat ini berikut adalah beberapa widget yang berfungsi untuk menampilkan jadwal waktu shalat yang akan terupdate secara otomatis , beserta cara pemasangannya pada blog milik anda:
caranya :
1. login Blog
2. cari Tata letak
3. Tambah Gadget
4. Pilih HTML/JavaScript
5. Copy dan pastekan kode di bawah ini :

<iframe src="http://jadwalsholat.org/adzan/ajax.row.php" frameborder="0" width="220" height="220"></iframe>

atau ini :

<iframe src="http://www.republika.co.id/jadwal_sholat/" scrolling="no" width="300" height="130" frameborder="no" framespacing="0"> </iframe>

6. simpan dan selesai.

Selamat mencoba,,,,,

Diposting oleh Mukhtasor Achmad 20.41 0 komentar

Cara Membuat Histats di Blog

 Posting kali ini adalah tentang cara pemasangan histats counter pada blog, walau mungkin telah banyak temen-temen blogger yang membahas tentang tutorialnya,, mungkin tidak ada salahnya jika saya bahas sekali lagi dalam blog ini khusus untuk sahabat yang lagi belajar ngeblog

Sebelum anda bisa memasang histats counter pada blog , anda haruslah terdaftar terlebih dahulu, jika sahabat belum terdaftar silahkan lakukan langkah pendaftaran terlebih dahulu.

Caranya adalah sebagai berikut:

1. Kunnjungi http://www.histats.com

2. Kemudian Klik Register

3. Isi/Lengkapi Form register yang telah disediakan

4. Lakukan konfirmasi dengan klik link yang telah dikirm melalui e-mail anda.

Langkah Pendaftaran Selesai

Selanjutnya adalah cara memasang histats counter pada blog

1. Kembali kehalaman histats dengan menggunakan link konfirmasi tadi

2. Kemudian login dengan menggunakan e-mail dan password yang telah di daftarkan tadi.

3. Selanjutnya klik Add Website

4. Isikan data yang diminta seperti: site url [isi dengan alamat blog kita], language , Title , Description [isi dengan deskripsi blog anda] dan Page View Start Value [bisa anda isi sesuai dengan keinginan anda namun Sebaiknya isi saja dengan 0 agar traffik blog anda terlihat lebih murni]

5. Selanjutnya Masukkan kode capcha lalu klik Continue

6. Pada halaman berikutnya klik url blog yang kita daftarkan tadi

7. Kemudian Klik Counter Code , Pilih Add New Counter

8. Pilih Tema yang sesuai dengan keinginan anda , jika sudah beri tanda centang lalu klik Save

9. Selanjutnya Counter id anda akan ditampilkan,, lalu klik pada counter id tersebut

10. kemudian Copy kode HTML/Java script yang ditampilkan.

Untuk menambahkan widget histats counter pada blog anda langkahnya adalah sebagai berikut

11. Masuk ke akun Blogger milik Anda

12. Masuk Ke Rancangan -> klik Tambah Gadget [Add Gadget] -> pilih HTML/JavaScript

Terakhir Klik Save/Simpan dan lihat hasilnya..

Histats berfungsi untuk menghitung jumlah traffic pengunjung yang menuju blog kita, disini anda dapat melihat berbagai data terkait lalu lintas situs yang merujuk pada blog anda, seperti Summary atau perhitungan harian pengunjung , Referring Sites dan search engine , browser dan OS maupun resolusi layar yang di gunakan oleh visitor , Geolocation atau lokasi tempat pengunjung mengakses situs anda dll

Yang menarik dari Histats adalah anda dapat mengakses berbagai data lalu-lintas situs berdasarkan waktu yang di inginkan.

Selamat Mencoba teman....

Diposting oleh Mukhtasor Achmad 19.50 2 komentar