Kali ini saya ingin berbagi tutorial mengenai cara mengumumkan artikel yang baru saja anda buat di situs anda, khususnya sitekno, di akun facebook(selanjutnya kita sebut saja FB) anda. Apa yang harus digunakan, dan bagaimana cara penggunaannya? Sebenarnya sederhana saja cara penggunaannya, kita akan mengoptimalkan fitur RSS feed di situs anda, untuk kemudian kita lakukan beberapa penyetelan di akun FB kita, cukup mudah bukan?

Sebelum menuju ke langkah-langkah pelaksanaannya, berikut saya berikan sedikit informasi mengenai:

- Sasaran yang dituju dari pembuatan tutorial ini adalah, anda yang memerlukan RSS feed situs webnya untuk kemudian dioptimalkan ke dalam akun facebooknya
- Hal-hal dasar yang perlu diketahui dalam tutorial ini:

• Pengetahuan dasar mengenai Facebook dan kepemilikan akun facebook serta pengelolaan dari akun tersebut
• Pengetahuan dasar mengenai RSS feed yang dapat anda temukan di sini

Mari kita menuju langkah-langkah berikut untuk lebih jelasnya:

1. Akses situs anda, di sini saya akan menggunakan tutvill sebagai contoh.
2. Setelah anda masuk ke dalam situs anda, carilah tombol RSS yang tampilannya kurang lebih seperti yang ditunjukkan oleh gambar di bawah ini
   
   
   
   Tombol RSS anda dapat berlokasi di bagian paling atas, bagian panel, dan juga di bagian paling bawah dari situs anda, itu semua tergantung pada theme mana yang anda gunakan
3. Setelah anda menemukan tombol RSS tersebut, klik tombol tersebut
4. Setelah anda mengklik tombol tersebut, perhatikan alamat URL yang tertera pada peramban(browser) anda, di sana akan tertulis alamat URL seperti yang ditunjukkan oleh gambar di bawah ini
   
   
5. Salin/copy alamat URL tersebut. Kenapa disalin alamat URL tersebut? mari kita lanjutkan ke langkah berikutnya :)
6. Akses akun FB anda
7. Setelah anda masuk ke beranda/home akun FB anda, klik menu Profil/Profile di halaman tersebut, seperti yang ditunjukkan oleh gambar di bawah ini
   
   
8. Setelah anda klik menu tersebut, maka anda akan dibawa ke halaman profil anda, carilah tautan/link Pilihan/Options di bagian bawah tombol Bagikan/Share(text field untuk mengupdate status FB anda) di halaman Profil anda tersebut, setelah anda menemukannya, klik lah tautan tersebut.
   
   
9. Setelah anda klik tautan tersebut, maka akan muncul lagi tautan berjudul Pengaturan/Settings di posisi yang sama dengan tautan Pilihan tadi
   
   
10. Klik tautan tersebut untuk masuk ke bagian pengaturan profil anda, disana anda akan menemukan tab Berita yang Anda Kirim/Stories Posted by You yang seperti yang tampak pada gambar di bawah ini
    
    
    
    Klik tautan Blog/RSS seperti yang ditunjukkan di gambar
11. Setelah anda klik tautan tersebut, maka anda akan menemukan tampilan seperti di bawah ini
    
    
    
    Masukkan/tempel/paste-kan alamat URL dari RSS anda yang telah anda salin di langkah 5 di atas, ke dalam field yang telah disediakan untuk mengimpor rss anda ke dalam akun FB anda. Jangan lupa untuk menambahkan "www" sebelum nama domain anda, dan garis miring (/) setelah kata rss, sebagai ilustrasi, ketika anda menyalin alamat URL dari RSS anda barusan, anda akan mendapatkan alamat URL sebagai berikut: "http://tutvill.com/rss(ini jika situs anda bernama domain tutvill)", maka ubahlah alamat URL tersebut menjadi "http://www.tutvill.com/rss/" seperti yang terlihat pada gambar di atas. Kemudian klik tombol "Impor/Import"
12. Setelah anda berhasil melakukan setting RSS anda tersebut, maka tampilan berikutnya yang seharusnya anda lihat, adalah seperti yang tampak pada gambar di bawah ini
    
    
13. Jika anda belum menemukan tampilan seperti yang terlihat pada langkah 12 di atas, maka ada kemungkinan anda kurang tepat memasukkan alamat URL anda, atau juga ada langkah yang terlewat diikuti. Jika hal ini terjadi, dimohon untuk membaca kembali langkah-langkah di atas :)

Setelah anda sukses menyambungkan RSS dari situs web anda, silahkan akses kembali halaman Profil dari akun FB anda, di sana akan terlihat beberapa posting terakhir anda yang anda muat di situs web anda, hal ini juga berguna untuk melakukan pembaruan/update akun FB anda, sehingga rekan-rekan anda di FB dapat melihat berita terbaru tentang anda, meski anda hanya membuat artikel di situs web anda, dan bahkan tidak mengakses akun FB anda sama sekali. Cukup mudah bukan langkah-langkah di atas? :), sedikit pamer dengan apa yang anda muat di situs web anda dan juga memberitakan bahwa anda masih eksis di dunia persilatan situs web :D.

