pop-up bawah


Paket Minyak Cinta 728x90

Bisnis Online

Bisnis Online


Bisnis Online

Saturday, January 31, 2015

Cara Pasang Related Post + Thumbnail Versi 2

etelah sebelumnya saya memberikan tutorial mengenai cara membuat related post untuk menampilkan list judul postingan yang berhubungan dengan postingan utama, kali ini saya akan berikan satu lagi tutorial membuat related post tai kali ini dengan menyertakan thumbnail. Related post atau artikel terkait dapat memudahkan pembaca untuk mencari topik yang berkaitan. Untuk mengetahui lebih banyak tentang related post baca disini. Nah kali ini saya ingin membahas cara membuat related post yang lebih menarik yaitu dengan menambahkan thumbnail atau gambar didalamnya. Agar lebih jelas perhatikan gambar dibawah ini.
related 
 
Menarik bukan? Cara ini bisa digunakan bersamaan dengan related post tanpa thumbnail. Bagi anda yang tertarik untuk memasangnya, ikuti langkah-langkah berikut:
  1. Yang pasti anda mesti Login ke Blogger dulu 
  2. Buka menu Design -> Edit HTML 
  3. Beri centang pada "Expand Widgets Templates"
  4. Letakkan kode berikut diatas </head>
    <!--Related Posts with thumbnails Start-->
    <!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
    <style type='text/css'>
    #related-posts {
    float:center;
    height:100%;
    min-height:100%;
    padding-top:10px;
    padding-left:15px;
    padding-right:15px;
    }

    #related-posts h2{
    font-size: 1.3em;
    color: black;
    font-family: Arial;
    margin-bottom: 0.75em;
    }

    #related-posts a{
    color:black;
    }

    #related-posts a:hover {
    background-color:#eeeeee;
    }
    </style>
    <script type='text/javascript'>
    var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmf6yLBmE9jEyW90GzuRocHCmdN8I45UFmCqK0fWpHWoeIPU1BngGxCiRtXsKFcmVDmHLKNEdjBbGopmfla6GzoH9WHTVwRjIRu2_fdDgZUaHrvJn2Q5TGjn0ZFXGmnXvcyYL-E8l-K4gf/";
    var maxresults=5;
    var splittercolor="#cccccc";
    var relatedpoststitle="You might also like:";
    </script>
    <script src='https://sites.google.com/site/bangkolis/javascript/maskolis.js' type='text/javascript'/>
    <!-- remove --></b:if>
    <!--Related Posts with thumbnails End-->
  5. Lalu cari <p class='post-footer-line post-footer-line-1'/> 
  6. Kalau tidak ketemu coba cari post-footer-line 
  7. Letakkan kode berikut dibawahnya.
    <!-- Related Posts with Thumbnails Code Start-->
    <!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div id='related-posts'>
    <b:loop values='data:post.labels' var='label'>
    <b:if cond='data:label.isLast != &quot;true&quot;'>
    </b:if>
    <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
    <script type='text/javascript'>
    removeRelatedDuplicates_thumbs();
    printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
    </script>
    </div><div style='clear:both'/>
    <!-- remove --></b:if>
    <!-- Related Posts with Thumbnails Code End-->
  8. Terakhir Save template anda.
Keterangan:
  • var defaultnoimage="http://lh5.ggpht.com/_15FopxVONSo/TD3yhixJLoI/ AAAAAAAADaY/gk-KFA5_m7w/noimage.png" menunjukkan gambar yang muncul pada postingan yang tidak memiliki gambar. Anda bisa mengganti gambar tersebut dengan gambar lain. 
  • var maxresults=5 menunjukkan jumlah postingan yang muncul pada related post. Silahkan atur jumlah postingan yang mau ditampilkan dengan mengganti angkanya. 
  • var splittercolor="#cccccc" menunjukkan warna garis pemisah. Ganti cccccc dengan kode warna yang anda inginkan. 
  • var relatedpoststitle="You might also like:" menunjukkan judul related post. Ganti teks yang berwarna merah dengan judul yang anda inginkan.
Bagi anda yang merasa cara diatas terlalu sulit, anda bisa menggunakan widget related post dengan thumbnail yang disediakan oleh linkwithin.com. Untuk cara pemasangannya sangat mudah, berikut langkah-langkahnya:

  1. Buka situs http://www.linkwithin.com 
  2. Isi data-data yang diperlukan pada form yang telah disediakan
    Email: alamat email anda
    Blog link: Alamat blog dimana anda memasang widget related post with thumbnail
    Platform: pilih Other
    Width: pilih jumlah related post yang mau ditampilkan
    Beri centang pada kotak kecil jika anda menggunakan background template yang gelap
  3. Klik Get Widget 
  4. Copy dan paste kode script yang diberikan diatas </body> pada template blog anda lalu simpan template anda. Selesai
