Tampilkan postingan dengan label Blog Tutorial. Tampilkan semua postingan
Tampilkan postingan dengan label Blog Tutorial. Tampilkan semua postingan

Membuat Buku Tamu Melayang di blog

Rabu, 17 Juli 2013
Tanpa basa-basi langsung saja copas script berikut
<div id='trik_tengah'>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

    $(".btn-slide").click(function(){
        $("#panel").slideToggle("slow");
        $(this).toggleClass("active"); return false;
    });

 
});
</script>
<style>
/* ---------------
Simple Slide panel with jQuery
---------------------------------- */
#panel {
        height: auto;
        background: #f90;
        width: auto;
        display: none;
    padding: 7px;
    border: #0C0;
    -moz-border-radius-topright:10px;
    -webkit-border-top-right-radius:10px;
    -moz-border-radius-bottomright:10px;
    -webkit-border-bottom-right-radius:10px;
    -moz-border-radius-topleft:10px;
    -webkit-border-top-left-radius:10px;
    -moz-border-radius-bottomleft:10px;
    -webkit-border-bottom-left-radius:10px;
}
.slide {
    margin: 0;
    padding: 0;
    border-top: solid 4px #f90;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaQvrMbLrwamN-SJpzkhvekOJkA6S7tjEK-SB3aEt1HYA7GZAyM5FRV9EVcw_m-AIQ_sbKUzuMOk2-YXR9Prh17nY9-S2IecJFIGUfz-X3sso13Qd-6oG8VXu8ReotsuPIAZFegy614QM/s1600/btn-slide.png) no-repeat center top;

}
.btn-slide {
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrzTBb9pLQWBM7CFWfXcg4mTUp_6g2HXTeX6bs1ECIZRwd1RU08ejuLDF_hZgoHAMBUFbj-FXCZ5RyLtk05cZKeS_wPnIociCVotZOPdAG4BLTz-03i7HTqQprAMBECnwz8dkC76jtIW0/s1600/white-arrow.gif) no-repeat right -50px;
    text-align: center;
    width: 144px;
    height: 31px;
    padding: 10px 10px 0 0;
    margin: 0 auto;
    display: block;
    font: bold 120%/100% Arial, Helvetica, sans-serif;
    color: #fff;
    text-decoration: none;
}
.active {
    background-position: right 0px;
}
</style>

<div id="panel">
<table style="text-align: left; width: 100%;" border="1" cellpadding="2"
cellspacing="2">
<tbody>
<tr>
<td style="vertical-align: top;"><a href="http://s868.photobucket.com/albums/ab246/Rahmad_photos/?action=view&amp;current=74601_179439685419038_100000590236648_539179_2670751_n.jpg" target="_blank"><img src="http://i868.photobucket.com/albums/ab246/Rahmad_photos/74601_179439685419038_100000590236648_539179_2670751_n.jpg" border="0" width="330" height="320" alt="Photobucket" /></a><br /><center><a href="http://facebook.com/Singo07" target="_blank"><img src="http://i868.photobucket.com/albums/ab246/Rahmad_photos/facebook-button.gif" border="0" width="300" height="77" alt="Photobucket" /></a></center>
</td>
<td style="vertical-align: top;"><div id="cboxdiv" style="width: 300px; height: 380px;"></div>

<script type="text/javascript">
var cbvis = false;
var cbload = false;

function togglecbox () {
var cbdiv = document.getElementById("cboxdiv");

if (!cbvis) {
if (!cbload) {
cbdiv.innerHTML = '<iframe frameborder="0" width="300" height="305" src="http://www5.cbox.ws/box/?boxid=706289&amp;boxtag=wwmyc5&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain5-706289" style="border:#EDDEDB 1px solid;border-bottom:0px" id="cboxmain5-706289"></iframe><iframe frameborder="0" width="300" height="75" src="http://www5.cbox.ws/box/?boxid=706289&amp;boxtag=wwmyc5&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform5-706289" style="border:#EDDEDB 1px solid;border-top:0px" id="cboxform5-706289"></iframe>';
cbload = true;
}
cbdiv.style.display = "block";
}
else {
cbdiv.style.display = "none";
}
cbvis = !cbvis;
}
</script>

<!-- move the next line to the bottom of your <body> to defer the loading of your Cbox -->
<script>togglecbox();</script>



<script type="text/javascript">
var cbvis = false;
var cbload = false;
var cbcookie = "cboxvis=";