Selamat mencoba ;-).

catatan kaki:
Penulis berterima kasih pada pihak-pihak terkait yang memungkinkan tutorial ini dapat ditayangkan:

• Hari Indra Arbazena dan situsnya onlinetourservices.com, atas ide dan sarannya yang membuat penulis penasaran untuk membuat tutorial ini :). Juga untuk situsnya yang inspiratif dan makin sering diperbaharui, sukses selalu :)
• Situs WeberTube yang menjadi nomer 2 di pencarian google dengan kata kunci "update facebook status with rss" dan juga memuat video tutorial tentang tutorial ini :)
• Blog Facebook Tech yang merupakan pemilik asli dari video tutorial tersebut :)
• Situs daring Flickr yang masih mengijinkan penulis untuk menggunakan quota space dan bandwidthnya untuk menyimpan gambar-gambar yang dibutuhkan tutorial ini ;-)
• Mesin pencari, om google, yang menolong sekali ketika mencari bahan untuk tutorial ini :D

Penat dalam memperbaiki theme-theme sitekno yang kali ini enginenya telah mengakomodir sistem sub kategori, banyak sekali theme yang harus dirubah, dan juga banyak sekali penyesuaian yang harus dilakukan, sehingga, untuk hiburan, saya mencoba untuk mencuci mata ini dengan mengunjungi forum besar tersebut. Baiklah, sudah cukup panjang juga rupanya tulisan ini tanpa sedikitpun menyinggung icon Y!M yang barusan saja disebut di awal artikel :D.

Di sini saya mencoba untuk berbagi informasi mengenai salah satu situs yang menyediakan icon-icon yang cukup cantik dan menarik untuk dapat kita gunakan, beberapa iconnya telah saya capture dan upload sebagai image utama artikel ini. Cara mendapatkannya juga cukup mudah, berikut langkah-langkah yang perlu anda lakukan:

1. Akseslah situs ymgen.com
2. Silahkan melihat-lihat terlebih dahulu icon yang ingin anda gunakan, tampilan icon-icon tersebut berada di sebelah kiri anda, scroll untuk dapat melihat pilihan icon-icon tersebut
3. Setelah anda memutuskan icon mana yang ingin anda gunakan, klik radio button yang berada di sebelah icon yang anda inginkan
4. Masukkan id Y!M anda pada field yang telah disediakan dan klik submit
5. Secara otomatis, website tersebut akan menyediakan kode yang dapat anda masukkan ke dalam website anda. Karena situs ini menyediakan dua tipe kode yang berbeda, maka anda harus memilih kode yang berada persis di bawah judul "For Web or Blog "
6. Setelah itu, seperti biasa, salin/copy kode tersebut, dan masukkan ke situs anda, untuk para member sitekno khususnya, saya sarankan untuk dimasukkan ke fitur panel saja, agar icon tersebut dapat tampil di setiap halaman situs web anda

Setelah anda masukkan kode tersebut ke dalam situs anda, sekarang anda akan memilki icon Y!M yang baru dan lebih menarik dari sebelumnya (mudah-mudahan), seperti icon Y!M saya ini:

Selamat mencoba ;-)

Keterangan:

Mohon maaf apabila gambar-gambar di artikel ini tidak lagi ditampilkan, dikarenakan tampilan dari situs yang bersangkutan (ymgen ) telah berubah, juga untuk menghindari kemungkinan adanya perubahan tampilan situs tersebut di kemudian hari, maka saya memutuskan untuk tidak lagi memuat capture gambar-gambar dari situs yang bersangkutan.

Google sekarang juga merupakan salah satu situs yang menyediakan fasilitas serupa, keanggotaan, bahkan saat ini, kita dapat memilki akun di beberapa situs yang bisa dikatakan satu grup dengan google hanya dengan memiliki satu akun google, seperti youtube , blogspot , photobucket , dan masih banyak lagi. Sitekno sendiri mensupport seluruh membernya untuk bisa memiliki fasilitas google apps dari google . Fasilitas ini juga yang dapat membuat member-member sitekno dapat memiliki e-mail dengan domainnya sendiri yang sangat sarat akan fasilitas-fasilitas lainnya, seperti google docs yang dapat digunakan untuk menyimpan dokumen-dokumen anda dari Microsoft® Word dan atau juga dari Microsoft® Excel® yang berupa dokumen atau spreadsheet, juga google calendar yang dapat dijadikan alat kolaborasi dengan rekan yang juga memiliki akun google atau yang anda beri akun di akun google apps anda.

Dikarenakan kebiasaan tadi, yang mana member adalah manusia yang biangnya lupa :D, maka pendaftaran pada google apps seringkali menemui kendala di saat para member lupa untuk menyimpan credential yang nantinya akan sangat penting keberadaannya bagi member itu sendiri. Credential di sini yang paling sering terlupakan adalah password dari akun yang telah dibuat, dan lebih parahnya lagi, password dari akun administrator google apps member tersebut. Maka dari itu, mari ikuti langkah-langkah berikut untuk dapat mengembalikan atau menyetel ulang password administrator anda:

1. Masuklah ke halaman control panel dari akun google apps anda dengan mengakses URL berikut: http://www.google.com/a/cpanel/[nama_domain_anda_yang_telah_didaftarkan]
   ganti [nama_domain_anda_yang_telah_didaftarkan] dengan nama domain yang telah anda daftarkan
2. Setelah memasuki halaman control panel google apps anda, klik "I cannot acccess my account "
3. Anda akan dibawa masuk ke dalam halaman baru, di sana klik "Reset your administrator password ", seperti yang dapat anda lihat pada gambar di bawah ini:
   
   
4. Anda akan kembali dibawa ke halaman baru di mana anda akan diminta untuk memasukkan kode captcha yang tertera di atas field isian, seperti dalam image di bawah ini:
   
   
5. Masukkan kode captcha tersebut dan klik tombol "Submit "
6. Anda akan masuk ke halaman baru berisikan konfirmasi bahwa anda telah dikirimkan instruksi bagaimana menyetel ulang password administrator google apps anda ke e-mail secondary anda yang anda gunakan ketika mendaftarkan akun google apps anda seperti yang dapat anda lihat pada gambar di bawah ini:
   
   
7. Cek e-mail anda, di sana seharusnya telah diterima e-mail dari google yang menginstruksikan anda untuk mengakses URL yang disertakan di dalam e-mail tersebut
8. Setelah anda mengakses URL tersebut, masukkanlah password baru yang anda inginkan untuk merubah password lama yang entah apa itu :) pada form yang seperti terlihat pada gambar di bawah ini:
   
   
9. Klik tombol "Save Password ", atau tombol "Cancel Changes " jika anda tiba-tiba teringat dengan password lama anda dan tidak ingin melakukan perubahan password :)
   
10. Akun google apps anda telah dapat diakses kembali dengan password baru yang telah anda masukkan tadi

Setelah anda dapat kembali mengakases akun anda tersebut, maka sangat disarankan agar anda menyimpan baik-baik credential anda tersebut agar tidak lagi harus mengulangi langkah-langkah di atas yang menurut saya cukup merepotkan dan menghabiskan baik itu bandwidth ataupun quota yang dapat anda gunakan untuk hal lain yang lebih penting :).

Selamat mencoba ;-)

Di sini anda dianggap telah memiliki sebuah foto galeri yang dibuat sesuai dengan artikel membuat gallery dengan flickr.

Agar galeri foto anda dapat langsung memunculkan foto / gambar dalam ukuran sebenarnya di situs anda, silakan ikuti langkah-langkah di bawah ini:

1. Masuk ke dalam artikel / custom page / panel yang anda gunakan untuk menampilkan foto galeri anda
2. Klik tombol HTML di editor WYSIWYG anda
3. Masukkan skrip di bawah ini ke dalam editor WYSIWYG anda :
   
   <p>
   <script src="http://sensakilla.com/js/jquery-1.3.2.min.js" type="text/javascript"></script>
   <script src="http://sensakilla.com/js/jquery.fancybox-1.2.6.pack.js" type="text/javascript"></script>
   <style type="text/css"><!--
    
    
   div#fancy_overlay {
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       display: none;
       z-index: 30;
   }
   
   div#fancy_loading {
       position: absolute;
       height: 40px;
       width: 40px;
       cursor: pointer;
       display: none;
       overflow: hidden;
       background: transparent;
       z-index: 100;
   }
   
   div#fancy_loading div {
       position: absolute;
       top: 0;
       left: 0;
       width: 40px;
       height: 480px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_progress.png') no-repeat;
   }
   
   div#fancy_outer {
       position: absolute;
       top: 0;
       left: 0;
       z-index: 90;
       padding: 20px 20px 40px 20px;
       margin: 0;
       background: transparent;
       display: none;
   }
   
   div#fancy_inner {
       position: relative;
       width:100%;
       height:100%;
       background: #FFF;
   }
   
   div#fancy_content {
       margin: 0;
       z-index: 100;
       position: absolute;
   }
   
   div#fancy_div {
       background: #000;
       color: #FFF;
       height: 100%;
       width: 100%;
       z-index: 100;
   }
   
   img#fancy_img {
       position: absolute;
       top: 0;
       left: 0;
       border:0;
       padding: 0;
       margin: 0;
       z-index: 100;
       width: 100%;
       height: 100%;
   }
   
   div#fancy_close {
       position: absolute;
       top: -12px;
       right: -15px;
       height: 30px;
       width: 30px;
       background: url('http://sitekno.com/user/share/themes/39/fancy_closebox.png') top left no-repeat;
       cursor: pointer;
       z-index: 181;
       display: none;
   }
   
   #fancy_frame {
       position: relative;
       width: 100%;
       height: 100%;
       display: none;
   }
   
   #fancy_ajax {
       width: 100%;
       height: 100%;
       overflow: auto;
   }
   
   a#fancy_left, a#fancy_right {
       background:none;
       position: absolute;
       bottom: 0px;
       height: 100%;
       width: 35%;
       cursor: pointer;
       z-index: 111;
       display: none;
       outline: none;
       overflow: hidden;
   }
   
   a#fancy_left {
       left: 0px;
   }
   
   a#fancy_right {
       right: 0px;
   }
   
   span.fancy_ico {
       position: absolute;
       top: 50%;
       margin-top: -15px;
       width: 30px;
       height: 30px;
       z-index: 112;
       cursor: pointer;
       display: block;
   }
   
   span#fancy_left_ico {
       left: -9999px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_left.png') no-repeat;
   }
   
   span#fancy_right_ico {
       right: -9999px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_right.png') no-repeat;
   }
   
   a#fancy_left:hover, a#fancy_right:hover {
       visibility: visible;
       background-color: transparent;
   }
   
   a#fancy_left:hover span {
       left: 20px;
   }
   
   a#fancy_right:hover span {
       right: 20px;
   }
   
   #fancy_bigIframe {
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: transparent;
   }
   
   div#fancy_bg {
       position: absolute;
       top: 0; left: 0;
       width: 100%;
       height: 100%;
       z-index: 70;
       border: 0;
       padding: 0;
       margin: 0;
   }
      
   div.fancy_bg {
       position: absolute;
       display: block;
       z-index: 70;
       border: 0;
       padding: 0;
       margin: 0;
   }
   
   div#fancy_bg_n {
       top: -20px;
       left: 0;
       width: 100%;
       height: 20px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_shadow_n.png') repeat-x;
   }
   
   div#fancy_bg_ne {
       top: -20px;
       right: -20px;
       width: 20px;
       height: 20px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_shadow_ne.png') no-repeat;
   }
   
   div#fancy_bg_e {
       right: -20px;
       height: 100%;
       width: 20px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_shadow_e.png') repeat-y;
   }
   
   div#fancy_bg_se {
       bottom: -20px;
       right: -20px;
       width: 20px;
       height: 20px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_shadow_se.png') no-repeat;
   }
   
   div#fancy_bg_s {
       bottom: -20px;
       left: 0;
       width: 100%;
       height: 20px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_shadow_s.png') repeat-x;
   }
   
   div#fancy_bg_sw {
       bottom: -20px;
       left: -20px;
       width: 20px;
       height: 20px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_shadow_sw.png') no-repeat;
   }
   
   div#fancy_bg_w {
       left: -20px;
       height: 100%;
       width: 20px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_shadow_w.png') repeat-y;
   }
   
   div#fancy_bg_nw {
       top: -20px;
       left: -20px;
       width: 20px;
       height: 20px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_shadow_nw.png') no-repeat;
   }
   
   div#fancy_title {
       position: absolute;
       z-index: 100;
       display: none;
   }
   
   div#fancy_title div {
       color: #FFF;
       font: bold 12px Arial;
       padding-bottom: 3px;
       white-space: nowrap;
   }
   
   div#fancy_title table {
       margin: 0 auto;
   }
   
   div#fancy_title table td {
       padding: 0;
       vertical-align: middle;
   }
   
   td#fancy_title_left {
       height: 32px;
       width: 15px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_title_left.png') repeat-x;
   }
   
   td#fancy_title_main {
       height: 32px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_title_main.png') repeat-x;
   }
   
   td#fancy_title_right {
       height: 32px;
       width: 15px;
       background: transparent url('http://sitekno.com/user/share/themes/39/fancy_title_right.png') repeat-x;
   }
   --></style>
   <script type="text/javascript"><!--
    
   $(function(){
    $(".gambar_flickr a").addClass("fancies");
    $(".gambar_flickr a").attr("rel","group");
    $(".gambar_flickr a img").each(function() {
       var simg    = $(this).attr("src");
       var dimg    = simg.replace("_s", "");
       $(this).parent("a.fancies").attr("href",dimg);
       $(this).parent("a.fancies").attr("title",$(this).attr("title"));
    });
    $(".gambar_flickr a.fancies").fancybox();
   });
   // --></script>
   </p>
   
   Tepat di bawah skrip yang anda gunakan untuk membuat foto galeri anda
4. Klik tombol "Update"
5. Klik Tombol "Send" / "Kirim"
6. Refresh / Reload halaman foto galeri di situs web anda
7. Coba klik salah satu foto / gambar anda. Anda akan melihat bahwa foto / gambar yang anda klik tadi akan memunculkan gambar loader dan setelah beberapa saat akan memunculkan foto / gambar anda dalam ukuran yang sebenarnya

Sekian langkah-langkah untuk membuat foto galeri anda memiliki fungsi yang lebih menarik dan juga tidak langsung berpindah ke flickr ketika ada pengunjung yang mengklik salah satu foto / gambar anda, sehingga pengunjung dapat tetap berada di situs web anda sembari melihat foto / gambar anda dalam ukuran yang sebenarnya.