Jika ada yang kurang jelas atau mengalami kendala dalam memasang related post dengan thumbnail silahkan tinggalkan komentar anda dibawah ini. Saya akan berusaha untuk membantu anda.
 
Source: maskolis.com

Cara Membuat Related Post dengan Gambar


Related Post dengan Gambar

POSTING tentang cara membuat related post dengan foto atau gambar thumbnail (Related Posts with Thumbnail Image) ini dibuat terkait pertanyaan dan permintaan seorang pengguna template New Johny Wuss. Ia ingin menggunakan posting terkait yang menampilkan foto dan judul.

CB menggunakan kode related post dengan gambar yang di-share oleh Help Blogger dengan sedikit modifikasi dan "membersihkannya" dari kemungkinan ada injeksi link.

Demonya bisa dilihat di blog Cibi Magz. Lihat bagian Related Posts di bawah postingan.

Pengguna New Johny Wuss lainnya boleh mempraktekan ini. Caranya, sebelumnya HAPUS dulu SEMU kode di template yang bertuliskan "related post, lalu lakukan dua langkah mudah berikut ini

Cara Membuat Related Post dengan Gambar di Blogspot

1. Copy + Paste kode di bawah ini DI ATAS kode </head>

<!--Related Posts with thumbnails Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts{float:left;width:auto;}
#related-posts a{border-right: 1px dotted #eaeaea;}
#related-posts a:hover{background: #f2f2f2;}
#related-posts h2{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;}
#related-posts .related_img {margin:5px;border:2px solid #f2f2f2;width:100px;height:80px;transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;-ms-transition:all 300ms ease-in-out;}
#related-title {color:#0033cc;text-align:center;padding: 0 5px;font-size:12px Arial; line-height:16px;text-shadow:0 2px 2px #fff;height:28px;width:100px;}
#related-posts .related_img:hover{border:2px solid #E8E8E8;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}</style>
<script type='text/javascript' src='http://helplogger.googlecode.com/svn/trunk/relatedposts.js' />
</b:if>
<!--Related Posts with thumbnails End-->

Catatan: kode berwarna biru adalah ukuran gambar/foto yang akan ditampilkan, bisa diubah sesuai selera, bisa lebih besar atau lebih kecil.

2. Copy + Paste kode di bawah ini DI ATAS kode <div class='post-footer'> (di template New Johny Wuss ada dua kode begini, pilih kode YANG KEDUA):

<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='related-posts'><b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'></b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle=&quot;<b>Related Posts:</b>&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div class='clear'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

Catatan: kode berwarna biru adalah jumlah related post, bisa diubah sesuai selera, bisa lebih besar atau lebih kecil.

Jangan lupa SAVE Template! Good Luck and Happy Blogging!
 

Membuat Tampilan Gambar Slide di Blogspot

Tips cara membuat album foto pada blogspot ini sebenarnya sudah pernah saya berikan beberapa waktu yang lalu. Hanya saja posting yang pertama tersebut membahas bagaimana cara membuat slideshow album foto pada blogspot dengan memanfaatkan situs gallery foto yaitu www.slide.com. Untuk mengetahui trik pembuatan album foto di blog tersebut, pembaca boleh membukanya kembali disini. Blogspot sebenarnya menyediakan gadget yang berfungsi untuk membuat slide album foto pada blog kita. Namun, menurut saya gadget ini lebih sederhana jika dibandingkan dengan slideshow yang kita buat dari www.slide.com, sebab tampilan slide foto yang kita dapatkan dari situs www.slide.com tersebut bisa kita customize sesuai kehendak kita mulai dari tipe slide, ukuran, animasi, dan lain-lain. Meskipun demikian, tidak ada salahnya jika kita mencoba gadget slide album foto blogspot ini, sebab kesederhanaan biasanya indentik dengan kemudahan dalam pengaplikasiannya. Berikut langkah-langkah menambah album foto pada blogger:

Berikut Langkah-langkahnya :
  1. Login pada akun Blogspot Anda
  2. Klik link menu Tata Letak pada halaman dasbor. Pastikan Anda berada pada sub tab menu Elemen Halaman
  3. Klik link Tambah Gadget pada bagian dimana pembaca ingin memasang slide album foto tersebut
  4. Akan muncul window Tambahkan Gadget yang berisi daftar gadget yang bisa kita tambah. Silahkan cari dan pilih gadget Tampilan Slide
  5. Berikut pengaturannya:
    Judul :
    Isi dengan nama slide foto Anda.
    Sumber :
    • Album Web Picasa. Album ini merupakan album gambar yang telah Anda masukkan pada pada blogspot pembaca misalnya ketika menulis posting. Silahkan klik http://picasaweb.google.com untuk melihat album Anda.
    • Flickr. Flickr merupakan situs yang menyediakan tempat menyimpan foto dan video. Untuk mendapatkan layanan ini, silahkan daftar atau login menggunakan Yahoo ID Anda di www.flickr.com.
    • Photobucket. Ini hampir sama dengan flickr dimana kita bisa menyimpan foto dan video secara online pada situs tersebut. Untuk mendapatkan layanan ini silahkan register di www.photobucket.com
    • Lainnya. Sumber selain yang 3 diatas.
    Pilihan :
    Memilih apakah berdasarkan kata kunci atau berdasarkan album
    Buka link di jendela baru:
    Centang jika ingin foto dibuka pada jendela baru ketika diklik
  6. Sebagai contoh kita menambah slide foto menggunakan Album Web Picasa
    Judul: beri judul slide album
    Sumber : pilih "Album Web Picasa".
    Pilihan : pilih "Album"
    Nama Pengguna : masukkan ID akun Google pembaca. Misalkan akun Google pembaca adalah kampanye@gmail.com, maka isikan "kampanye"
    Album : pilih album yang terdapat pada Album Web Picasa Anda. Perlu diperhatikan bahwa album yang muncul pada list tersebut adalah album yang diperuntukkan untuk "Public". Untuk melakukan pengaturan tersebut, silahkan masuk terlebih dahulu pada http://picasaweb. google.com (masuk menggunakan akun Google Anda). Klik tab "My Photos", setelah itu klik album yang ingin Anda atur parameternya.
    Klik menu "Edit" kemudian pilih sub menu "Album Properties" sehingga akan muncul jendela "Edit album information".
    Lihat dibagian paling bawah, akan ada pilihan "Visibility for this album". Silahkan pilih "Public". Kemudian klik tombol Save changes
  7. Pratinjau album akan terlihat pada jendela tambah gadget tersebut.
  8. Klik tombol SIMPAN
Demikian tadi penjelasan singkat untuk membuat tampilan gambar slide dengan memanfaatkan sadget blogspot. selamat mencoba dan semoga bermanfaat.
 
Source: maskolis.com

Menjadi TOP 10 di Google dengan Keyword Super “google plus”

Banyak tehnik SEO (baik black hat SEO maupun white hat SEO) yang digunakan oleh para pakar SEO terkenal dan handal. Namun semua itu memerlukan biaya yang tidak banyak, ditambah lagi tehnik optimasinya yang rumit dan malah bisa menjadikan website kena pinalti google (terlempar dari mesin pencari google).

Berbeda dengan itu semua, saya mencoba tehnik yang sangat bertolak belakang dengan para pakar SEO yaitu tehnik google plus yang santai. Banyak yang masih belum percaya bahwa efek google plus itu sungguh luar biasa.


Menjadi TOP 10 di Google dengan Keyword Super “google plus”

Coba perhatikan hasil SS saya di ats mengenai hasil penelusuran saya mengenai keyword “google plus”. Saya sempat heran melihat hasil tersebut yang bisa dibilang sangat mengejutkan. Dengan keyword yang bisa dibilang keyword besar blog saya masuk page one google.co.id

Terlepas dari benar atau tidaknya itu hasil penelusuran saya dengan software tadi, saya coba pakai web browser saya dengan mode penyamaran dan hasilnya sama. Sungguh mengejutkan sekali!

Nah, dari sini saya akan mencoba memberitahukan kepada semuanya apa sih yang sudah saya lakukan terhadap blog saya itu?

1. KOD (Keyword on Domain)
Keyword yang menempel pada domain/ subdomain. Pada kasus ini KOD saya yaitu “jasa” dan “gplus” yang membentuk blog bernama jasagplus.blogspot.com

2. KOT (Keyword on Title Blog)
Jelas ini juga mungkin menjadi faktor utama mengapa blog saya bisa pejwan. Jangan lupa imbangi ini dengan memasukkan keyword yang anda bidik ke deskripsi blog.