function togglecbox () {
var cbdiv = document.getElementById("cboxdiv");
var cbbut = document.getElementById("cboxbutton");

if (!cbvis) {
if (!cbload) {
cbdiv.innerHTML = '<iframe frameborder="0" width="300" height="305" src="http://www5.cbox.ws/box/?boxid=706289&amp;boxtag=wwmyc5&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain5-706289" style="border:#EDDEDB 1px solid;border-bottom:0px" id="cboxmain5-706289"></iframe><iframe frameborder="0" width="300" height="75" src="http://www5.cbox.ws/box/?boxid=706289&amp;boxtag=wwmyc5&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform5-706289" style="border:#EDDEDB 1px solid;border-top:0px" id="cboxform5-706289"></iframe>';
cbload = true;
}
cbdiv.style.display = "block";
cbbut.innerHTML = "Close Cbox";
}
else {
cbdiv.style.display = "none";
cbbut.innerHTML = "Open Cbox";
}
cbvis = !cbvis;
document.cookie = cbcookie+((cbvis)?1:0);
}
// Toggle Cbox open if it was previously
var cbcookiei = document.cookie.indexOf(cbcookie);
if (cbcookiei >= 0) {
if (document.cookie.substring(cbcookiei+cbcookie.length, cbcookiei+cbcookie.length+1) === "1") {
togglecbox();
}
}
</script>
</td>
</tr>
</tbody>
</table>
</div>
<p class="slide"><a href="#" class="btn-slide">Buku Tamu</a></p>

</div>

Puisi Untuk Sang Kekasih Ala Blogger

Kamis, 09 Mei 2013

Sebenarnya kita ingin tampil berbeda, agar menunjukan ciri khas sendiri dan menjadi banyak perhatian banyak orang, salah satunya adalah memikat hati sang kekasih
Seorang netter terutama blogger juga mempunyai cara tersendiri untuk memikat hati sang pujangga, secara umum jika di dunia nyata para lelaki untuk merayu wanita biasa menggunakan puisi, bernyanyi, hadiah coklat atau mungkin lebih ekstrim-ekstrim pun dilakukan, tapi saya akan menjelaskan bagaimana seorang Blogger memikat hati wanita dengan caranya sendiri, salah satunya adalah dengan membuat puisi Online, hehehe
caranya mudah kox, minamal ngerti tentang sintaks html, daftar domain dan webhosting. Jika ketiga paket ilmu sederhana tadi sudah dimiliki tinggal eksekusi dan praktek saja, oklah mari kita mulai

Pertama silahkan daftar domain, tak perlu yang premium semacam .com .web.id .co.id dan sebagainya. cukup daftar yang gratisan juga banyak kox, seperti bawaan sub domain hostinger kita ataupun domain gratis lainya seperti dot.tk
1. daftar dulu .tk disini
2. masuk domain pannel, add domain




3. masukan nama domain kalian, kali ini saya memilih mybeloved.tk . kalian juga dapat memilih puisicintaku.tk terserah kalian deh, hehehehe
jika sudah terdaftar silahkan kalian atur  Domain settings for this domain dengan hostingan kita, kali ini kita akan memakai hostingan gratisan dari idhostinger, isikan sesuai gambar berikut
Langkah kedua adalah daftar Hostingan dulu, ane saranin di idhostinger gan, lumayan gratisan kox
1. daftar dulu disini
2. Jika sudah selesai masuk control pannel, masuk ke cpanel domain kalian dan lihat akses akun ftpnya


3. Jika sudah jalankan Filezilla, isikan akses akun ftp sesuai dengan hostinger kalian
4. Download File Sourcenya disini lalu tinggal di upload deh, jangan lupa file default.php nya dihapus dulu
sekian dan terimakasih, semoga bermanfaat, semoga sang kekasih bahagia

dan ini punya ane http://www.mybeloved.tk/

Pasang Iklan Google Adsense di Postingan Blog

Minggu, 24 Februari 2013
Bagaimana cara pasang iklan Google Adsense di dalam Postingan Blog, ternyata cara ini cukup mudah dan dapat dipelajari oleh Blogger awam pun. Mungkin alasan utama kenapa para peraup Dollar di dunia Blog menempatkan iklan mereka terutama Google Adsense berada di dalam postingan adalah karena kesempatan klik pengunjung lebih besar dibandingkan bila kita pasang di posisi sidebar, mungkin ada cara lain yang lebih menguntungkan dan kesempatan lebih besar, yaitu pasang iklan Google Adsense dengan Floating atau Mode melayang pada kedua sisi, namun cara ini melanggar dari TOS Google Adsense sendiri, yang berakibat di banned Google Adsense kita. Dari pada tidak mau ambil resiko, lebih baik memasang iklan Google Adsense di dalam postingan seperti pada iklan yang berada portal terkemuka detik.com