Sebagai contoh, anda dapat mecoba mengklik salah satu foto / gambar di bawah ini:

Selamat mencoba ;-).

keterangan:

1. Tutorial ini dapat digunakan di seluruh website dengan atau tanpa engine sitekno
2. Tutorial ini menggunakan javascript framework jquery sebagai library javascript
3. Tutorial ini menggunakan plugin jquery fancybox untuk menambahkan fungsi

Untuk anda yang terbiasa dengan mengetikkan artikel anda terlebih dahulu di salah satu perangkat lunak pengolah kata seperti Micorosoft® Word®, hentikan kebiasaan baik ini :). Micorosoft® Word® memuat banyak sekali carrier tidak penting yang dapat membuat tampilan situs web anda kurang sedap dipandang, maka dari itu, saya sarankan agar anda lebih baik mengetikkan artikel anda di sebuah WYSIWYG(What You See Is What You Get ) editor online yang memiliki konstruksi mirip dengan WYSIWYG editor yang digunakan oleh engine sitekno.

Berikut langkah-langkah yang bisa anda ikuti untuk dapat menyunting artikel anda dengan WYSIWYG editor online :

1. Akses URL berikut:
   http://tinymce.moxiecode.com/examples/full.php
2. Setelah anda masuk ke situs web dengan URL di atas, maka anda akan menemukan tampilan seperti ini:
   
3. Anda dapat menggunakan WYSIWYG editor tersebut untuk menyunting artikel anda, dan silahkan menyunting selama yang anda inginkan :D
4. Setelah seluruh artikel dirasa lengkap, anda dapat menyalin artikel yang telah selesai anda sunting tersebut dengan menekan tombol "Ctrl " dan tombol "A " di keyboard anda secara bersamaan untuk menyalin keseluruhan artikel
5. Kemudian kembali ke halaman admin dari situs web anda, lakukan langkah-langkah yang biasa anda lakukan untuk membuat artikel, dan tempel artikel yang telah disalin tersebut ke dalam WYSIWYG editor situs web anda dengan menekan tombol "Ctrl "dan tombol "V " pada keyboard anda secara bersamaan
6. Setelah artikel anda telah tertera di WYSIWYG editor anda, lanjutkan dengan mengisi keseluruhan field form yang harus diisi, dan klik tombol "Send " / "Kirim "

Dengan langkah-langkah di atas, diharapkan anda tidak lagi kehilangan artikel yang telah anda sunting. Fungsi redirecting yang digunakan engine sitekno adalah sebuah fungsi untuk menghindari suntingan-suntingan yang tidak dikehendaki yang terjadi ketika anda terlalu lama berada di halaman admin dan tidak melakukan kegiatan apapun (idle ).

Selamat mencoba ;-)

1. Akses akun google anda dengan mengakses link : http://www.google.com/a/cpanel/[nama_domain_anda]
   ganti "[nama_domain_anda] " dengan nama domain yang telah anda daftarkan
2. Kemudian masukkan username dan password anda
3. Setelah berada di dalam akun anda, masukkan URL berikut: https://www.google.com/a/cpanel/[nama_domain_anda]/VerifyDomainOwnership?firsttime=std pada address bar peramban / browser anda
   ganti "[nama_domain_anda] " dengan nama domain yang telah anda daftarkan
4. Kemudian pilih "upload an HTML file to [nama_domain_anda] "
5. Kemudian klik tombol "Continue "
6. Untuk langkah-langkah yang lebih lengkap mengenai pembuatan akun e-mail dengan nama domain anda lihat kembali artikel tentang membuat akun e-mail dengan nama domain anda di sitekno911.com
7. Setelah anda mendapatkan verification code anda, masukkan kode tersebut di field "Kode Verifikasi Google Hosted Service" pada menu "option" admin situs web anda
8. Klik tombol "Kirim " / "Send "

Setelah langkah-langkah di atas dilakukan, silahkan cek kembali URL "http://mail.nama_domain_anda " untuk masuk ke akun e-mail anda, sebelumnya ganti "nama_domain_anda " dengan nama domain yang telah anda daftarkan. Selamat mencoba ;-)

Tutorial ini didedikasikan kepada semua member untuk mengenal lebih dulu HTML sebelum melangkah ke pengenalan CSS. Mungkin agar pembahasan tidak terlalu melebar lebih jauh lagi, mungkin lebih baik untuk langsung membahas saja cara implementasi HTML. Berikut adalah contoh dari sebuah script HTML sederhana :

<html>
                <head>
                <title>HTML sederhana</title>
                </head>
               
                <body>
                                Mencoba untuk membuat HTML sederhana
                </body>
</html>

Seperti yang dapat dilihat di atas, bahwa HTML memiliki sebuah struktur, yaitu :