3. Vote Plus One Google Plus
Tehnik yang saya pakai dalam vote plus one memang agak berbeda dengan optimasi di jasa-jasa optimasi google plus lain. Karena saya mengkombinasikan antara vote yang menghasilkan backlink dofollow dan vote yang menghasilkan backlink nofollow.

4. Kontes Review Kecil
Kemungkinan ke-4 yaitu karena saya sempat membuat kontes review kecil-kecilan. Banyak orang yang mengatakan kontes SEO bisa berakibat fatal, namun sepertinya jika backlink yang didapat itu masih wajar dan berkualitas (ditunjang dari laman dan isi blog pemberi backlink) itu bukan menjadi masalah, justru menurut saya sangat bagus. Jadi kalau mau membuat kontes lebih baik kontes review dari pada kontes SEO.

Nah, itu semua yang saya lakukan di blog saya. Jangan komen “ah masa.. yang bener Cuma itu?” :3 Karena memang hanya itu yang saya lakukan.

Mungkin yang terpenting itu optimasinya stabil dan rata bukan seperti orang naik gunung yang tiba-tiba menanjak kemudian anjlok.

Oh ya, saya tambahin yang secara pengamatan saya itu bagus yaitu ketika semakin banyak orang masuk ke blog kita dengan keyword tertentu, maka secara otomatis blog kita perlahan akan naik peringkat.

Kita bisa mengakali hal ini dengan setiap hari kita online (tiap konek modem kan rata-rata IP kita berganti) dengan mengetikkan keyword yang kita incar dan klik blog kita (kemudian biarkan terbuka layaknya orang sedang membaca). Ingat! IP harus bervariasi.

Mungkin hanya itu yang bisa saya bagikan, kalau berkenan sih jangan lupa promosiin jasa optimasi google plus saya ya :D

Source:  destato.blogspot.com

Cara Membuat Widget +1 Google Plus Melayang pada Blog

Sebenarnya membuatnya cukup simpel, kita bisa menggunakan script message box seperti pada Like Box Facebook dan mengganti script like box facebook dengan script rekomendasi / vote plus one +1.

Jika masih belum paham, akan saya jelaskan caranya beserta tutorialnya. Berikut tutorial Cara Membuat Widget +1 Google Plus Melayang pada Blog :

Cara Membuat Widget +1 Google Plus Melayang pada Blog
  • Seperti biasa, kalian harus  masuk terlebih dahulu ke akun blogger kalian
  • Buka tab tataletak > Tambah gadget
  • Pilih HTML/JavaScript
  • Kemudian kalian bisa memasukkan kode script di bawah ini:
<style type="text/css" scoped>
/* Message Box */
#box-message {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#fff;
font:normal Dosis, Georgia, Serif;
color:blue;
border:2px solid blue;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#box-message a.close {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}
#twitterx {
background: #EEF9FD;
padding: 10px;
text-align:center;
border: 1px solid #C7DBE2;
border-top: 0;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"200px"}, 1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='box-message'>
<!-- HTML Start -->
<div style="text-align: center;">
<p style=" margin:10px; font-size:15px; color:#000; font-weight:bold;">Bantu saya vote +1 pada tombol google plus di bawah!!</p>
<div style='background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1w0lp2F7PLaNpgcIT8lamJx2_Ey8b9JF8PHV-jWaE0dFU7Yyb5WoIx4dSSxhdZi4-Ii7AxiOFaKsynHHvAdla-kT07n9KSL0knMsd5gwnm0YjplrF55Xa2bn1xaSNKc7OgJWJAaZIRrpz/s300/Widget+Melayang+Google+Plus.png)no-repeat top left; width:283px; height:125px; padding-top:27px; text-align:left; padding-left:60px; margin-top:20px'>
<div class='g-plusone' data-annotation='inline' data-width='300'></div>
<script type='text/javascript'>
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>
</div>
<!-- HTML End -->
</div>
<small><div style=”font-size:80%; text-align:right; text-shadow:2px 2px 2px #adadad;”><a href="http://destato.blogspot.com/2014/03/cara-membuat-widget-google-plus.html" target="_blank" title=”widget follow us”>+ Get Widget </a></div></small><a class='close' href='#'>&times;</a></div>
  •  Kemudian save. Selamat! Widget +1 Google Plus Melayang pada Blog kalian sudah jadi!
