Selamat Datang

Proteksi CSS Dengan PHP

CSS yang merupakan kependekan dari Cascading Style Sheets adalah kumpulan kode yang digunakan untuk mempercantik tampilan website, css mengatur suatu objek harus seperti apa, berwarna apa, bentuknya bagaimana, ukurannya seberapa besar, dan lain sebagainya. CSS Biasanya digunakan di html, php, asp, dan lain lain.

Image Credit by Telegraph.co.uk

Image Credit by Telegraph.co.uk

Membuat CSS itu tergolong gampang-gampang susah. Dan pada suatu hari saya pernah kecolongan CSS Saya, dimana seseorang dengan mudahnya melakukan copy paste kode css dengan fitur View Page Source yang ada di browser, saya mencari cara proteksi css di google. Akhirnya saya menemukannya :D. Okay kita mulai mempelajarinya disini.

Contoh saya gunakan css dibawah :


.class { key:value; }

filenamenya style.css

Kita Ganti nama filenya menjadi berakhiran .php ( contoh : style.css menjadi style.php )

Selanjutnya kita ganti kode diatas menjadi kode berikut

<?php
session_start();
header("Content-type: text/css");
if($_SESSION['NameSession'] != "Key" ){ die("CSS PROTECTED"); }
$_SESSION['NameSession'] = "AnotherKey";
?>
isi css disini

CSS Sudah diproteksi dengan bantuan session php, dimana jika session tidak ditemukan atau tidak cocok maka kode css tidak akan ditampilkan, namun browser hanya akan menampilkan tulisan “CSS PROTECTED”, sampai disini kode ini sudah oke, tetapi belum bisa digunakan.

:: Cara Penggunaan

Kalau ingin menggunakan kode berikut. ( Taruh di index.php / lainnya ), disini kita memprotek isi dari style.php yang isinya adalah kode css dengan menggunakan session di php.

<?php
session_start();
$_SESSION['NameSession'] = "Key";
?>
Isi index / header atau lainnya

:) Silahkan dicoba.

DEMO

Untuk demo silahkan lihat disini.

TIPS LAIN

Untuk menggunakan CSS nya cukup mudah. Namun jangan menggunakan link href, tetapi gunakan @import seperti berikut ini.