1. Tag <html> yang harus ditutup dengan tag </html> . Tag ini harus dideklarasikan, dalam kata yang lebih sederhana, harus ada di dalam setiap file yang berekstensi .htm atau .html, agar web browser (seperti Internet Explorer, Mozilla Firefox, Opera, Safari dan lain-lain dapat mengenali file tersebut sebagai sebuah file HTML dan dapat menterjemahkannya dengan benar).
2. Tag <head> yang harus ditutup dengan tag </head> . Tag ini juga harus dideklarasikan, karena di dalam tag ini akan terdapat tag-tag lain untuk mendeskripsikan informasi-informasi yang dibutuhkan sebuah halaman HTML.
3. Tag <title> yang harus ditutup dengan tag </title> . Tag ini dapat dideklarasikan atau tidak, di dalam tag ini kita dapat memasukkan judul dari halaman HTML kita. Judul dari halaman HTML kita biasanya dapat anda lihat di bagian paling kiri atas dari web browser yang digunakan.
4. Tag <body> yang harus ditutup dengan tag </body> . Tag inilah yang akan memuat semua isi situs web yang dapat dilihat oleh semua orang yang mengakses situs web tersebut.

Untuk lebih jelasnya lagi, sangat disarankan agar anda mencoba untuk menyalin script di atas ke text editor seperti notepad, dan save sebagai index.htm atau index.html.

Di dalam tag <head></head> sebenarnya masih banyak tag-tag lain yang dapat disimpan, tapi di sini hanya diulas sampai ke tag <title></title> saja, agar memudahkan anda untuk mengenal sedikit tentang HTML dan dapat melanjutkan ke tutorial mengenai CSS.

Berikut adalah langkah-langkah bagi anda yang menginginkan adanya form login DBS di web sitekno anda:

1. Login ke halaman admin dari situs anda
2. Klik Link panel di sebelah kanan layar anda
3. Kemudian isi form-form yang telah disediakan sesua dengan keinginan anda
4. Ketika anda masuk ke dalam form deskripsi, klik tombol yang bertuliskan "HTML " pada form deskripsi.
5. Masukkan kode di bawah ini ke dalam pop up window yang muncul:
   
   <form action="http://duta4future.co.id/member/login.php" method="post">
   <table style="border: medium none; width: 100%;" border="0" cellpadding="0"><tbody>
   <tr>
   <td><strong>user id</strong> :<br /> <input style="width: 100%;" maxlength="15" name="userid" size="24" /></td>
   </tr>
   <tr>
   <td><strong>password</strong> :<br /> <input style="width: 100%;" maxlength="15" name="passwd" size="24" type="password" /></td>
   </tr>
   <tr>
   <td><strong>kode rahasia</strong> :<br /> <img src="http://duta4future.co.id/komacode.php?id=9a942ef290c75d23b27ff013e1b3dd4e" alt="" width="160" height="60" /> <br /> <input style="width: 100%;" name="komacode" size="10" /></td>
   </tr>
   <tr>
   <td align="right"><input src="http://duta4future.co.id/images/btn_login01.gif" type="image" /></td>
   </tr>
   <tr>
   <td align="left"><span>&bull;</span> <a href="http://duta4future.co.id/password.php">lupa password</a> <br /> <span>&bull;</span> <a href="http://duta4future.co.id/terms.php">daftar sekarang</a></td>
   </tr>
   </tbody>
   </table>
   </form>
   
6. Klik Update
7. Isi kembali form-form yang masih kosong, dan jangan lupa untuk mempublikasikan panel anda
8. Klik Kirim
9. View Website anda
10. Anda telah memiliki Form Login ke website DBS sebagai bagian dari panel anda

Adapun beberapa keunggulan yang dapat dinikmati dari produk sitekno ini dibandingkan dengan produk-produk website lainnya adalah (perlu dicatat, saya di sini mengemukakan keunggulan sitekno dalam hal teknis, bukan dalam hal bisnis) :