Keterangan : 
Warna biru : Bisa kalian ganti sesuai kata-kata anda sendiri
Warna merah : Link dari gambar background
Warna hijau : Pengaturan letak tombol google plus

Begitulah tutorial singkat mengenai Cara Membuat Widget +1 Google Plus Melayang pada Blog. Jangan lupa kasih vote +1 juga ya.
 

Menyetel ulang Firefox - Cara paling mudah untuk memperbaiki hampir semua masalah

Cara paling mudah untuk memperbaiki hampir semua masalah

Jika Anda memiliki masalah pada Firefox, menyetel ulang Firefox bisa menjadi solusinya. Fitur setel ulang memperbaiki banyak masalah dengan mengembalikan Firefox ke kondisi baru diinstal sembari menyimpan informasi penting Anda seperti markah dan tab yang terbuka. Selengkapnya Klik di sini

Membuat Tab View Dengan Onclick Event


Tab View Dengan Onclick Event

Akhirnya ketemu tutorial yang lumayan menarik, saya akan mengembangkan tutorial yang satu ini, sekalian berbagi tutorial untuk sahabat Blogger semua. Dengan onclick event maka kita membuat perintah yang lebih sederhana daripada kita membuat perintahnya dengan javascript.
Bagaimana tertarik untuk mencobanya?

Kodenya cukup sederhana seperti di bawah ini :

Kode HTML
<div id="Button1" onclick="document.getElementById('Content1').style.display='block';Content2.style.display='none';Content3.style.display='none';">Button 1</div>
<div id="Button2" onclick="document.getElementById('Content1').style.display='none';Content2.style.display='block';Content3.style.display='none';">Button 2</div>
<div id="Button3" onclick="document.getElementById('Content1').style.display='none';Content2.style.display='none';Content3.style.display='block';">Button 3</div>
<div id="Content1">
<p>
Enter some content here.
</p>
</div>
<div id="Content2">
<p>
Enter some content here.
</p>
</div>
<div id="Content3">
<p>
Enter some content here.
</p>
</div>

Perhatikan pada Button1, di situ kita tampilkan Content1 (display='block') dengan menyembunyikanContent2 dan Content3 (display='none'). Untuk Button2 kita menampilkan Content2 dengan menyembunyikan Content1 dan Content3. Begitu pun dengan Button3 kita menampilkan Content3 dengan menyembunyikan Content1 dan Content2.

Cukup sederhana bukan? Saya yakin Anda yang baru mempelajari kode-kode HTML juga akan lebih mudah untuk memahaminya.


Dan untuk mendapatkan tampilan seperti pada animasi gif di atas, silahkan gunakan kode CSS di bawah ini. Anda bisa memodifnya sesuai dengan selera Anda.

Kode CSS
#Button1,#Button2{margin-top:-30px;padding:0;text-align:center;float:left;border:1px solid #aaa;background:#ddd;cursor:pointer;width:32%;height:25px;line-height:25px}
#Button2{margin-left:34%}
#Button3{margin-top:-30px;margin-right:-2px;padding:0;text-align:center;float:right;border:1px solid #aaa;background:#ddd;cursor:pointer;width:32%;height:25px;line-height:25px}
#Content1{display:block;width:100%;height:300px;padding:0;margin:40px auto;border:1px solid #aaa;text-align:left;background:#fff; overflow: auto;}
#Content2,#Content3{display:none;width:100%;height:300px;padding:0;margin:40px auto;border:1px solid #aaa;text-align:left;background:#fff; overflow: auto;}
#Content1 p,#Content2 p,#Content3 p{margin:10px}

Tab view ini bisa disimpan di postingan atau digunakan di sidebar dan tab view ini sudah responsive.


Source: destato.blogspot.com

Membuat Iklan Gambar Seperti Google Adsense


cara "Membuat Iklan Gambar Seperti Google Adsense" dan inilah yang sobat cari, uniknya gambar iklan tersebut akan berubah-ubah setiap kali reload halaman. Cara ini cukup mudah dan bisa dipraktekan bagi blogger pemula maupun professional

 Untuk Pemasangan ikuti tutorial berikut ini :
1. Masuk ke Blogger
2. Pilih Tata Letak > Buat Widget Baru / Add Widget / HTML/Javascript
3. Masukan kode dibawah ini dalam HTML/Javascript


