Kamis, 19 Mei 2011

:::.Edit Template CSS Menggunakan Asp.net..:::

salam belajar....
nah sekarang tiba saatnya kita untuk belajar mengedit template di Asp.net. Sebelum kita mengedit template tentunya kita harus mendownload template terlebih dahulu. pada contoh ini saya menggunakan template yang saya download dari csstemplatesforfree. kalau sudah anda download ekstrak terlebih dahulu...

sekarang kita masuk di langkah-langkah mengedit template :

1. pastikan anda membuat satu projek kosong baru
2. add item masterpage dan webform dengan cara klik kanan pada project anda kemudian pilih add item.. biarkan namanya seperti itu.
3. klik kanan lagi pada projectnya kemudian piih add asp.net folder dan pilih theme
ganti folder theme yang baru di buat dengan nama default
4. nah.. sekarang copy template yang baru anda download, sebelumnya ekstrak terlebih dahulu.. copy dan paste di folder project anda..
5. kembali ke program dan klik kanan pada project anda pilih refresh folder agar supaya template yang di copy tadi bisa terbaca di program
6. drag folder image dan cssnya ke dalam folder App_themes-default
7. buka file index.html. perhatikan pada Gambar ini copy sampai di footer

















8. langkah selanjutnya buka masterpage paste di bawah body form id form1 runat server div. sorry tidak bisa tanda lebih kecil lebih besar jadi saya ketik langsung aja.. perhatikan saja gambar di samping ini










9. selanjutnya mengcut contenplaceholder
seperti terlihat
pada gambar di samping ini
perhatikan yang terblok itu yang di cut








10. paste di bawah div id page




11. tahap berikutnya cut div id content
seperti terlihat pada gambar berikut ini..

perhatikan yang terblok itu yang di cut












12. buka default.aspx dan paste sebelum /asp:content

13. ini adalah langkah terakhir perhatikan buka file web.config, kalau file ini belum ada anda pilih add item lagi...

sekarang perhatikan di bawah system.web anda tambahkan code berikut ini
pages theme="default" /pages

atau terlihat seperti gambar berikut ini




sekarang tinggal jalankan saja programnya

selamat mencoba... ..


0 komentar:

Posting Komentar

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Akbar