cara pertama adalah silahkan login ke dalam akun Blogger Anda, masuk ke pengeditan template, lalu pilih edit html. Kemudian cari kata berikut ini  <data:post.body/> dengan menekan tombol ctrl + f , copykan code 
<div style='float: right;'>
KODE IKLAN ANDA PASANG DI SINI
</div>
diatasa code  <data:post.body/> tadi, sehingga akan menjadi seperti di bawah ini
<div style='float: right;'>
KODE IKLAN ANDA PASANG DI SINI
</div>
      <data:post.body/>
 sebelum meletakkan kode adsense terlebih dahulu harus di parse ke dalam sintaks html, caranya adalah silahkan copykan semua kode script iklan Google Adsense Anda lalu silahkan buka halaman berikut ini:

http://accessify.com/tools-and-wizards/developer-tools/quick-escape/default.php

lalu klik convert to escaped characters, lalu copas kode hasil pharse tadi ke dalam kode iklan di atas yang berwarna merah.
Keterangan :

- Kode right dapat anda ganti dengan left tergantung kebutuhan anda.
- Usahakan pada saat edit gambar ke dalam postingan,jangan di edit tepat di bawah postingan.
- Jika anda pasang di atas kode pertama <data:post.body/> tidak berhasil,maka pasang di atas  kode kedua <data:post.body/> di templetes anda, karena biasanya ada dua kode tersebut pada templetes blogspot.

dan hasilnya dari experiment ini

gimana mudah bukan? selamat mencoba kawan-kawan, semoga profit iklan Google Adsense Anda semakin meningkat :D


Cara terbaru mengatur kustom domain dari Intuit di Blogger

Selasa, 15 Januari 2013
Pada posting kali ini saya akan menjelaskan kepada kamu bagaimana cara seting kustom nama dari Intuit di Blogger.
Ok, langsung saja ikuti langkah-langkah berikut ini.

1. Daftar dulu di http://freedns.afraid.org/signup/
2. Jika sudah klik Domains > Add A Domain into FreeDNS.



3. Masukkan nama domain kamu di situ.



4. Selanjutnya Sign In ke Intuit, setting Nameserver nya menjadi:
ns1.afraid.org
ns2.afraid.org
ns3.afraid.org
ns4.afraid.org 





5. Kemudian Login ke Blogger.
6. Pilih blog yang akan menggunakan nama domain baru.
7. Pergi ke Setelan > Dasar
8. Pada bagian "Penerbitan" klik "Tambahkan domain khusus"
9. Sekarang klik pada bagian "Alihkan ke setelan lanjutan", ketik URL nama domain baru kamu menggunakan awalan "www"
10. Klik "Simpan". Kemudian blogger akan menampilkan error seperti ini "Kami tidak dapat memverifikasi otoritas Anda untuk domain ini. Kesalahan 14."



11. Perhatikan dua kode yang disorot pada gambar di atas. Itu adalah CNAME kepemilikan domain kamu yang nantinya akan digunakan untuk verifikasi kepemilikan domain.
12. Kemudian pada DNS Afraid, Manage domain kamu yang tadi.



13. Atur seperti ini, masukkan IP Blogger & CNAME Blogger kamu yang tadi.



IP Blogger:
216.239.32.21
216.239.34.21
216.239.36.21
216.239.38.21

14. Selanjutnya ke Blogger lagi, masukkan domainnya & Simpan.



15. Selesai. Jika masih menampilkan pesan error, tunggu beberapa jam, kemudian ulangi lagi menambahkan nama domain kamu pada pengaturan Blogger.

Sekarang blog kamu sudah menjadi Top-Level Domain. Semoga bermanfaat.

Membuat Banner Full Fanspage cantik

Senin, 16 April 2012
Sahabat Singo's Blog, pagi yang cerah ini tapi suasana suram di PKL saya ingin membagikan tips sederhana bagaimana cara membuat gadget fanspage yang aduhai..oklah.. tanpa basa-basi langsung caps cus...


Langkah pertama anda masuk ke menu design>page elements>add a gadget>HTML/javascript..


