Minggu, 07 Desember 2014

Cara Membuat Blog Tidak Bisa di Copy Paste

Cara Membuat Blog Tidak Bisa di Copy Paste - Apa kabar sahabat yang baik hati nya ? kali ini saya akan memberikan tutorial cara membuat  blog tidak bisa di copy paste. Sebenarnya ini adalah permintaan teman saya yang ingin blognya tidak bisa di copy paste. Ini blognya.


Langsung saja bagaimana cara agar artikel tidak bisa di copy paste :
  1. Masuk ke blogger kemudian ke template->edit html.
  2. Selanjutnya cari kode </head> dengan menggunakan ctrl+f.
  3. Copy paste script di bawah ini dan letakkan di atas </head>.  <script language='JavaScript1.2'>

    //Disable select-text script (IE4+, NS6+)- By Andy Scott
    //Exclusive permission granted to Dynamic Drive to feature script
    //Visit http://www.dynamicdrive.com for this script

    function disableselect(e){
    return false
    }

    function reEnable(){
    return true
    }

    //if IE4+
    document.onselectstart=new Function (&quot;return false&quot;)

    //if NS6
    if (window.sidebar){
    document.onmousedown=disableselect
    document.onclick=reEnable
    }
    </script>
    <script language='JavaScript'>curPage=1;
    document.oncontextmenu = function(){return false}
    if(document.layers) {
    window.captureEvents(Event.MOUSEDOWN);
    window.onmousedown = function(e){
    if(e.target==document)return false;
    }
    }
    else {
    document.onmousedown = function(){return false}
    }</script>
  4. Setelah itu save template.
Sekarang sahabat coba cek di blog sobat. Semoga artikel tentang Cara Membuat  Blog Tidak Bisa di Copy Paste berguna bagi sahabat.

Sabtu, 06 Desember 2014

Fungsi Captcha untuk Mengamankan Website Anda dari Spammer

Fungsi Captcha untuk Mengamankan Website Anda dari Spammer - Bagi anda yang sering menggunakan internet, terutama yang sering mendaftar di situs - situs tertentu atau mendownload suatu file pasti anda pernah melihat gambar yang bentuknya kacau. Biasanya gambar itu hanya terdiri dari huruf dan angka, disebut apakah gambar itu ? dan apa kegunaannya ?

kode captcha


Pengertian dan Fungsi Captcha

Gambar yang terdiri dari huruf dan angka yang tidak beraturan tersebut di sebut captcha. Captcha merupakan singkatan dari Completely Automated Public Turing test to tell Computers and Humans Apart adalah sebuah metode turing test yang digagas oleh Alan Turing pada tahun 1950. Captcha digunakan untuk memastikan bahwa respon yang dihasilkan itu dibuat oleh manusia bukan robot.
Kenapa begitu ? ya karena captcha memang dirancang supaya sulit dibaca oleh mesin atau robot atau program komputer, dan yang hanya bisa membacanya hanyalah manusia. Captcha terdiri dari huruf dan angka yang bentuknya tidak rapi, ada yang bengkok, ada yang ancur, meliuk - liuk seperti ular, dan masih banyak lagi.
Sebelum captcha ditemukan banyak spammer dan hacker yang membuat program dimana program tersebut bisa melakukan pendaftaran secara berulang - ulang, dan yang pastinya para hacker tersebut menggunakannya untuk disalah gunakan. Contoh untuk polling hanya dengan membuat program spam mereka hanya membutuhkan waktu singkat untuk mendapatkan polling jutaan.
Namun Captcha sering kali membuat pengguna internet malas dan enggan melakukan signup atau pengisian formulir. Jika anda adalah seorang developer maka captcha adalah barang wajib yang harus anda buat supaya tidak ada pihak yang bermain - main dengan website anda.

Sabtu, 22 November 2014

Cara Membuat Tooltip Dengan CSS

Cara Membuat Tooltip Dengan CSS - Tooltip adalah komponen user interface, dimana komponen ini dapat muncul ketika ada objek yang disentuh. Tooltip biasa nya berisikan bantuan ataupun informasi.


Cara Membuat Tooltip

Pertama anda buat dulu script html sebagai berikut

<div class="button">Sentuh Ini
    <div class="tooltip">
        Ini Merupakan tooltip yang dibuat menggunakan CSS
        <img src="3.png" />
    </div>
</div>

Selanjutnya Script CSS seperti dibawah ini
html {
    font-family:Arial, Helvetica, sans-serif;
}
body {
    background:#0C3;
}
.button {
    width:100px;
    text-align:center;
    color:#fff;
    background:#96F;
    border-radius:5px;
    padding:15px;
    font-weight:bold;
    margin:15% auto;
    position:relative;
}
.tooltip {
    position:absolute;
    top:-90px;
    right:0px;
    background:#fff;
    width:300px;
    padding:15px;
    border-radius:10px;
    color:#000;
    display:none;
}
.tooltip img{
    height:20px;
    position:absolute;
    bottom:-20px;
}
.button:hover .tooltip {
    display:block;
}

