"Css Template" , inilah yang mungkin akan membuat halaman web kamu akan lebih terlihat indah,cantik dan lebih menarik. Mulanya saya juga masih pusing dengan apa yang namanya css template dan bagaimana cara membuatnya. Semua web yang memuat artikel tentang ini pun aku jelajahi, namun demikian masih saja belum ngerti alias blank.Karena banyaknya web yang telah aku jelajahi, akhirnya aku tarik kesimpulan dan hasilnya web ku pun berubah dengan tampilan css template seperti yang sekarang ini. Nah.... kali ini saya ingin berbagi pengalaman tentang bagaimana cara meng-edit halaman dengan css template di wen.ru.
--> Pertama
--> Pertama
Download css template yang masih berbentu file zip disini. Untuk pertama kali cobalah dengan css template dengan tampilan yang yang sederhana, agar nanti kamu mudah untuk mengedit "file html"-nya. Biar kamu tidak merasa bingung dan mudah untuk memberikan gambaran, saya sarankan lakukan edit pada sebuah komputer. Ekstrak tema yang telah kamu pilih tadi hingga hasilnya akan menjadi 4 file yaitu; css, lisensi.txt, images dan index.html.
Kedua
Langkah selanjutnya adalah " masuklah ke situs/wapsite kamu di wen.ru ", lalu buka " wexplorer ". Buatlaf folder dengan menamainya sesuai dengan nama tema yang telah kamu pilih " sunflower " misalnya. Kemudian Upload file css ( biasanya dinamai "default.css" atau " style.css "), dan "lisensi.text", gambar/images. Untuk " index.html "-nya janganlah kamu upload dulu. Sebelum meng-upload gambar/images buatlah terlebih dulu folder didalam folder "sunflower" tadi dengan menamainya "images". Lalu upload gambar/images hasil ekstrak diatas satu-persatu ke dalam folder "images" yg telah kamu buat pada folder "sunflower" tadi ( folder images terletak di dalam folder sunflower ). Misalkan beberapa nama dan jenis gambar/images yang kamu upload adalah; img_01.gif, img_02.jpg. sehingga gambar/images ini pada situs/wapsite kamu akan beralamatkan (url) sebagai berikut;
Langkah selanjutnya adalah " masuklah ke situs/wapsite kamu di wen.ru ", lalu buka " wexplorer ". Buatlaf folder dengan menamainya sesuai dengan nama tema yang telah kamu pilih " sunflower " misalnya. Kemudian Upload file css ( biasanya dinamai "default.css" atau " style.css "), dan "lisensi.text", gambar/images. Untuk " index.html "-nya janganlah kamu upload dulu. Sebelum meng-upload gambar/images buatlah terlebih dulu folder didalam folder "sunflower" tadi dengan menamainya "images". Lalu upload gambar/images hasil ekstrak diatas satu-persatu ke dalam folder "images" yg telah kamu buat pada folder "sunflower" tadi ( folder images terletak di dalam folder sunflower ). Misalkan beberapa nama dan jenis gambar/images yang kamu upload adalah; img_01.gif, img_02.jpg. sehingga gambar/images ini pada situs/wapsite kamu akan beralamatkan (url) sebagai berikut;
- http://wapsite-kamu/sunflower/images/img_01.gif ~
http://apa-maumu.wen.ru/sunflower/images/img_01.gif - http://wapsite-kamu/sunflower/images/img_02.jpg ~
http://apa-maumu.wen.ru/sunflower/images/img_02.gif
Ketiga
Langkah selanjutnya adalah meng-edit file "css". Pada langkah edit "css" ini hanyalah memberikan/melengkapi sebuah alamat/url gambar/images yang ada pada file css tersebut. Buka "file css" dengan fulltex editor lalu edit seperti contoh berikut;
Langkah selanjutnya adalah meng-edit file "css". Pada langkah edit "css" ini hanyalah memberikan/melengkapi sebuah alamat/url gambar/images yang ada pada file css tersebut. Buka "file css" dengan fulltex editor lalu edit seperti contoh berikut;
#header {Lalu masukkan alamat url images hingga menjadi seperti ini.....
width: 680px;
margin: 0 auto;
padding: 0 0 0 0;
background: url(http://images/img_01.gif) no-repeat 74px 18px;
}
#header {
width: 680px;
margin: 0 auto;
padding: 0 0 0 0;
background: url(http://apa-maumu.wen.ru/sunflower/images/img_01.gif) no-repeat 74px 18px;
}
Keempat
Setelah selesai "meng-edit CSS", langkah berikutnya adalah "meng-edit "index.html" yang mana nantinya akan menjadi halaman utama/index dari situs/wapsite kamu. Buka file "index.html" hasil ekstrak tema diatas dengan "notepad" di komputer. Lalu kamu bisa memulai pengeditan dengan cara menggantikan kata-kata atau kalimat sesuai dengan isi yang akan kamu kehendaki. Sebaiknya mulailah dari "tag html" yang paling atas yaitu tag meta keyword, discription, title dan seterusnya hingga tag body. Dan satu hal yang teramat penting yaitu jangan sampai kamu kelewat untuk meng edit "TAG CSS". Isikan alamat url dari "css" yang telah kamu upload pada "tag css" tersebut. Bahwa file css yang kamu upload diatas berada dalam folder "sunflower" sehingga ini mempunyai alamat/url " http://wapsite-kamu/sunflower/default.css atau http://wapsite-kamu/sunflower/style.css " , contoh;
Setelah selesai "meng-edit CSS", langkah berikutnya adalah "meng-edit "index.html" yang mana nantinya akan menjadi halaman utama/index dari situs/wapsite kamu. Buka file "index.html" hasil ekstrak tema diatas dengan "notepad" di komputer. Lalu kamu bisa memulai pengeditan dengan cara menggantikan kata-kata atau kalimat sesuai dengan isi yang akan kamu kehendaki. Sebaiknya mulailah dari "tag html" yang paling atas yaitu tag meta keyword, discription, title dan seterusnya hingga tag body. Dan satu hal yang teramat penting yaitu jangan sampai kamu kelewat untuk meng edit "TAG CSS". Isikan alamat url dari "css" yang telah kamu upload pada "tag css" tersebut. Bahwa file css yang kamu upload diatas berada dalam folder "sunflower" sehingga ini mempunyai alamat/url " http://wapsite-kamu/sunflower/default.css atau http://wapsite-kamu/sunflower/style.css " , contoh;
atau...
lalu edit menjadi seperti ini ...
lalu edit menjadi seperti ini ...
Setelah pengeditan "index.html" kamu rasa cukup, jangan lupa "simpan/save", lalu hasilnya upload ke situs/wapsite kamu di wen.ru dengan cara sebagai berikut;
- Masuk/login ke situs/wapsite kamu di wenru
- Buka wexplorer
- Upload file "index.html" tersebut
