Cara Mengedit Template Mentah 2

Minggu, 29 Agustus 2010 , Posted by GAPTEK at 14.29



BISMILLAAHIRROHMAANIRROHIIM

Baiklah, pada kelanjutan kali ini kita akan membahas proses pengeditan template mentah menjadi template pilihan kita. Pastikan sahabat telah benar-benar memahami langkah sebelumnya.

Untuk melakukan pengeditan, sahabat harus sudah menyiapkan gambar pengganti dan kata-kata penggantinya. Jangan lupa, gambar pengganti harus terlebih dahulu di Upload di Photobucet.com

Kami akan berikan satu contoh detail pengeditan pada kasus template yang kita bahas ini. Untuk yang lain, sahabat bisa mencobanya sendiri karena langkahnya sama.

Kode template yang akan kita edit

<!-- begin featured content #1 -->
<div class='featuredpic' id='zv_img1' style='display:block;'>
<a href='#'><img alt='' src='http://www.opendrive.com/files/6873760_kB2HN/1.jpg'/></a>
</div><!--/featuredpic-->
<div class='featuredtext_holder'>
<div class='featuredtext' id='zv_text1' style='display:block;'>
<div class='featured_fixed_height'>
<h1 class='featuredposttitle'>Pureness – Free Contact Form Design/Interface (PSD)</h1>
<span class='featuredpostcommentcount'>8 comments</span>
<div class='featuredpostcontent'><p>Pureness is my second set of contact form interface. It is white in colour and saved as PSD format so that you can change its colour to suit your design. Feel free to use it for any purpose, even commercial projects. Change the main colour using &#8220;Hue &amp; Saturation&#8221; to your desired colour.</p>
</div>
</div>
<span class='featuredseemore'><img alt='' src='http://www.opendrive.com/files/6869298_ZE92w/seemore.gif' style='vertical-align:middle'/> Filed under Contact Form Design, Freebies, Resources</span>
</div><!--/featuredtext--></div>
<!-- end featured content #1 -->

Mengubah gambar

Gambar yang akan diubah
http://www.opendrive.com/files/6873760_kB2HN/1.jpg
Diganti dengan gambar
http://i864.photobucket.com/albums/ab207/fotomember/3.jpg

Mengubah Kata atau kalimat

Kata atau kalimat yang akan di ubah
1] Pureness – Free Contact Form Design/Interface (PSD)
2] 8 comments
3] Pureness is my second set of contact form interface. It is white in colour and saved as PSD format so that you can change its colour to suit your design. Feel free to use it for any purpose, even commercial projects. Change the main colour using &#8220;Hue &amp; Saturation&#8221; to your desired colour.
4] Filed under Contact Form Design, Freebies, Resources
Diganti dengan
1] Keluarga Besar GAPTEK
2] We Are One
3] Kami terdiri dari Mahasiswa, Santri Pondo Pesantren, Pelaja SMA/MA, Pelajar SMP/MTs, Guru, Petani dan wiraswastawan. Tampak pada gambar di samping, musyawarah antar seluruh kalangan dengan diwakili oleh para tokoh-tokoh penting. Kami adalah paguyuban masyarakat Ketapang.
4] GABUNGAN PECINTA TEKNOLOGI

Maka cara penulisannya dalam bentuk kode adalah

<!-- begin featured content #1 -->
<div class='featuredpic' id='zv_img1' style='display:block;'>
<a href='#'><img alt='' src='http://i864.photobucket.com/albums/ab207/fotomember/3.jpg'/></a>
</div><!--/featuredpic-->
<div class='featuredtext_holder'>
<div class='featuredtext' id='zv_text1' style='display:block;'>
<div class='featured_fixed_height'>
<h1 class='featuredposttitle'>Keluarga Besar GAPTEK</h1>
<span class='featuredpostcommentcount'>We Are One</span>
<div class='featuredpostcontent'><p>Kami terdiri dari Mahasiswa, Santri Pondo Pesantren, Pelaja SMA/MA, Pelajar SMP/MTs, Guru, Petani dan wiraswastawan. Tampak pada gambar di samping, musyawarah antar seluruh kalangan dengan diwakili oleh para tokoh-tokoh penting. Kami adalah paguyuban masyarakat Ketapang.</p>
</div>
</div>
<span class='featuredseemore'><img alt='' src='http://www.opendrive.com/files/6869298_ZE92w/seemore.gif' style='vertical-align:middle'/> GABUNGAN PECINTA TEKNOLOGI</span>
</div><!--/featuredtext--></div>
<!-- end featured content #1 -->

Kalau sudah melakuan pengeditan seperti gambar di atas, sahabat tinggal menyimpan perubahan templatenya dengan mengklik "SIMPAN TEMPLATE" dan silahkan lihat perubahannya.

StumpleUpon DiggIt! Del.icio.us Blinklist YahooTechnorati Simpy Spurl Reddit Google Twitter FaceBook

Buzz Facebook Digg twitter

Currently have 0 komentar:

Leave a Reply

Posting Komentar