Membuat Kotak Iklan di Blog

Perlu saya sampaikan sebelum Anda membuat kotak iklan de blog adalah hal yang perlu diperhatikan dalam menampilkan space baner iklan adalah letak serta susunannya agar semakin menarik minat orang banyak. Jadi tidak asal pasang gambar yang akhirnya iklan yang ditampilkan menjadi kurang menarik karena berantakan.
1. Silahkan login ke ID/akun blogger Anda2. Pada menu dropdown klik "template" lalu klik "Edit HTML"
3.Kemudian cari kode ]]></b:skin> (gunakan ctrl+f atau F3 untuk mempermudah pencarian kode). Setelah dapat, masukkan kode berikut ini tepat diatasnya.
.kotak_iklan {text-align: center;}
.kotak_iklan  img {margin: 0px 5px 5px 0px;padding: 5px;text-align: center;border: 1px solid #ddd;}
.kotak_iklan  img:hover {border: 1px solid #333}
4. Selanjutnya save/simpan template
5. Kemudian lihat menu disebelah kiri layar lalu klik Tata Letak > Tambah Gadget >  Pilih HTML/JavaScript
6. Langkah berikutnya silahkan masukkan kode berikut ini ke dalam form yang disediakan.
<a href="url iklan yang dituju" title="judul iklan"><img border="0" src="Url gambar/banner" alt="alt/text gambar" width="125" height="125" /></a>
<a href="url iklan yang dituju" title="judul iklan"><img border="0" src="Url gambar/banner" alt="alt/text gambar" width="125" height="125" /></a>
<a href="url iklan yang dituju" title="judul iklan"><img border="0" src="Url gambar/banner" alt="alt/text gambar" width="125" height="125" /></a> 
<a href="url iklan yang dituju" title="judul iklan"><img border="0" src="Url gambar/banner" alt="alt/text gambar" width="125" height="125" /></a> 
</div>
Perhatikan kata yang saya beri warna pada kode iklan diatas, rubah sesuai urutannya dan begitupula dengan kode yang dibawahnya.
7. Jika sudah selesai, silahkan simpan/save dan lihat hasilnya
Saya rasa tidak sulit untuk membuat kotak iklan di blog, hanya perlu menambahkan beberapa kode kedalam template blog. Untuk itu saya akhiri saja tutorial cara membuat kotak iklan di blog ini semoga bermanfaat. 

 /** Kotak Iklan **/

<div class="kotak_iklan">

Cara Membuat Menu bar di Blog

Cara membuat menu bar dan sub menu bar di blog. Menu bar sangat diperlukan untuk blog, hal ini sangat membantu untuk mencari informasi berdasarkan pada kategori di sub menu bar. Memberi sub menu bar juga membuat blog kita tampak lebih tampan, teratur, dan praktis (tidak acak-acakan). Langkah-langkahnya berhubungan dengan edit HTML. Bagi para blogger pemula mungkin akan merasa sulit, tetapi sebenarnya hal ini sangat mudah. Ikuti saja langkah-langkah yang kami jelaskan di bawah ini. 

Berikut ini langkah-langkah yang harus dilakukan : 
1. Klik Menu Desain 
2. Pilih Menu Template lalu pilih menu Edit HTML 
3. Pilih/klik menu Lanjutkan 
4. Pilih/klik menu Expand Template Widget 

Cari script berikut : 

<div class='main-outer'> atau
<div id='main-wrapper'> atau <div id='main'> 

Agar lebih mudah, klik saja ctrl+F pada keyboard lalu pilh salah satu scrift diatas. Berdasarkan pengalaman saya setelah membolak balik informasi di www.google.com maka yang cocok adalah : 

div class='main-outer'>. 

Bisa jadi beda dengan template yang lain… 

Setelah dapat, copas script berikut tepat diatas script yang dicari tadi : 

<style>
/* -- Menu Horizontal + Sub Menu-- */
#cat-nav {background:#156994;margin:0 15px;padding:0;height:35px;}
#cat-nav a { color:#eee; text-decoration:none; text-shadow: #033148 0px 1px 0px;border-right:1px solid #156994;}
#cat-nav a:hover { color:#fff; }
#cat-nav li:hover { background:#000; }
#cat-nav a span { font-family:Verdana, Geneva, sans-serif; font-size:11px; font-style:normal; font-weight:400; color:#fff; text-shadow:none;}
#cat-nav .nav-description { display:block; }
#cat-nav a:hover span { color:#fff; }
#secnav, #secnav ul { position:relative; z-index:100; margin:0; padding:0; list-style:none; line-height:1; background:#0d5e88; }
#secnav a { font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-weight:700; font-size:14px; display:block; z-index:100; padding:0 15px; line-height:35px; text-decoration:none;}
#secnav li { float:left; width: auto; height:35px;}
#secnav li ul { position: absolute; left: -999em; width: 200px; top:35px}
#secnav li ul li { height:30px; border-top:1px solid #fff; }
#secnav li ul li a { font-family:Verdana, Geneva, sans-serif; width:180px; line-height:30px; padding:0 10px; font-size:11px; font-style:normal; font-weight:400; color:#eee; }
#secnav li ul ul { margin: -30px 0 0 180px; }
#secnav li:hover ul ul, #secnav li:hover ul ul ul, #secnav li.sfhover ul ul, #secnav li.sfhover ul ul ul { left:-999em; }
#secnav li:hover ul, #secnav li li:hover ul, #secnav li li li:hover ul, #secnav li.sfhover ul, #secnav li li.sfhover ul, #secnav li li li.sfhover ul { left: auto; }
#secnav li:hover,#secnav li.hover { position:static; }
#cat-nav #secnav {width:100%;margin:0 auto;}
</style>
<div id='cat-nav'>
<ul class='fl' id='secnav'>
<li><a href='#'>Beranda</a></li>
<li><a href='#'>Menu 1</a></li>
<li><a href='#'>Menu 2</a>
<ul id='sub-custom-nav'>
<li><a href='#'>Sub Menu2 a</a></li>
<li><a href='#'>Sub Menu2 b</a></li>
</ul>
</li>
<li><a href='#'>Menu3</a>
<ul id='sub-custom-nav'>
<li><a href='#'>Sub Menu3a</a></li>
<li><a href='#'>Sub Menu3b </a></li>
</ul>
</li>
<li><a href='#'>Menu4</a>
<ul id='sub-custom-nav'>
<li><a href='#'>Sub Menu4a</a></li>
<li><a href='#'>Sub Menu4b </a></li>
</ul>
</li>
<li><a href='#'>Menu5</a></li>
</ul>
</div> 

5. Setelah itu klik Pratinjau dulu untuk memastikan scrift sudah benar . Lalu simpanlah/save. Dan tutup edit HTML tersebut.


Catatan : 

• Ganti tanda # (warna biru) dengan link/url yang anda inginkan. Bisa jadi link posting atau label (katagori) yang ada pada blog anda.
• Ganti Tulisan warna biru dengan menu dan sub menu yang anda inginkan.
• Setiap sub menu bisa ditambah atau dikurangkan sesuai keinginan.
• Untuk menembalikan apabila ada kesalahan lebih baik back up dulu template anda sebelum merubah/menambah script diatas

Cara Membuat Recent Post Berjalan di Blog

Cara Membuat Recent Post Berjalan di Blog - Recent post atau dalam bahasa indonesianya posting terakhir atau artikel terkini adalah widget yang bisa sobat pasang di blog dengan tujuan memberikan informasi tentang postingan atau artikel terkini.
Recent post biasanya menampilkan sejumlah judul artikel yang belum lama sobat posting dalam deretan ke bawah dan tak jarang juga ada yang bergerak ( animasi ) ke bawah. Contohnya sobat bisa lihat di sidebar blog ini.

Kali ini saya akan kasih tahu bagaimana cara memasang recent post di blog. Sobat yang berminat silahkan ikuti tutorial berikut.

1. Log in ke akun blog sobat.
2. Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
3. Masukkan kode berikut ke dalam konten.

<style type="text/css">
    #rp_plus_img{height:377px;}
    #rp_plus_img li {height:60px;padding:5px;list-style:none;
    background-color:#ffffff;
    border:solid 1px #000000;}
    #rp_plus_img a{color:#00000;}
    #rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
    text-align:justify;
    -moz-border-radius: 5px;}
    #rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
   
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="https://sites.google.com/site/unwanted86/javascript/recentpost.js" type="text/javascript">
</script>
<script type="text/javascript">
    var speed = 1500;
    var pause = 3500;
    $(document).ready(function(){
    rpnewsticker();
    interval = setInterval(rpnewsticker, pause);
    });
   
</script>
<ul id="rp_plus_img"><script>
    var numposts = 5;
    var numchars = 0;
   
</script>     <script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script>     </ul>
<small><a href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-recent-post-berjalan-di.html" target="_blank">get this widget here</a></small>

4. Klik save dan lihat hasilnya.

Semoga artikelnya bermanfaat !

Cara Membuat Blog Anti Copy Paste

Salam Blogger, waduh kalo bicara soal kejahatan copy paste pasti kagak bakal ada habisnya karena orang di indonesia memang sudah mengembangkan budaya copy paste, contohnya saling contek menyontek saat ulangan itu juga merupakan kejahatan copas di kalangan para pelajar, tapi kalo didunia internet atau di kalangan para blogger pasti beda lagi yaitu saling copy paste artikel. Dengan trik blogger yang satu ini kita dapat sedikit menghindari kejahatan copy paste yang akan menyerang blog sobat.

Cara kerja dari script ini yaitu membuat fungsi blok (blok teks atau gambar) menjadi tidak berfungsi sehingga hal itu bisa mengurangi aksi pencurian konten dan postingan oleh para blogger yang suka copas abiees.

Berikut langkah-langkah untuk menerapkan hal diatas :

1. Login ke account blogger sobat
2. klik menu template lalu pilih Edit html
3. klik lanjutkan dan jangan lupa centang box 'expand template widget'
4. Lalu sobat cari kode </head> dengan cara tekan tombol ctrl+f lalu sobat ketikan kode tersebut.
5. Sobat copy kode di bawah ini dan letakan dibawah kode </head>
   <SCRIPT type="text/javascript">
   if (typeof document.onselectstart!="undefined") {
   document.onselectstart=new Function ("return false");
   }
   else{
   document.onmousedown=new Function ("return false");
   document.onmouseup=new Function ("return true");
   }
   </SCRIPT>
6. lalu simpan template

Selamat mencoba dan semoga infonya bermanfaat

Cara Mengetahui Siapa Saja Yang Melihat Profil Facebook Kita

Salam blogger, profil fb memang bisa dilihat tanpa sepengetahuan sipemilik dan tentunya anda penasaran siapa saja yang suka melihat lihat profil fb kita. Nah, dengan Trik facebook yang satu sobat dapat mengetahui dengan jelas siapa saja yang suka melihat profil facebook sobat, dan biasanya yang  suka melihat lihat profil kita itu adalah seseorang yang diam-diam punya perasaan sama kamu. Waduh kayaknya saya udah panjang banget nih, dan sobat juga pasti udah penasaran banget kan, ok langsung ke TKP.

Berikut Cara Mengetahui Siapa Saja Yang Melihat Profil Facebook kita:

1. Sobat login ke account facebook sobat seperti biasa

2. Lalu sobat klik 'di sini'

3. Klik izinkan

4. Nanti keluar 4 pilihan

a. All fans { untuk semua penggemar }

b. Male fans { penggemar cowok }

c. Female fans { penggemar cewek }

d. My top fans stat { penggemar negara }

Pilih yang kamu suka,bila kamu memlih all fans nanti ada tulisan LETS START terus di KLIK dan KLIK IZINKAN

5. Setelah itu akan keluar siapa yang melihat profil fb kamu dari satu sampai 

    delapan orang saja.

6. klik publikasikan dan simpan tautan untuk menyimpan di muka profil kamu 

    atau klik lewati.

7. Finish

Nah semoga info diatas bisa bermanfaat dan membalas semua rasa penasaran sobat, jangan lupa buat add fb saya di sini

Cara Membuat Next Page di Blog

Salam Blogger, Pada postingan kali ini saya akan berbagi artikel tentang cara membuat tombol next page pada blogger, yang mana tombol ini berfungsi buat mengarahkan para pengunjung untuk melihat halaman demi halaman yang berada pada blog kita berdasarkan angka yang tertera dalam tombol tersebut. Artikel ini diperuntukkan buat blog-blog yang memang templatenya belum memiliki tombol next page.

Ikuti Langkah-Langkah Berikut :

• Masuk ke akun blogger anda. 

• Pada  tampilan Dashboard klik Design kemudian klik Edit HTML

• Untuk menjaga hal-hal yang tidak diinginkan saya sarankan backup dulu template blog anda dengan mengklik Download Full Template.

• Centang kotak kecil yang bertuliskan Expand Template Widged.

• Silahkan anda cari kode ]]></b:skin>