<style type="text/css">@import url(http://blablabla/style.css);</style>

Menyamarkan style.php menjadi style.css

dan sedikit lagi. Trik menghilangkan ekstensi .php dan menggantinya dengan .css agar kode dapat diproteksi kita menggunakan .htaccess ( mod_rewrite ). Bagaimana caranya?

Begini Caranya :

RewriteEngine on
RewriteRule style.css style.php

Bagaimana ? Anda bisa ? Coba dulu. Silahkan Berkomentar bila ada masalah, atau belum mengerti.

HASIL

DEMO | DOWNLOAD CODE

Berikut file CSS yang di protek:
http://tutorial-webdesign.com/labs/php/proteksi-css-dengan-php/style.php
http://tutorial-webdesign.com/labs/php/proteksi-css-dengan-php/style.css

Kelemahan

Tidak ada sistem yang sempurna, trik inipun tidak sepenuhnya memproteksi file css kita, misal dengan bantuan firebug kode css masih bisa dilihat, hal ini dikarenakan browser talah mendownload dahulu script css nya dan menyimpannya dikomputer kita untuk diproses oleh browser. Namun trik ini tetap ada gunanya, walaupun kita tidak bisa sepenuhnya membuat ini aman, setidaknya dengan ini sudah cukup menyulitkan orang untuk melakukan copy-paste kode seenaknya, terutama yang belum mengerti tools seperti firebug.

Referensi: Bersumber dari teman, DozaCrack.org entah juga namanya doza crack. hehe Saya bertanya di facebook.





Penulis :

this all about 0 and 1 ~ http://gfajar.com/ http://gfajar.org/ View all posts by Gandara Fajar

Comments

44 thoughts on “Proteksi CSS Dengan PHP

  1. saya sudah coba view-source, terus nemu import style.css, saya coba ganti index.php dengan style.css langsung di address url, sourcenya kebaca bos,.. :)

  2. rendybustari says:

    pake inspect element juga masih bisa kok min :)

  3. Tahu tidak mas/om, tentang proteksi file font di hxxp://www.fontspring.com/

    Dari tab Network Chrome Inspector bisa terlihat data yang ditransfer, tapi ketika dibuka file font tersebut isinya kosong. Jadi tidak bisa dicuri hehe…

  4. Tahu tidak mas/om, tentang proteksi file font di hxxp://www.fontspring.com/

    Dari tab Network Chrome Inspector bisa terlihat data yang ditransfer, tapi ketika dibuka file font tersebut isinya kosong. Jadi tidak bisa dicuri hehe…

  5. Karya kita dicomot itu emang ngga enak, tapi kalo udah di ranah digital, saya pribadi coba tanamkan dalam diri bahwa kemungkinan itu udah jadi bagian di sini :D

  6. str4what says:

    gak work, coba ctrl+a dulu lalu ctrl+u

    cek demonya tadi :v

  7. As Sabiluna says:

    bagi saya tidak perlu css itu dilindung. Yang penting adalah kandungan halaman itu mesti diprotek

  8. qq says:

    bisa dobaca dgn mudah kok di chrome terbaru..?

  9. drimwiper says:

    ga work… tutorial gagal..

  10. Mawan says:

    makasih mas, tapi masih belu paham :D

  11. Edi Liu says:

    Tutorialnya bagus, proteksi sederhana dan untuk melihat isi style.css yang diubah namanya ke style.php, sangat mudah, ketik saja
    [code]
    "view-source:http://tutorial-webdesign.com/labs/php/proteksi-css-dengan-php/style.php&quot;
    [/code]
    di address bar Firefox, maka akan muncul source code CSS-nya.

  12. Acep Miftah says:

    kalau mengamankan css kayak tokobagus itu gimana ya??

  13. Harga Hp says:

    Proteksinya masih kurang ketat masbro, ketika di inspect element masih kelihatan style.css nya. Btw, good job :D

  14. tas mewah says:

    thanks gan berhasil….

  15. cara yang paling ampuh bejimane ya bang ? biar gak bisa di colong css sama open source.. punya wap satu yang copy template nya jutaan.. pusing kalo karya sendiri di copy orang.. gak pada kreatif.. mending copy cssnya sama tampilannya.. tag tag nya jg dicopy itu yg paling nyebelin..

  16. lagubagus says:

    Nice share gan tp kayanya masih tetep bisa di copas :)

  17. muvifly says:

    lumayan buat nambah informasi

  18. Sharelagu says:

    thank atas artikelnya semoga ke depan tambah sukses

  19. wah jadi cara nya seperti itu ya gan
    saya simak n pelajari dlu gan
    tanks info yh

  20. Mp3uc.net says:

    Gan kok masih bisa di source cssnya?

  21. gopena says:

    masih belum bisa gan, ada plugin yang kerjanya seperti itu gak gan?

  22. Oncom man says:

    aku gagal gan heu.. gmna nih

  23. Proteksinya masih agak lemah, saat di inspect element masih kelihatan style.css nya. tapi bagus :D

  24. yuzarsif says:

    ane belum berhasil gan

    padahal sudah mengikuti langkah-langkahnya

  25. masih belum ngerti, itu nyimpen kodenya dmana gan ?
    atau adakah cara lain selain dengan kode, masih kurang faham dengan pemrograman.

  26. masbidin says:

    masih belum bisa Gan, ada cara yang lebih mudah ngga? hhehe

  27. NIH ISI CSSNYA PROTEKSI PROTEKSI GUNDULMU NDUL
    *{
    margin:0; padding:0;
    }
    body{
    background: #EB984F;
    color: #34495E;
    line-height:1.5em;
    }
    a{
    color: #505F6E;
    }
    .container{
    width: 800px;
    margin:30px auto;
    background: #F4D03F;
    }

    /* CSS TWD, Ini rahasia */

    header{
    padding: 30px 15px;
    margin:10px;
    border-bottom:1px solid #F4D030;
    }

    section{
    padding: 30px 15px;
    margin:10px;
    }

  28. pastiguna says:

    itu tiggal copy ke css kan gan

Leave a Comment

XHTML: You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>


Klik Tombol Like / Suka ya kawan..

Klik tombol "Like" atau "Suka" untuk mendapatkan update tutorial, tips & tricks serta info terbaru seputar dunia web design & development