<script type="text/javascript">
var jumlah_iklan = 3;
var waktu_sekarang = new Date()
var detik = waktu_sekarang.getSeconds()
var pasang_iklan = detik % jumlah_iklan;
pasang_iklan += 1;
if (pasang_iklan == 1) {
    url = "http://destato.blogspot.com/2014/06/cara-mengukur-kecepatan-loading-blog.html";
    alt = "Cara Mengukur Kecepatan Loading Blog";
    title = "Cara Mengukur Kecepatan Loading Blog";
    banner = "http://4.bp.blogspot.com/-mYwieyawg84/U3ybJtGe92I/AAAAAAAABFQ/kKXwtDOACys/s1600/dian-anarchyta.png";
    width = "300";
    height = "250";
}
if (pasang_iklan == 2) {
    url = "http://destato.com/2014/06/widget-yang-harus-ada-di-blog.html";
    alt = "Widget Yang Harus Ada di Blog";
    title = "Widget Yang Harus Ada di Blog";
    banner = "http://1.bp.blogspot.com/--hDKmIUbjEY/U3ybPr1KjAI/AAAAAAAABFg/nHFx087tiX4/s1600/Origin-BTemplate.png";
    width = "300";
    height = "250";
}
if (pasang_iklan == 3) {
    url = "http://destato.blogspot.com/2013/12/cara-memperbanyak-followers-google-plus.html";
    alt = "Cara Memperbanyak Followers Google Plus";
    title = "Cara Memperbanyak Followers Google Plus";
    banner = "http://3.bp.blogspot.com/-sRTcKjWzSfs/U3ybMb0wdAI/AAAAAAAABFY/zkCb_uJJ9h8/s1600/fiseo-mag.png";
    width = "300";
    height = "250";
}
document.write('<a href=\"' + url + '\" target=\"_blank\" rel=\"nofollow\">');
document.write('<img src=\"' + banner + '\" width=')
document.write(width + ' height=' + height + ' ');
document.write('title=\"' + title + '\" alt=\"' + alt + '\"></a>');
</script>

Keterangan
url : silahkan ganti dengan url tujuan iklan.
alt : silahkan tulis keterangan gambar.
title : silahkan tulis judul gambar.
banner : silahkan ganti url gambar.
width : Lebar gambar.
height : Tinggi gambar.


Sekian Tutorial "Membuat Iklan Gambar Seperti Google Adsense" jangan lupa like, dan share tutorial ini, agar sobat blogger lainnya dapat mengetahui tutorial ini.

Source: http://destato.blogspot.com/

Cara Daftar Google Adsense Indonesia Agar Cepat Diterima

Google Adsense adalah salah satu program PPC (Pay Per Click) yang paling banyak digemari oleh publisher Indonesia untuk memonetize situs mereka. Sejak Google Adsense mendukung website berbahasa Indonesia tahun 2012 yang lalu, banyak sekali blogger Indonesia yang mendaftarkan blog mereka di Google Adsense. Sayangnya, untuk menjadi member dan mendapatkan penghasilan dari Google Adsense itu bukan hal yang mudah. 
Bahkan ada yang kesulitan tentang cara daftar Google Adsense, padahal sebenarnya cara mendaftar di program PPC Google ini tidak sulit juga sih.

Banyak blogger yang sudah mendaftar, namun tidak semua diterima menjadi publisher di Google Adsense. Ini karena  website atau blog yang didaftarkan tidak memenuhi kriteria yang diharapkan oleh Google. Pihak Google Adsense menginginkan website/ blog yang menjadi publisher mereka adalah situs-situs yang berkualitas dan memenuhi aturan (TOS) mereka.

Kalau dulu, cara daftar Google Adsense itu sangat mudah. Tapi seiring pertumbuhan dan perkembangan internet, Google Adsense sudah melakukan banyak perubahan pada layanan mereka dan disesuaikan dengan perkembangan yang ada. Membuat sebuah blog ala kadarnya dan diisi dengan konten yang sangat “dangkal”, lalu mendaftarkannya di Google Adsense adalah sebuah tindakan yang sia-sia karena pasti tidak akan diterima.

Lalu bagaimana cara mendaftar Google Adsense agar cepat diterima? Keunikan, nilai jual, dan originalitas sebuah website adalah syarat yang sangat penting agar diterima oleh Google Adsense. PPC ini adalah program periklanan yang sama halnya dengan program periklanan lainnya. Mereka tentunya menginginkan website yang menayangkan iklan mereka bisa memberikan promosi atau pemasaran yang baik bagi para pengiklan. Sebenarnya proses mendaftarnya sangat mudah, tapi untuk bisa diterima pada program PPC Google ini, Anda harus memperhatikan beberapa hal penting.
Pelajari lebih lanjut cara mendaftar di Google Adsense
Sebelum mendaftar, sebaiknya Anda memperhatikan beberapa hal penting berikut ini agar peluang diterima lebih besar:

1. Membuat Konten Yang Unik di Situs Anda

Seperti yang sudah disebutkan sebelumnya, originalitas sebuah ide atau konten di dalam website Anda adalah nilai penting bagi Google Adsense. Mereka memperhatikan apakah konten di dalam sebuah website bermanfaat bagi orang lain atau tidak.
Sebenarnya konten-konten di internet itu banyak yang membahas topik yang sama. Namun, cara penyajiannya atau cara penulisannya yang berbeda. Misalnya, Anda menulis tentang “cara menanam bunga Mawar”, tentunya ada banyak konten di situs lain yang membahas tentang ini. Namun, cara menuliskan konten dan cara menyajikannya di blog Anda pasti berbeda dengan konten di blog orang lain. Nah, kalau konten Anda adalah hasil copy paste dari sumber lain, kemungkinan besar situs Anda tidak akan disetujui untuk ikut program PPC Google Adsense.

2. Perhatikan Umur Situs Yang Didaftarkan

Sebaiknya jangan terlalu terburu-buru untuk mendaftarkan blog Anda untuk Google Adsense karena mereka memperhatikan umur website, jumlah konten, jumlah pengunjung, page view, dan lain-lain. Bila Anda saat ini memiliki blog yang sudah berumur 6 bulan, sudah diisi banyak konten, dan memiliki unique visitor yang stabil, ini bisa meyakinkan pihak Google Adsense bahwa blog Anda adalah tempat yang baik untuk memasang iklan.

3. Perhatikan Jumlah Konten Di Website/ Blog Anda

Jumlah konten adalah salah satu faktor penting agar diterima di Google Adsense. Saya kurang yakin berapa jumlah konten minimun di dalam sebuah website agar bisa diterima, tapi menurut saya pribadi akan lebih mudah diterima bila website kita memiliki banyak konten. Saya pribadi menyarankan untuk membuat minimal 60 konten artikel sebelum mendaftar di Google Adsense.
Untuk situs berbentuk blog, sebaiknya Anda rajin meng-update konten di dalam blog Anda karena ini bisa mempengaruhi penilaian dari pihak Google. Blog yang sering di-update oleh pemiliknya tentunya akan memiliki peluang lebih baik diterima oleh Google Adsense dibandingkan dengan blog yang jarang sekali di-update.

4. Gunakan Blogger.com atau YouTube.com

Nah, ini sangat penting untuk kita perhatikan. Jika Anda sudah memiliki domain dan hosting sendiri, maka peluang untuk diterima oleh Google Adsense akan lebih besar, tentunya dengan memperhatikan poin-poin sebelumnya. Namun, jika Anda ingin menggunakan domain & hosting gratis, dan ingin menjadi publisher Google Adsense, maka sebaiknya Anda menggunakan Blogger.com.
Google Adsense tidak bisa dipasang pada blog yang dibuat dengan WordPress.com, baik itu subdomain di WordPress ataupun domain sendiri yang menggunakan free hosting di WordPress. Ini adalah kebijakan (TOS) dari pihak WordPress.com sendiri, bisa dibaca Di SINI. Blogger.com adalah layanan blog gratis yang diberikan oleh pihak Google. Tentunya ini keuntungan tersendiri bagi mereka yang menggunakannya karena selama ini pihak Google selalu memberikan kesempatan pada para pengguna Blogger.com untuk memonetize blog mereka dengan program Google Adsense.
Jika Anda tidak ingin membuat blog, masih ada cara lain, yaitu melalui YouTube.com. Tentunya Anda harus punya beberapa konten video original yang di-upload ke YouTube.com. Video ini harus memiliki views yang cukup banyak agar bisa diterima di program Google Adsense.

5. Informasi Pendukung

Ada baiknya situs Anda dilengkapi dengan halaman informasi pendukung, misalnya halaman About, Privacy Policy, Kontak, TOS. Ini akan membuat situs Anda terlihat serius dan memperhatikan pengunjung blog Anda.
Pelajari lebih lanjut cara mendaftar di Google Adsense
Konten yang Anda buat tidak harus “luar biasa” agar diterima oleh Google Adsense. Yang terpenting adalah menyajikan konten yang bermanfaat bagi orang lain dan tentunya ditulis dengan cara yang unik, bukan hasil meng-copy konten orang lain. Ada banyak blogger yang memiliki penghasilan rutin dari iklan Google Adsense di blog mereka, mulai dari ratusan hingga ribuan dollar per bulan. Nah, kalau Anda ingin memonitize website/ blog Anda dengan cara memasang iklan, Google Adsense salah satu program PPC yang harus Anda pertimbangkan.