• Copy kode yang ada dibawah ini kemudian paste di atas kode ]]></b:skin>

.showpageArea a {text-decoration:underline;}

.showpageNum a {text-decoration:none;border: 1px solid #cccccc;margin:0 3px;padding:3px;}

.showpageNum a:hover {border: 1px solid #cccccc;background-color:#cccccc;}

.showpagePoint {color:#333;text-decoration:none;border: 1px solid #cccccc;background: #cccccc;margin:0 3px;padding:3px;}

.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}

.showpage a {text-decoration:none;border: 1px solid #cccccc;padding:3px;}

.showpage a:hover {text-decoration:none;}

.showpageNum a:link,.showpage a:link {text-decoration:none;color:#333333;}

• Kemudian cari kode </body>

• Copy kode yang ada dibawah ini dan paste kan diatas kode </body>

<script type='text/javascript'>

var pageCount=5;

var displayPageNum=5;

var upPageWord=&#39;Previous&#39;;

var downPageWord=&#39;Next&#39;;

</script>

<script src='http://marbun.googlecode.com/files/scriptsnext.js' type='text/javascript'/>

• Dan terakhir silahkan Save Template anda.

Cara Membuat Deskripsi Dibawah Judul Postingan Pada Mesin Pencari

Pernahkah Anda melihat sebuah deskripsi / penjelasan singkat dibawah judul artikel postingan pada mesin pencari? Deskripsi ini berfungsi memberikan penjelasan yang singkat mengenai artikel yang Anda posting. Dan akan terlihat dibawah judul postingan pada halaman mesin pencari.  
Langsung saja ikuti langkah dibawah ini :
1. Login ke akun blog Anda di sini
2. Buat sebuah postingan baru
3. Sebelum mem-publish artikel, klik -> Search Description (lihat gambar)
4. Tuliskan deskripsi singkat yang Anda ingin tampilkan. Deskripsi disesuaikan dengan tema artikel yang di akan posting
5. Setelah selesai semua, baru kemudian klik -> Publish, untuk mem-publish artikel
6. Selesai

 

Blog Mas Hendra

Tunggu beberapa saat (satu hari atau sampai dua hari) sampai artikel Anda muncul di search engine. Dan perhatikan deskripsi yang Anda tulis tadi muncul dibawah judul postingan. Mudah-mudahan artikel mengenai cara membuat deskripsi singkat dibawah judul postingan pada mesin pencari dapat bermanfaat. Selamat mencoba sob.