lalu masukkan kode di bawah ini:
-----------------------------------------------------------------------------------------------------------------------------
<style type="text/css">
/*<!CDATA[*/
#w2b-mashable{width:320px;margin:auto;padding:0;}
.w2b-googleplus {height: 57px;}
.w2b-facebook {background:#FFFFFF;border: 1px solid #DCDCDC;margin-top: -2px;padding: 5px 10px;}
.w2b-gplusone {background-color: #f5fcfe;border: 1px solid #d8e6eb;border-top: 1px solid white;font-size: .87em;color: black;padding: 9px 0 0 11px;line-height: 24px;height:30px;}
.w2b-gplusone span {display: inline-block;vertical-align: middle;height: 20px;margin-top: -17px;font-size: 11px;font-family: "Arial","Helvetica",sans-serif;}
.w2b-twitter {background-color: #eef9fd;border: 1px solid #c7dbe2;border-top: 0;}
.w2b-twitter a.twitter-follow-button {display: block;}
.w2b-twitter iframe {margin: 9px 11px;}
.w2b-sociallinks {background-color: #d8e6eb;border: 1px solid #b6d0da;border-top: 1px solid #eff5f7;padding: 10px 11px;overflow: hidden;}
.w2b-sociallinks a {text-shadow: 1px 1px white;}
.w2b-sociallinks .w2b-social {list-style: none;overflow: hidden;margin: 0 !important;padding: 0 !important;}
.w2b-sociallinks .w2b-social li {border:0 none !important;float: left;line-height: 1;padding: 2px 0 4px 20px !important;margin-bottom: 3px;width: 70px;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-EP6wfOWEMcurMYhfWW05a1VOLHYXSsP-TP5GcgraaBwjSwqWV3CbMHM258Rg3lMWNEvK3v9VpHC9d80b7NX-2GBMsxrVII-7AnvkIG2hvm57iVl-zPb6rI0vRsgH-4CdVQ1N96UkSEbE/s1600/w2b_socialsprite.png) no-repeat;font-size: 12px;}
.w2b-sociallinks .w2b-social li a {display: block;font-weight: bold;color: #1E598E;text-decoration: none;text-shadow: 1px 1px 1px #fff;}
.w2b-sociallinks .w2b-social li a:hover {text-decoration: underline;}
.w2b-sociallinks .w2b-social li.twitter {background-position: 0 -150px !important;}
.w2b-sociallinks .w2b-social li.facebook {background-position: 0 -450px !important;}
.w2b-emailbox {background-color: #E3EDF4;border: 1px solid #b6d0da;border-top: 1px solid #eff5f7;padding: 12px 16px;overflow: hidden;}
.w2b-emailbox form{width:100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;border: 0;}
.w2b-emailbox input.emailu {float:left;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;border: 0;color: #999;padding: 7px 10px 8px;width: 100%;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;font-size: 13px;}
.w2b-emailbox input.emailu:focus {color: #333;}
.w2b-emailbox input.submitu {-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;color: white;padding: 7px 14px;font-weight: bold;font-size: 12px;float: right;cursor: pointer;}
.w2b-emailbox input.submitu:hover {text-decoration: none;}
.w2bDefault {border: 1px solid #cc7c00;text-shadow: #d08d00 1px 1px 0;background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffca00),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: linear-gradient(center top,#ffca00 0,#ff9b00 100%);}
.w2bDefault:hover {background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffe480),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: linear-gradient(center top,#ffe480 0,#ff9b00 100%);}.w2b-moresubs {background: none repeat scroll 0 0 #EBEBEB;border-style: solid;border-width: 1px;border-color: #fff #ccc #ccc;padding: 3px 8px 3px 3px;text-align: right;font-size: 7px;letter-spacing: 1px;}
.w2b-moresubs a {display: inline-block;font-weight: bold;color: #1E598E;text-decoration: none;text-shadow: 1px 1px 1px #fff;}
/*]]>*/
</style>
    <div id="w2b-mashable">
    <div class="w2b-googleplus">
        <script type="text/javascript">
        /*<![CDATA[*/
        window.___gcfg = {lang: 'en'};
        (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 class="g-plus" data-href="https://plus.google.com/101044849861470073015" data-width="300" data-height="69" data-theme="light"></div>
    </div>
    <div class="w2b-facebook">
        <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FSingos-Blog%2F140694495993878&amp;send=false&amp;layout=standard&amp;width=280&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font=arial&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:280px; height:66px;" allowtransparency="true"></iframe>
    </div>
    <div class="w2b-gplusone">
        <script type="text/javascript">/*<![CDATA[*/
          (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 class="g-plusone" data-size="medium" data-href="http://nyem2nyem.blogspot.com/"></div>
        <span>Recommend on Google</span>
    </div>
    <div class="w2b-twitter">
        <a href="https://twitter.com/sandyhackers" class="twitter-follow-button" data-show-count="true">Follow @sandyhackers</a>
        <script type="text/javascript">/*<![CDATA[*/!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");/*]]>*/</script>
    </div>
    <div class="w2b-sociallinks">
        <ul class="w2b-social">
        <li class="twitter"><a href="http://www.twitter.com/sandyhackers">Twitter</a></li>
        <li class="facebook"><a href="http://www.facebook.com/singo07">Facebook</a></li>
        </ul>
    </div>
    <div class="w2b-emailbox">
        <form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=suaragemilang&apos', 'popupwindow', 'scrollbars=yes,width=550,height=520'); return true" target="popupwindow">
        <table width="100%">
            <tr>
            <td>
                <input class="emailu" name="email" placeholder="Enter your email" type="text"/>
            </td>
            <td width="64px">
                <input class="submitu w2bDefault" type="submit" value="Subscribe"/>
            </td>
            </tr>
        </table>
        <input name="uri" type="hidden" value="singo07"/>
        <input name="loc" type="hidden" value="en_US"/>
        </form>
    </div>
    <div class="w2b-moresubs">
       
    </div>
    </div>

----------------------------------------------------------------------------------------------------------------------------------
-ganti warna  orange dengan lebar widget blog anda
-ganti warna hijau dengan tinggi widget ini 
-ganti warna merah dengan url fanspage, twitter dan Google+ Anda...


hehehheheheh
sekian klo kepengin bantuan comeng ajwah....
jadinya pasti keren....


Tips Sukses Dunia Blog

Sabtu, 14 Januari 2012
Mengubah Mindset
jangan terpaku pada hal yang instan dan picik , membuat blog jangan terlalu berorientasi pada uang, ubahlah pemikiran yang terbawa nafsu dengan kebaikan untuk mempermudah orang lain medapatkan informasi. Dengan kebaikan untuk membantu orang lain, karena kebaikan kecil akan bertelur dengan kebaikan yang besar layaknya reaksi beruntun nuklir.Yang menjadi permasalahanya adalah kita sering tergiur dengan panawaran formula produk dengan menghasilkan uang secara instan denagn mengabaikan pengorbanan yang ada.Faktanya bisnis Blog dalam menghasilkan Income Earning tidak semudah membalikkan telapak tangan.

Butuh tahapan yang panjang  dengan sedikit trik dan tips yang perlu dikuasai. kebanyakan Blogger awam akan merasa kesulitandalam menangkap pemikiran ini. Bukankah dalam membuat blog kita hanya memposting dan mengUpdatenya secara berkala. Untuk melangkah menjadi seorang Blogger yan g professional tentunya hal tersebut hanya dianggap langkah dasar saja. Ada banyak rahasi yang perlu Anda pelajari.

Salah satu langkah awalnya adalah mengubah Mindset , yaitu mngubah pola pikir pandangan dan tujuan sebuah blog itu diciptakan. Banyak Blogger yang mengaku profesional wajib mempelajari tahapan-tahapanya, diantaranya
1. Mengolah Tampilan Blog agar membawa kesan bagi pengunjung
2. Isi konten yang menarik dengan segenap informasi yang dibutuhkan pengunjung.
3. Teknik SEO, yaitu suatu teknik dimana Blog kita akan dikenla banyak orang, menganai bab ini akan saya bahas pada pertemuan selanjutnya.
silahkan kritik dan saranya..
saya tunggu di kotak komentar...

Cara Membuat Script Mirip Iklan di Blog

Senin, 09 Januari 2012
Hai..semua, pa kabarmu..? Untuk saat ini, saya tertarik dengan cara membuat script mirip iklan di blog. Terkadang kita sering lihat iklan yang di situ muncul judul menu dan keterangan . Misalnya iklan mirip adsense. Gimana yach cara membuatnya. Okey..siap mulai ..? pada posting kali ini , aku sedikit ngantuk..he..hehe..tapi gak pa2....lanjut terus...ckkckck:
Untuk posting blogku kali ini, aku pengen ngasih tutorial mengenai cara membuat script mirip iklan di blog, tapi iklannya berupa iklan teks. Yang pasti ini, kita di sini belajar bareng buat nambah ilmu. 
Nah ini contoh hasil kreasiku he..hehe:


Penghasilan Blog 
Blog tentang belajar seo , bisnis online dan blogging.
Lifestyle and Fashion, Beauty tips, Skin Care
Kumpulan makalah gratis, dapatkan di sini

Ads by Singo's Blog

Kodenya script untuk membuat iklan di atas :


Cara membuatnya tinggal kamu copy kodenya dan ganti URL nya...Kemudian paste.....
Bagaimana mudah kan ,,,boleh dicoba di blog kamu , Iklannya kamu kreasikan sendiri, warna sesuai seleramu, ukuran juga...he..he,,link nya juga sesuai keinginan kamu..okey...salam dariku " Singo's Blog"

Cara Pasang komentar Fb berjejer dengan Komentar Blog

Minggu, 11 Desember 2011

kembali menemani sobat blogger untuk mempercantik tampilan komentar di blog kita agar kelihatan Rapi dan keren. Pada tutorial yang lalu yakni cara pasang kotak komentar facebook di blog, Komentar Blog dan komentar facebook Berada tidak sejajar atau komentar Fb ada di atas komentar Blog, dan ini membuat blog keliatan sedikit kurang dinamis.
Dengan cara berikut ini juga akan mempermudah Sobat Blogger yang belum pasang Kotak komentar FB  tanpa buat Aplikasi sendiri lagi, Tapi sayang bagi sobat yang sudah pasang Kotak komentar cara lama akan kehilangan Komentar Fb, tapi Komentar Blog tetap ada.
Untuk Melihat Hasil Cara berkut Sobat bisa lihat pada kolom komentar, disana Pengunjung bebas memilih menggunakan kotak komentar Fb atau Blog, Namun disarankan bagi Sobat Blogger sebaiknya meninggalkan komentar di komentar Blogger.


Baiklah Mari Kita Mulai
Pertama
Silahkan sobat ke Account Blog masing-masing dan Pergilah ke Rancangan Lalu Edit HTML dan centanglah dulu Expand Template Widget
Note : Ingat Jangan Lupa Download Template Lengkap Untuk Menjaga Kesalahan.

Kedua
Tekan tombol Ctrl + F pada Keyboard anda, Lalu cari code Berikut :
<div class='comments' id='comments'>
Setelah ketemu Silahkan Copy dan Paste code dibawah ini Tepat dibawahnya
Ini Code nya :


<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments
</div><div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='270'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>

Maka Hasil akan Seperti ini :
<div class='comments' id='comments'>
<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments
</div><div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='270'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
Note :witdh='400' sesuaikanlah dengan Lebar Halaman Artikel Blog masing-masing
Ketiga
Sekarang carilah Code </head>
Lalu silahkan Letakkan Code Berikut Tepat diAtasnya

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='ID FB Sobat disini' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script>  
Maka hasil akan seperti ini :
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='ID FB Sobat disini' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script>
</head>
Note : Ganti ID FB Sobat disini dengan ID Facebook Masing-masing, Cara Melihat Id Facebook seperti berikut : https://www.facebook.com/topandisconnect1
Nama atau Angka dibelakang Alamat Fb sobat, itulah Id Nya.

Keempat
Cari Lagi Code ini  /* Comment atau #comments
Sesuaikan dengan yang ada di Blog, jika tidak Ketemu juga silahkan Cari Code yang semirip Mungkin
Lalu Letakkan Code Berikut di Bawah nya

.comments-page { background-color: #f2f2f2;}
#blogger-comments-page { padding: 0px 5px; display: none;}
.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}
Kelima 
Silahkan Klik Pratinjau dulu apakah Peletakan Code sudah Benar Atau tidak, Jika tidak ada masalah Silahkan Klik SIMPAN

Selamat Mencoba

Cara pasang iklan di samping kiri | kanan Blog | Melayang

berikut ini sebenarnya sudah banyak sahabat blogger lain yang telah memberikan tutorialnya, namun entah kenapa Masih banyak Juga Sahabat Kumpulancara yang menanyakan ini. Cara Pasang Iklan di Blog-pun ada berbagai Cara al :







Cara Pasang Iklan di samping kiri | Kanan Artikel
Cara Pasang Iklan di Atas artikel | dibawah Header
Cara Pasang Iklan Popup | Melayang | Tutup Buka
Cara Pasang Iklan di Bawah Artikel
Cara Pasang Iklan di Tengah Artikel


Dari Berbagai Cara Pasang Iklan diatas, kira-kira menurut Sobat Mana yang Lebih Keren dan MenghasilkanKlik Tertinggi dan tidak Melanggar TOS dari Pemilik Iklan Seperti : Google Adsense, Kumpul Blogger, Adsensecamp dan lain sebagainya.
Menurut Hasil Uji Coba Kumpulancara.com beberapa bulan Terakhir dan mencoba Utak atik sendiri Tempat meletakkan Iklan tanpa Kena Teguran Terutama Oleh GA, Akhirnya ternyata yang memiliki Klik Tertinggi Yakni Dengan Pasang Iklan di sisi Kanan Blog secara Menggantung | melayang Tepatnya di sisi Scroll Layar Monitor Sobat.

Beberapa Sobat Blogger lain telah menulis jika Klik tertinggi dengan memasang iklan dengan cara Popup | Tutup Buka Melayang, Namun sayang cara ini sangat tidak Dibolehkan Oleh GA pada TOS yang sudah ditentukan, jika Ngeyel maka siap-siaplah di PHK. Juga dengan cara ini membuat Blog jadi Berat dan kadang membuat Pengunjung Anda Kesal lalu Malas balik berkunjung.

Baiklah Maaf Jika terlalu Banyak Basa basi Mari kita Mulai.
Langkah-langkah
Pertama :
Silahkan Login Seperti biasa Ke Account Blogger Masing-masing

Kedua
Silahkan SObat masuk Ke menu RANCANGAN lalu Klik EDIT HTML

Ketiga
Download Template sobat dulu untuk menjaga Kesalahan

Keempat
Silahkan Cari Code ]]></b:skin>
Untuk mudahnya Copy kode diatas dan Klik CTRL + F lalu paste

Kelima
Setelah Ketemu Silahkan Sobat Letakkan code ini Tepat Diatas code ]]></b:skin>
Ini codenya :
#trik_pojok {
position:fixed;_position:absolute;top:0px; right:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

Keterangan :
Text yang berwarna biru adalah posisi Iklan, kalau mau merubah posisi text rightdiganti dengan textLeft. Kemudian text top di ganti dengan text bottom
Karena Ukuran banner iklan yang akan kita Pasang yakni 120 x 600, maka sebaiknya Jangan Merubah nilai Top dan Bottom. Jika ingin merubah Posisi iklan Ubah saja Right dengan Left

Keenam
Sekarang Sobat silahkan Cari code ini : </body>
Setelah Ketemu Silahkan Pasang code Berikut diatas </body>
Ini codenya
<div id="trik_pojok">
Pasang Kode Iklan sobat yg berukuran 120 x 600 disini!!!
</div>

Ketujuh:
Klik Simpan

CATATAN :
Ingat!! Iklan Yang cocok untuk Cara ini yakni Iklan berukuran 120 x 600, Utamakan yang berbentuk Banner bukan yang Teks. Karena jika selain Ukuran tersebut maka Blog Sobat Ketutup Iklan

Terakhir 
Apakah Cara ini Dilarang Oleh TOS Google Adsense?
Setelah saya Ubek-ubek semua Tos, Alhamdulillah Cara ini Belum Masuk Kategori Yang Terlarang.
Namun Jika ada SObat Pengguna GA yang ketemu SIlahkan Komentar untuk Bantuannya, agar Kita Aman-aman saja bermain GA
Semoga Bermanfaat

Membuat Menu Tab View

Rabu, 30 November 2011
Menu tabview adalah menu yang berbentuk tabel dengan pengelompokan halaman sesuai dengan tabel menu diatasnya. Menu ini banyak diapakai untuk menghemat tempat pada blog dengan sistem menampilkan atau menutupi halaman tabel sesuai dengan tabel menu diatasnya. Jadi jika kita mengklik menu diatasnya maka halaman tabel yang muncul adalah halaman tabel yang dibuat sesuai dengan menu tabel diatasnya, dan jika kita mengklik menu tabel lain maka yang muncul adalah halaman tabel yang bersesuain namun tetap pada satu tempat itu.

Coba perhatikan dibawah ini :



Gimana sudah paham belum? mau cara buatnya?


Oke kita pakai teori dari Mas Kendhin saja karena mudah dipahami.

Pertama yang harus kamu lakukan adalah Log In dan masuk menuLayout
kemudian masuk bagian Edit HTML

Selanjutnya taruh code CSS dibawah ini diatas code ]]></b:skin>

div.TabView
div.Tabs

{
height: 24px;
overflow: hidden;
}

div.TabView div.Tabs a
{
float: left;
display: block;
width: 90px; /* Lebar Menu Utama
Atas */
 text-align: center;
height: 24px; /* Tinggi Menu Utama
Atas */

padding-top: 3px;
vertical-align: middle;
border: 1px solid #000; /* Warna border Menu
Atas */

border-bottom-width: 0;
text-decoration: none;
font-family: "Times New Roman", Serif; /* Font Menu Utama
Atas */

font-weight: 900;
color: #000; /* Warna Font Menu
Utama Atas */

}

div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #FF9900; /* Warna background
Menu Utama Atas */

}

div.TabView div.Pages
{
clear: both;
border: 1px solid #6E6E6E; /* Warna border Kotak
Utama */

overflow: hidden;
background-color: #FF9900; /* Warna background
Kotak Utama */

}

div.TabView div.Pages div.Page
{
height: 100%;
padding: 0px;
overflow: hidden;
}

div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}

Perhatikan text yang berwarna merah itu keterangan dari menu tab view yang bisa kamu edit sesuai keinginan kamu, untuk code warna bisa dilihat disini.

kalau sudah pasang script dibawah ini diatas code </head>


<script src='http://anas.ku93.googlepages.com/tabview.js'
type='text/javascript'/>

kalu sudah silahkan "Save Template" Anda.

kemudian masuk bagian "Layout -> Page Elements, lalu cari tempat gadgetnya kemudian klikAdd new gadget kemudian pilih HTML/JavaScript dan taruh Code dibawah ini :


<form action="tabview.html" method="get">
<div class="TabView" id="TabView">
<div class="Tabs" style="width: 350px;">

<a>Tab
1</a>


<a>Tab
2</a>


<a>Tab
3</a>


</div>
<div class="Pages" style="width: 350px;
height: 250px;">

<div class="Page">
<div class="Pad">

Tab
1.1 <br />


Tab
1.2 <br />


Tab
1.3 <br />


</div>
</div>

<div class="Page">
<div class="Pad">

Tab
2.1 <br />


Tab
2.2 <br />


Tab
2.3 <br />


</div>
</div>

<div class="Page">

<div class="Pad">

Tab
3.1 <br />


Tab
3.2 <br />


Tab
3.3 <br />


</div>
</div>

</div>
</div>
</form>

<script type="text/javascript">
tabview_initialize('TabView');
</script>

Keterangan :
  1. Code yang berwarna biru
    diatas adalah lebar dan tinggi tabview yang bisa kamu sesuaikan.
  2. Code yang berwarna hijau
    adalah text judul dari menu tabel (tab 1, tab 2, tab 3 ....)
  3. Code yang berwarna merah
    diatas adalah halaman dari tabel yang bisa kamu pasangi code-code
    gagdet, gambar atau link.
  4. Dan jika ingin menambah
    halaman tabel perhatikan code yang berkedip, dan tambah seperti itu
    dibawahnya.
Kalau sudah tinggal SAVE.

Cara Membuat Floating iklan Pada Blogger

Cara Membuat Iklan Melayang Floating dengan CSS Tanpa JQuery supaya lebih enteng.
halo sobat blogger kembali lagi kali ini kang niam ingin bagi-bagi tips buat kawan-kawan yang setia berkunjung ke niamblog, sebelumnya saya pernah posting Cara membuat iklan melayang dengan javascript kali kita akan membuat iklan melayang dalam bahasa gaulnya floating atau apalah saya juga gak mudeng, mungkin sobat pernah membuat iklan melayang, nah disini mungkin cara membuatnya agak sedikit berbeda dengan cara membuat iklan melayang yang banyak dilakukan para sobat blogger, biasanya kita membuat iklan melayang itu menggunakan javascript jquery.js maka tips kali ini adalah hanya dengan CSS saja dan sedikit javascript plus HTML, yang pasti tidak menggunakan jQuery yang memberatkan blog saat di load.
Langkah1
Masuk Dasboard >> Rancangan >> Edit HTML lalu Expand Widget Templates
Langkah2
Cari Kode seperti ini:
1
]]></b:skin>
Bila dah ketemu tambahkan kode Css dibawah ini tepat diatasnya:
1
2
3
4
5
6
7
8
9
10
11
#floating-ads {
position:fixed;_position:absolute;bottom:80px; left:120px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
.bgfloat{}
Bila dah selesai Save Template kamu.
Langkah3
Sekarang masuk Rancangan >> Elemen Laman >> tambahkan Gadget >> pilih Javascript/HTML.
Lalu masukkan kode dibawah ini didalamnya.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script language="javascript">
function closeTopAds() {
document.getElementById("floating-ads").style.visibility = "hidden";
}
</script>
<div id="floating-ads">
<div align="center" class="bgfloat"><img align="absmiddle" onclick="closeTopAds();return false;" src="http://lh6.ggpht.com/_IjrRiI_bVb0/SxtblET-xfI/AAAAAAAACVQ/1i0rufnJAP4/minimize.png" style="cursor: pointer;" />
</div>
KODE IKLAN DISINI
</div>
Langkah4
Save pekerjaan kamu.
! Letakkan kode iklan sobat pada tulisan “Kode Iklan Disini”, dan untuk mengatur iklan sesuai dengan template kamu silahkan diserasikan kode CSSnya dengan Template sobat, karena biasanya ada template yang berbeda.
ini kode yang perlu kamu rubah bila iklannya kurang ke kanan atau ke kiri atau kebawah atau keatas.
1
bottom:80px; left:120px;
Selamat mencoba dan semoga tips yang saya berikan bermanfaat untuk sobat blogger.
 

Linux Opensource & Phreaking Copyright © 2011-2012 | Powered by Blogger