Penjelasan
  • <div class="button"> tag ini yang akan penulis jadikan objek.
  • <div class="tooltip"> Ini bagian tooltip yang akan muncul ketika objek disentuh.
  • Pada .tooltip  terdapat properti display:none; , ini adalah kondisi saat tooltip semula, yang itu tidak tampil.
  • Pada .button:hover .tooltip  terdapat properti display:block; , ini adalah kondisi objek disentuh yang mengubah properti display:none; menjadi  display:block; 

Selasa, 18 November 2014

Membuat Jendela Pop Up Sederhana Dengan CSS

jendela popup menggunakan css


Jendela Pop Up adalah bagian dari website yang kedudukannya di atas element - element lain. Pada tutorial kali ini saya akan memberikan contoh jendela popup sederhana menggunakan CSS tanpa javascript. Untuk membuatnya ikuti langkah - langkah berikut.

Pertama buat script html seperti di bawah ini

<div class="tombol-popup">
<a href="#popup">Klik disini</a>
</div>

<!--Jendela PopUp Disini-->
<div id="popup">
    <div class="jelndela-popup">
        <a href="" class="close">x</a>
        <h1>Hello World</h1>
        <p>Saya berhasil membua jendela popup dengan menggunakan CSS tanpa bantuan javascript</p>
    </div>
</div>

Setelah itu kita buat style nya
html {
    font-family:calibri;
}
h1 {
    margin:0px;
}
#popup {
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.3);
}
.jelndela-popup {
    position:relative;
    padding:15px;
    background:#fff;
    width:500px;
    margin:15% auto 0;
    border-top:5px solid #96C;
}  
.close {
    position:absolute;
    right:15px;
    top:10px;
    color:#96c;
    text-decoration:none;
    font-size:20px;
    font-family:Tahoma, Geneva, sans-serif;
    padding:5px 10px;
    background:#eee;
}
.tombol-popup{
    width:200px;
    text-align:center;
    margin:15% auto 0;
    border-radius:5px;
    color:#fff;
    text-decoration:none;
    background:#96C;
    overflow:hidden;
    box-shadow:0px 0px 5px #000;
}
.tombol-popup a{
    padding:20px;
    display:block;
    font-size:20px;
    color:#fff;
    text-decoration:none;
}
#popup:target {
    display:block;
}

Penjelasan

  • #popup:target yang akan digunakan untuk memunculkan jendela popup, karena link dari tombol popup mengarah ke #popup. 
  • Karena div#popup yang akan menjadi target maka kita tambahkan #popup:target pada script css dan memberi style display:block, agar div#popup bereaksi pada saat kita mengklik tombol popup yang memiliki link #popup.
Penjelasannya agak ribet, kalau belum jelas silahkan berikan komentar....
Selamat Mencoba


Cara Mudah Install Opencart di localhost

Opencart adalah sebuah Content Management System (CMS) yang dirancang untuk membangun website toko online. Bagi anda yang belum menguasai pemrograman web, CMS ini bisa menjadi solusinya, kita tidak perlu repot - repot membangun website dari awal. CMS berbasis toko online ini juga dilengkapi dengan fitur ShoppingCar. Selain itu CMS ini juga opensoure, mudah di custom, mendukung multi bahasa termasuk Bahasa Indonesia, dan masih banyak lagi.

Cara menginstall Opencart

Untuk menginstall opencart anda bisa mengikuti langkaj - langkah di bawah ini :








  1. Downlaoad File Opencart terupdate di sini.
  2. Ekstrak File Opencart dimana saja.
  3. Cari folder upload di dalam folder ekstrak tadi, lalu pindahkan ke folder htdocs C:\xampp\htdocs
  4. Ganti nam folder tersebut, misal "toko-online", tidak juga tidak apa
  5. Ganti nama file config-dist.php menjadi config.php pada folder toko-online
  6. Ganti nama file config-dist.php menjadi config.php pada folder toko-online/admin
  7. Buat Database Baru, misalnya db_opencart.


  8. Buka Browser, ketik di address bar localhost/toko-online. Hingga muncul halaman License agreement


  9. Ceklist “I agree to the license” kemudian klik Continue, maka akan tampil halaman Pre-Installation, di halaman ini pastikkan semua status ceklist dan writable

  10.  Setelah itu klik continue.


  11. Pada halaman berikutnya yaitu step-3 isi data yang diperlukan untuk koneksi database, dan administrator website, kemudian klik continue


  12. Selanjutnya akan tampil halaman complete installation


  13. Dibawah ini adalah tampilan dari halaman website anda

Back To Top