Semoga Bermanfaat

Wednesday, January 21, 2015

Cara mudah Membuat Slide Show Gambar di Blogspot


Pada sore hari ini saya akan mennyapaikan Turitorial pendaek bagaimana Cara mebuat slide show gambar di blog . Fungsi dari slide show ini adalah untuk menampilkan gambar pilihan kita.


Slide show ini berbeda dengan slide show biasanya, karena slide show ini berada diatas postingan blog dan berukuran besar untuk demonya anda bisa melihatnya.


Berikut adalah caranya 
Mempersiapkan gambar

1. Pertama anda siapkan gambar, atau URL gambar. Untuk mendapatkan URL gambar anda bisa mengklik Disni
2. Untuk saran saya, sebaiknya anda menyiapkan gambar yang besar.

Memasang Slide show

1. Login ke blog
2. Template--> edit html
3. Cari kode berikut Silahkan hurufnya di blok dengan mouse. (CRTL+A)
<div id='main-wrapper'>
4. Pastekan kode dibawah ini, letakkan di bawah kode diatas

<!-- Diandiki blogspot Slider Started -->
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>

<div class='fp-slider clearfix'>
<div class='fp-slides-container clearfix'>

<div class='fp-slides'>

<!-- Slide 1 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgp8O-OwmTGCiYWxupb2QgUsWmb-4zgyo3bJlxYnRs16AKHLxR5cm8POa_5T68O0q02qnExlrR8DkZtnXdnI55hdpiAsKb_Kmjutu1OP63l75rKtpkQyzptZ8FmWpZ5jx5hNZqrJ5ejVj1Q/s1600/diandiki+banner.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>Diandiki Blogspot</a>
</h3>
<p>
  Diandiki blogspot, blog ilmu pengetahuan, dan turitorial blogger --> http://diandiki.blogspot.com
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 1 Code End -->

<!-- Slide 2 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuP-dVA8zQVoc968qTTW4kD1k5ZMoiWR-gvkd3XSBoYCB9fYznEKnLjvKhriVg-a8DsAAtbFl0xJWh-7qpkIGLwItgdLeDZC5VzimAgPGBurdXAIrkhdTl90sOYookJSsR7XWcNskKvR_3/s461/coollogo_com-23487472.png'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>Info kuaci</a>
</h3>
<p>
  Kumpulan artikel, cerdas dan unik ---> http://infokuaci.blogspot.com
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 2 Code End -->

<!-- Slide 3 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRkWfzIqBvkiqZ0OmWiqS6FJN-Vhy0FfRD-ljyWPYwyAkfCV-VUuk6QLHe7_wBTK5gXzyz69cpp4l3ibZePhWptNa6C6Qqnn6rDYXuTKVJGJuji0lPyOPVjwOog5xdSTvqUlma74vV9kjA/s400/mesjid+agung.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>Masjid agung sawahlunto </a>
</h3>
<p>
Masjid yang dulunya merupakan sebuah PLTU
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 3 Code End -->

<!-- Slide 4 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='http://indonesia.travel/public/media/images/upload/poi/sumbar_sawahlunto.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>I love Sawahlunto</a>
</h3>
<p>
Saya cinta kota saya, Sawahlunto
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 4 Code End -->

<!-- Slide 5 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='http://static.pulsk.com/images/2013/07/07/80721a32e66cf34c202e0f0686f837bd.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>I love Indonesia</a>
</h3>
<p>
Saya sangat mencintai produk indonesia
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 5 Code End -->

</div>

<div class='fp-nav'>
    <span class='fp-pager'/>
</div> 
           
</div>
</div>
<div style='clear:both;'/>

</b:if></b:if>

<!-- Diandiki Blogspot Content Slider End -->
4 Ket:

  • Warana merah anda ganti dengan URL foto anda
  • Warna biru anda ganti dengan judul foto slide show anda
  • Warna hijau anda ganti dengan deskripsi foto slide show anda
5. Anda pratinjau terlebih dahulu
6. setalah anda pratinjau , dan cocok dengan keinginan anda , simpan


SELESAI