1. Mudah dalam pembuatan , jika dibandingkan dengan produk website lain, yang mungkin juga dapat dikategorikan sebagai webmatic, apabila dilihat dari cara instalasi dan penggunaan (dalam hal ini ialah: install, set up, gunakan), maka sitekno memiliki keunggulan dalam hal instalasi dan set up, di mana para pengguna sitekno dapat mengabaikan dua hal ini, dikarenakan instalasi dan set up sitekno sudah dilakukan oleh sistem, dan atau sponsor, dan atau Customer Service yang dapat dengan mudah dimintai bantuannya, sehingga semua member sitekno hanya tinggal memasuki tahapan menggunakan, tanpa harus dibebani di tahap-tahap instalasi dan set up website.
2. Murah dalam hal pembiayaan , memang banyak terdapat produk gratis yang tersebar sekian banyak di seluruh alam maya ini. Banyak pula yang sudah terkenal, dan bahkan gratis, tapi tidak ada yang menyediakan domain pilihan sendiri (perlu ditekankan, yang saya singgung di sini adalah domain[www.namaanda.com/www.namaanda.net/dll], bukan subdomain[namaanda.namadomain.com/namaanda.namadomain.net/dll]) dan atau hosting dan juga hak usaha dengan harga yang cukup terjangkau untuk anda yang ingin memulai bisnis dengan tanpa harus banyak merogoh kocek anda.
3. Mudah dalam pengoperasian , dengan menggunakan engine sitekno, anda diberi kemudahan dalam navigasi pada saat anda akan mengatur isi dari website anda, dikarenakan produk sitekno telah dibuat dalam sebuah bentuk baku yang telah disederhanakan, sehingga untuk anda yang mungkin seorang awam di dunia website, akan dengan mudah mengerti apa yang anda lakukan untuk dapat mempercantik website anda, dan atau menampilkan semua isi pikiran anda ke dalam media website ini. Jika mungkin pernyataan saya tentang poin ini kurang dapat dipercaya, saya berani mengajak anda untuk melihat beberapa engine lain non sitekno yang dapat dengan mudah didapat gratis di dunia maya ini.
4. Ringan dalam segi pengaksesan , dikarenakan engine sitekno ini masih berdiam di salah satu server IIX (Indonesia Internet Exchange) yang dengan kata lain, server masih berada di negara tercinta kita, Indonesia, maka dengan mudah dan cepat akses ke engine-engine sitekno yang digunakan oleh para member sitekno dapat tercapai. Juga sistem engine sitekno yang menurut saya pribadi telah mengalami penyederhanaan-penyederhanaan di berbagai sisi, sehingga tidak terlalu lama dalam pengaksesan fungsi-fungsi yang digunakan (maaf apabila pembicaraan di sini jadi menjurus ke arah yang lebih teknis).

Sampai saat ini baru 4(empat) poin di atas yang dapat saya kemukakan tentang engine sitekno ini, karena dalam beberapa bulan ini saya berada di dapur sitekno, khususnya dapur theme sitekno, saya baru dapat menyimpulkan beberapa poin di atas saja, sehingga apabila masih terdapat banyak kekurangan-kekurangan dari apa yang telah saya kemukakan, mohon banyak maklum dari pembaca. Semoga bermanfaat untuk para member sitekno yang baru sedang akan menjajal sitekno dan juga untuk member-member lain yang ingin memasarkan sitekno lebih luas lagi dalam jaringannya ;-) .

Dan untuk anda sekalian, para member sitekno, yang ingin menampilkan gambar2 yang anda miliki sebagai galeri di sitekno, maka dianjurkan untuk memiliki akun flickr terlebih dahulu. Langkah-langkah yang perlu anda lakukan untuk memiliki akun flickr juga tidak terlalu sulit, anda hanya cukup melakukan langkah-langkah sebagai berikut:

1. Kunjungi situs flickr
2. Lalu klik tombol Create your account (untuk anda yang telah memilki e-mail yahoo! , maka proses kepemilikan akun flickr akan lebih mudah)
3. Pada halaman berikutnya, anda cukup memasukkan e-mail yahoo! anda serta password di form yang telah disediakan. Lalu klik tombol Sign In
4. Selamat, anda telah memiliki akun flickr . Untuk anda yang belum memiliki akun e-mail yahoo! maka di poin 3, anda perlu untuk mengklik tautan(link ) Sign Up untuk kemudian mendaftar akun yahoo! baru yang mana langkah-langkahnya tidak akan saya paparkan di sini.

Langkah-langkah berikutnya yang perlu anda lakukan setelah anda masuk ke dalam halaman utama anda di flickr adalah sebagai berikut:

1. Klik opsi Upload your first photos (untuk anda yang baru pertama kalu menggunakan flickr )
2. Anda akan dibawa ke halaman upload photo
3. Kemudian klik tautan(link ) choose photo and videos
4. pilih gambar mana saja yang akan anda unggah(upload )
5. klik tombol Open
6. kemudian setel(setting ) apakah gambar-gambar yang anda unggah(upload ) akan ditampilkan untuk umum(public ) atau hanya untuk pribadi(private ) saja. Dalam penyetelan ini, apabila anda ingin gambar-gambar anda dapat dilihat di situs anda, sangat disarankan untuk memilih setelan umum(public ).
7. Klik tombol Upload Photos and Videos
8. Tunggu sampai muncul konfirmasi kalau gambar-gambar tersebut telah berhasil diunggah(diupload )
9. Setelah muncul pesan: "Finished! Next: add a description , perhaps?" , langkah selanjutnya yang perlu anda lakukan dapat disesuaikan dengan kebutuhan anda, apakah anda ingin menambahkan deskripsi pada masing-gambar yang telah anda unggah di langkah-langkah sebelumnya atau tidak.
10. Masuk ke halaman pembuatan badge flickr (http://www.flickr.com/badge_new.gne )
11. Pilih jenis badge yang akan anda gunakan (HTML atau Flash). Di sini saya menyarankan anda untuk memilih badge berbentuk HTML, karena selain lebih mudah untuk diakses, bentuk HTML lebih ringan untuk diakses
12. Pilih gambar-gambar mana saja yang akan anda tampilkan, apabila bingung, anda cukup memilih opsi All of your public photos and video , sehingga galeri akan menampilkan seluruh gambar yang telah anda unggah dan disetel public . Klik tombol next:Layout
13. Pilih layout yang paling cocok menurut anda dan pilih opsi-opsi yang tersedia sesuai dengan kebutuhan dan selera anda, kemudian klik next:Colors
14. Pilih warna yang sesuai dengan keinginan anda, kemudian klik next:Preview & Get Code
15. Anda akan sampai di halaman yang menampilkan contoh tampilan badge flickr anda
16. Salin semua kode yang berada di bawah teks:
    

    This is the code you need:

    All you need to do is copy and paste this chunk of code into your website where you'd like your badge to appear.

17. Kemudian masuk ke halaman admin dari website sitekno anda
18. Buat artikel baru , atau custom page baru , atau juga boleh panel baru di halaman admin anda, sesuai dengan kebutuhan anda.
    Untuk anda yang masih baru dengan engine sitekno ini, perbedaan dari masing-masing opsi tersebut hanya terletak pada tempat menampilkannya saja, untuk artikel, biasanya semua artikel didaftar dan ditampilkan di halaman home atau juga dapat diakses setelah anda mengklik tautan(link ) kategori yang tersedia pada panel kategori, sedangkan untuk custom page, Judul dari custom page tersebut ditampilan sebagai menu utama dari website anda, sehingga akses ke custom page akan lebih mudah dibandingkan dengan akses ke artikel, sedangkan untuk panel, panel akan ditampilkan di setiap halaman dari website, baik itu ketika anda mengakses halaman home, custom page, atau artikel sekalipun, akan tetapi, kekurangan dari panel adalah, ukurannya yang cukup kecil jika dibandingkan dengan artikel dan custom page, sehingga apabila anda akan menampilkan badge flickr anda sebagai panel, saya sarankan anda memilih ukuran yang kecil untuk badge flicker anda terkecuali apabila anda ingin jika badge anda tampil tidak karuan di sini :D ^^V
19. Klik tombol HTML pada bagian Deskripsi
20. Setelah keluar window HTML, tempel kode yang sudah anda salin sebelumnya ke dalam window tersebut dan klik tombol Update
21. Setel Publikasi ke Ya , kemudian klik tombol Send
22. Klik menu View Web di menu utama halaman admin, pada window baru, anda sudah dapat melihat badge anda terpampang di sana.

Ada cara kedua yang lebih sederhana dari langkah-langkah di atas, dan juga cara ini yang paling disarankan bagi anda member sitekno. Syaratnya masih sama dengan cara di atas. yaitu anda harus memiliki akun flickr terlebih dahulu. Adapun langkah-langkahnya adalah sebagai berikut:

1. Buat artikel baru , atau custom page baru , atau juga boleh panel baru di halaman admin anda, sesuai dengan kebutuhan anda.
   Untuk anda yang masih baru dengan engine sitekno ini, perbedaan dari masing-masing opsi tersebut hanya terletak pada tempat menampilkannya saja, untuk artikel, biasanya semua artikel didaftar dan ditampilkan di halaman home, sedangkan untuk custom page, Judul dari custom page tersebut ditampilan sebagai menu utama dari website anda, sehingga akses ke custom page akan lebih mudah dibandingkan dengan akses ke artikel, sedangkan untuk panel, panel akan ditampilkan di setiap halaman dari website saja baik itu ketika anda mengakses halaman home, custom page, atau artikel sekalipun, akan tetapi, kekurangan dari panel adalah, ukurannya yang cukup kecil jika dibandingkan dengan artikel dan custom page, sehingga apabila anda akan menampilkan badge flickr anda sebagai panel, saya sarankan anda memilih ukuran yang kecil untuk badge flicker anda terkecuali apabila anda ingin jika badge anda tampil tidak karuan di sini :D ^^V
2. Klik tombol HTML pada bagian Deskripsi
3. Setelah keluar window HTML, Masukkan script di bawah ini:
   
   <p>
   <style type="text/css"><!--
   .gambar_flickr {text-align:center; width:545px; background:#fff; margin-left: 5px;}
   .gambar_flickr img {border: 2px solid #eee !important; float: left; margin: 2px; padding: 2px;}
   .gambar_flickr img:hover {border: 2px solid #999 !important; float: left; margin:2px; padding: 2px;}
   #flickr_badge_source {display: none;}
   #flickr_badge_icon {display: none;}
   #flickr_www {display: none;}
   --></style>
   </p>
   <p>&nbsp;</p>
   <div class="gambar_flickr">
   <script src="http://www.flickr.com/badge_code_v2.gne?show_name=1&count=30&display=random&size=s&layout=v&source=user&user=[id_user_flickr_anda] " type="text/javascript"></script>
   </div>
   
   [id_user_flickr_anda] anda ganti dengan id anda, untuk mencari id user flickr anda, silahkan anda akses situs idGetter
4. Setel Publikasi ke Ya , kemudian klik tombol Send
5. Klik menu View Web di menu utama halaman admin, pada window baru, anda sudah dapat melihat badge anda terpampang di sana.

Selamat Mencoba ;-)