Langkah-langkah mengupload website lokomedia di idhostinger

Pada artikel kali ini akan di bahas mengenai bagaimana cara mengupload website ke hosting atau dengan kata lain bagaimana cara website kita bisa online sehingga bisa di akses oleh orang lain. Untuk mengupload website seperti biasa kita harus memiliki sebuah domain yaitu nama atau alamat website yang akan di akses oleh pengunjung website kita nantinya. baca artikel cara membuat domain gratis di idhostinger. Ada beberapa tipe domain yang di sediakan oleh penyedia jasa hosting website baik itu yang berbayar maupun yang free atau yang sifatnya gratis diantaranya ada yang menggunakan .com, .org, .gov, .net, dan lain-lain sebagainya. Untuk memilih tipe domain website kita tentunya di sesuaikan dengan sifat website yang kita miliki. Jika website kita sifatnya komersil maka umumnya menggunakan .com, ada juga yang menggunakan subdomain seperti yang penulis gunakan pada contoh kali ini yang akan kita bahas pada artikel ini.

Pada artikel ini akan di bahas tentang bagaimana cara mengupload website di www.idhostinger.com. kelebihan jasa penyedia layanan hosting ini adanya penyedian subdomain yang sifatnya free sehingga kita bisa jadikan sebagai bahan pembelajaran untuk mengupload website yang kita buat. Nah, pada artikel ini yang akan di jadikan bahan praktek yaitu website yang menggunakan CMS lokomedia. Mungkin anda bertanya CMS lokomedia itu seperti apa ? CMS ini banyak di gunakan untuk website penjualan, ada juga yang di gunakan untuk website portal berita. Bisa juga anda lihat info selengkapnya di situsnya di www.bukulokomedia.com Agar tidak terlalu panjang lebar langsung saja kita masuk pada inti permasalah yaitu mengupload website CMS lokomedia. Simak langkah-langkahnya berikut ini :

Langkah pertama anda tentunya sudah memiliki file website yang siap untuk di upload dan pastikan database website anda sudah di backup. Baca artikel cara membackup database.

Langkah kedua anda harus memiliki software filezilla client yang akan di gunakan untuk mengupload website kita nantinya. Jika anda belum memiliki aplikasi tersebut silahkan download dulu aplikasinya di sini. Setelah anda download lanjutkan dengan menginstal aplikasi tersebut.

Langkah ketiga anda akses akun anda yang sudah anda buat di idhostinger. Dan pastikan anda sudah membuat domain atau subdomain. Jika anda sudah membuatnya, langkah selanjutnya anda buka domain anda dengan cara mengklik nama domain atau subdomain tersebut.

Langkah keempat anda cari menu yang ada di control panel yaitu menu DataBase MySql, terlebih dahulu anda harus mengupload database yang anda sudah backup. Sebelum anda mengimpornya anda harus membuat dulu nama databasenya dengan cara mengklik menu DataBase MySql.

Langkah kelima anda buat nama databasenya, isi pada form yang sudah di sediakan dengan nama databasenya dan usernamenya, lalu klik tombol buat. Jika sudah berhasil maka akan muncul di bagian bawah nama database yang anda sudah buat. Selanjutnya anda klik tanda icon tambah yang ada di samping nama database tersebut sehingga muncul beberapa menu.

Pada menu tersebut anda klik pada menu PhpMyadmin sehingga terbuka tab baru yang menampilkan menu PhpMyadmin. Selanjutnya anda klik menu Import lalu klik tombol Choose File untuk mencari file database website anda, jika anda sudah dapat langsung klik open lalu klik tombol Go pada bagian bawah untuk melakukan proses import database website anda.

Langkah keenam anda kembali pada menu kontrol panel lalu anda klik pada menu Akses FTP sehingga di tampilkan FTP IP, username dan password FTPnya seperti pada gambar di bawah ini.

Selanjutnya anda buka aplikasi FileZila dan masukkan pada kotak FTP host anda dengan nama FTP IP, pada username anda masukkan username yang ada di username FTP, pasword anda isi sesuai password FTP, dan port isikan port yang ada di port FTP. Jika sudah selesai semuanya di isi maka klik tombol Quickconnect.

Langkah ketujuh anda cari file websitenya, pada artikel ini penulis memberikan contoh yang masih tersimpan di drive C tepatnya di dalam folder xampp maka akses folder website anda yang ada di dalam folder htdocs dan klik lagi nama folder website sehingga terbuka semua folder dan file yang ada di dalamnya, selanjutnya anda blok semua folder dan file tersebut dan drag ke kotak sebelah kanan atau di dalam folder public_html. Jika sudah selesai maka tunggu proses sampai selesai di upload. 

Langkah kedelapan setelah proses upload sudah selesai maka masih ada langkah selanjutnya yang harus anda lakukan yaitu sesuaikan nama database, username, dan password database. untuk itu masuk pada menu control panel dan klik pada menu File Manajer 1. Jika belum di Install maka klik tombol Install. 

Langkah kesembilan anda cari folder config dan klik folder tersebut lalu didalam folder tersebut anda cari file koneksi.php. Klik kanan pada file tersebut lalu pilih menu edit file.

Pada kotak teks yang ditampilkan pada gambar di atas anda isi nama server seperti pada contoh pada gambar tersebut, username, password dan database anda isi sesuai dengan username, password dan nama database yang anda sudah buat. Jika sudah selesai semua di isi dengan benar maka klik tombol Save.

Selanjutnya anda akses domain atau alamat website anda untuk melihat hasilnya. Sebagai contoh yang penulis berhasil upload lihat di situs ini http://www.aris-shop.hol.es.

Semoga artikel ini bermanfaat buat anda sehingga dapat anda praktekkan dan  sukses, jika masih kurang di pahami, silahkan anda berikan komentar di kolom komentar di bawah ini.

Cara backup database website ofline sebelum di upload

Database merupakan sekumpulan tabel yang saling berhubungan antara satu dengan yang lainnya yang tersimpan dalam sebuah komputer yang di gunakan perangkat lunak khusus untuk mengaksesnya seperti Microsoft acsess dan lain-lain. Database tidak lain merupakan isi atau data – data sebuah aplikasi baik yang berbasis desktop maupun yang berbasis website yang di akses secara online.

Pada artikel ini, penulis akan berbagi pengetahuan tentang bagaimana cara membackup sebuah database website yang tersimpan di phpmyadmin. Seperti biasa sebelum kita mengupload sebuah file website tentunya kita harus backup database sebelum di upload di hosting online. Nah, untuk lebih jelasnya akan penulis uraikan langkah-langkahnya sebagai berikut ini :

Langkah pertama yang harus anda lakukan untuk melihat database anda yaitu dengan membuka browser anda entah itu aplikasi Mozilla, google chrome dan lain-lain. Kalau sudah terbuka aplikasinya maka anda ketikkan di search namenya atau biasa di sebut kotak alamat pencarian yaitu localhost/phpmyadmin lalu tekan enter.

Langkah kedua anda pilih nama database anda  yang akan di backup. Setelah anda klik maka akan di tampilkan tabel-tabel yang ada di dalam database tersebut.

Langkah ketiga ketika anda sudah memilih database yang akan di backup maka selanjutnya anda klik tombol Export. Selanjutnya akan di tampilkan beberapa type penyimpanan databasenya maka anda pilih SQL lalu tekan tombol GO yang ada di pojok kanan bawah.

Setelah anda klik tombol GO maka terjadilah proses export database dan biasanya akan di simpan di folder downloads maka anda cek pada folder downloads yang ada di komputer anda.

Itulah sedikit pengetahuan yang dapat penulis tuangkan dalam artikel ini tentang bagaimana cara membackup database website yang masih ofline, semoga artikel ini bermanfaat buat anda dan semoga berhasil juga di praktekkan.

Cara mendapatkan driver komponen laptop yang belum terinstall

Salah satu permasalahan yang paling sering di hadapi ketika selesai menginstal sebuah laptop yaitu ada sebuah komponen atau driver komponennya belum terpasang atau terinstal meskipun kita sudah menginstal Driver bawahannya ataupun menggunakan aplikasi lain seperti Driver Pack Solution. Akan tetapi, permasalahan tersebut masih belum bisa teratasi dengan kata lain masih belum bisa terbaca dan tidak bisa berfungsi.

Berkaitan dengan permasalahan yang di jelaskan di atas penulis browsing di internet dan sharing juga sama teman ternyata ada cara lain yang bisa mengatasi permasalahan tersebut dengan mendownload driver di salah satu situs yang dapat mengatasinya. Tanpa panjang lebar penulis pun langsung mempraktekannya dengan langkah-langkah sebagai berikut.

Langkah pertama yang di lakukan adalah masuk di Mycomputer atau Windows Explorer lalu klik kanan pada menu Computer dan pilih Properties sehingga muncul beberapa menu. Cara lain anda bisa masuk di Control Panel >> System and Security >> System. Pada menu tersebut anda pilih Device Manager sampai muncul kotak dialog Device Manager.

Langkah kedua anda cari keterangan driver komponen laptop anda yang belum terinstal dan biasanya di tandai dengan tanda seruh (!)berwarna kuning.

Langkah ketiga Setelah anda dapatkan maka klik kanan pada keterangan yang di tandai dengan tanda seru (!) tersebut lalu pilih properties sehingga muncul sebuah kotak dialog dan anda pilih tab Details. Untuk lebih jelasnya anda perhatikan gambar di bawah ini.

Langkah ke empat anda copy nilai yang ada pada property yang ada di bawah keterangan Value. Jika, ada lebih dari satu maka anda pilih yang paling atas.

Langkah ke lima anda kunjungi situs devid.info dan paste kode yang anda copy dari nilai property di kotak Masukkan Device Id dan clik tombol Search. Jika berhasil maka akan di tampilkan beberapa driver yang berkaitan dengan kode driver laptop anda yang belum terpasang. Selanjutnya anda pilih dan download salah satu driver tersebut dan install di laptop anda. 

Itulah yang sempat penulis sharing kepada anda. Semoga artikel ini bermanfaat buat anda dan dapat mengatasi permasalahan yang sama penuli alami.

Membuat label undangan menggunakan Mail Merge

Pada kesempatan ini penulis akan berbagi tutorial tentang cara membuat Label Undangan menggunakan mail merge. Permasalahan ini muncul ketika ada seseorang yang minta bantuan untuk di buatkan label undangan pernikahannya pada saat itu penulis hanya membuat secara manual dengan menggunakan table dan di ketik secara manual. Setelah penulis browsing di internet ternyata ada yang lebih mudah dan lebih praktis untuk membuat sebuah label undangan tanpa di buat secara manual dengan menggunakan mail merge. Untuk lebih jelasnya anda simak langkah-langkah berikut ini.

Langkah pertama yang harus anda lakukan adalah buka jendela Microsoft office excel anda lalu buatlah table dengan field beserta recordnya. Seperti biasa ketika membuat sebuah label undangan maka yang di butuhkan adalah Nama dan Alamat serta kata Di. Untuk lebih jelasnya perhatikan contoh table di bawah ini dan anda bisa mengganti isinya sesuai yang anda butuhkan. Setelah anda buat tabelnya langkah selanjutnya anda simpan dengan nama file misalkan Undangan kemudian simpan di dalam folder yang mudah anda dapatkan.

Langkah kedua buka jendela Microsoft office word anda lalu langsung masuk pada menu Mailings. Setelah anda sudah klik menu Mailings selanjutnya anda klik lagi Start Mail Merge lalu pilih Labels… sehingga muncul kotak dialog Labels Options lalu pada Label Vendors anda pilih Other/Custom. Selanjutnya anda klik tombol New Label dan atur ukuran label yang anda inginkan. Sebagai contoh anda bisa samakan dengan contoh pada gambar di bawah ini, setelah di atur sesuai gambar tersebut selanjutnya anda klik Ok dan Ok.

Langkah ketiga anda klik tanda panah kecil pada ujung kiri atas pada kolom table dan klik kanan pada kolom table sehingga muncul menu Popup. Selanjutnya pada Cell Aligment anda pilih Align Center Left, untuk lebih jelasnya perhatikan gambar di bawah ini :

Langkah Ke empat anda masuk di menu mailings lalu klik pada Select Recipients sehingga muncul menu dropdown dan anda pilih menu Use Existing List… selanjutnya anda cari nama file yang sudah anda ketik di excel yang berisi Nama dan Alamat, jika anda sudah dapat klik file tersebut dan klik open. Selanjutnya akan muncul kotak dialog Select table yang berisi Sheet1,Sheet2, dan Sheet3 maka yang anda harus klik atau yang anda pilih adalah Sheet1 karena daftar nama di ketik pada Sheet1 lalu klik tombol Ok.

Langkah Ke lima untuk menampilkan data atau daftar nama beserta alamat yang anda ketik di excel maka selanjutnya anda arahkan kursor di dalam kolom label yang di mulai dari nama. Setelah anda tempatkan kursornya anda klik pada menu Insert Merge Field lalu pilih Field Nama. Selanjutnya anda arahkan lagi kursor di bagian untuk menempatkan kata Di lalu pada Insert Merge Field anda pilih Sambung, dan terakhir anda arahkan kursor anda pada bagian untuk menempatkan Alamat lalu klik lagi pada menu Insert Merge Field dan anda pilih field Alamat. Untuk kolom selanjutnya ikuti langkah untuk kolom pertama yang berbeda hanyalah urutan record jika nama pertama adalah record pertama maka selanjutnya adalah record kedua sampai seterusnya dengan catatan kata <<Next Record>> tidak di hapus.

Langkah ke enam setelah anda memasukkan field pada masing-masing kolom label maka selanjutnya untuk melilhat hasilnya anda klik Preview Results maka semua data dari record pertama sampai jumlah record yang anda masukkan pada kolom label akan di tampilkan.

Langkah ke Tujuah untuk mencetak semua data tersebut dari record atau jumlah nama-nama yang anda ketik di dalam file excel maka anda klik menu Finish & Merge sehingga muncul menu dropdown selanjutnya anda klik Print Documents… sehingga muncul kotak Merge to Printer. Catatan jika anda inginkan semua daftar nama di cetak secara keseluruhan anda pilih Option All, jika hanya satu record saja anda klik Current Record dan jika yang akan di cetak hanya sebagian saja misalkan hanya data 1 sampai 12 maka anda pilih yang option ketiga, pada text from anda masukkan angka 1 dan text To anda masukkan angka 12 lalu klik Ok maka akan tampil kotak dialog print. Selanjutnya anda langsung klik tombol OK tanpa melakukan perubahan apapun.

About Me

Nama Lengkap  : Aris Susanto

Tempat Lahir     : Codong

Tanggal Lahir    : 30 Juli 1992

Nama lengkap saya Aris susanto, biasa di panggil dengan Aris atau Haris. Saya adalah orang yang berasal dari desa dan keluarga sederhana yang sebelumnya tidak paham bahkan tidak tahu sama sekali tentang computer. Asal asli saya yaitu berasal dari Soppeng yang berada di Provinsi Sulawesi Selatan.

Saya mengenal computer pada tahun 2009. Pada waktu itu saya akan berangkat Praktek Kerja Lapangan  (PKL) pada suatu instansi yang berada di kabupaten Konsel tepatnya di kabupaten di wilayah tempat tinggal saya sendiri. Pada saat itu saya bingung nantinya ketika saya berada di lapangan tidak bias mengerjakan apa-apa di karenakan tidak tau sama sekali tentang computer. Nah, pada saat itu kedua orang tua saya yang pekerjaannya hanyalah Petani bersiap untuk membelikan sebuah computer supaya saya bisa tau tentang computer. Pada saat itulah saya mulai mengenal yang namanya computer sehingga muncul inisiatif bahwa untuk lanjut di perguruan tinggi akan mengambil jurusan yang berkaitan tentang computer.

Pada tahun 2010 saya lulus di salah satu Sekolah Menengah Kejuruan yang berada di kampung sendiri yang bukan jurusan computer. Setelah lulus saya berinisiatif mendaptar di salah satu Perguruan Tinggi Swasta (PTS) yaitu STMIK Dipanegara Makassar dengan mengambil Jurusan Sistem Informasi dan pada saat itu saya masih belum terlalu paham tentang computer.

Pada tahun 2011 saya Integrasi dari STMIK Dipanegara Makassar ke STMIK Bina Bangsa Kendari untuk menyelesaikan study saya dengan jurusan yang sama yaitu jurusan Sistem Informasi. Pada saat itulah saya juga sudah mulai mengikuti salah satu study club di perguruan tinggi tersebut yaitu Study Club Information Technology Computer Community (INTELCOM) dengan maksud untuk menambah wawasan sekaligus untuk mengetahui bagaimana cara berorganisasi. Setelah beberapa bulan saya menjadi anggota saya di angkat menjadi ketua organisasi dan pada saat itulah banyak hal yang saya dapatkan dan sangat bermanfaat bagi saya dan orang lain.

Pada tahun 2012 saya juga pernah menjadi anggota Kader Penyuluhan Anti Narkoba Sulawesi Tenggara Perwakilan dari Kampus STMIK Bina Bangsa Kendari. Pada saat itu saya juga mendapatkan pengalaman yang berharga karena bisa menjadi salah satu yang terpilih dan tugas saya adalah setiap penerimaan mahasiswa baru saya beserta anggota yang lain memberikan materi atau mensosialisasikan tentang bahaya penyalahgunaan Narkoba khususnya lingkup kampus dan pada umumnya di lingkungan masyarakat.

Pada dasarnya saya membuat blog ini adalah untuk menyalurkan pengetahuan yang saya miliki sekaligus untuk menjalin hubungan yang baik kepada para pengunjung dan sebagai media untuk saling sharing atau saling berbagi pengetahuan khususnya dalam bidang computer. Karena saya menyadari bahwa untuk bergelut di bidang computer harus saling berbagi karena bidang computer sangatlah luas dan selalu mengalami perubahan yang sangat cepat. Maka dari itu dengan adanya blog ini maka pengetahuan yang saya dapat saya tuangkan di blog ini agar dapa bermanfaat kepada orang lain.

Salam Blogger,

Aris Susanto

Membuat surat dengan menghubungkan microsoft excel dan micorosft word

Pada kesempatan ini penulis ingin lagi berbagi tentang bagaimana cara menghubungkan atau merelasikan antara Microsoft office word dengan Microsoft office excel. Yang menjadi kasus pada tutorial ini adalah misalkan pada saat anda membuat sebuah surat yang akan di tujukan kepada beberapa orang atau beberapa tempat ataupun instansi. Nah, pada dasarnya ketika kita menghadapi masalah tersebut biasanya kita membuat beberapa halaman sesuai berapa surat yang akan di tujukan atau dengan cara mengganti setiap nama yang akan di print out.

Dengan memperhatikan masalah tersebut di atas maka seandainya surat atau kepada siapa akan di tujukan surat tersebut mencapai ratusan atau ribuan, maka akan membutuhkan waktu yang cukup lama atau memakan waktu yang tidak sedikit untuk menyelesaikannya. Nah, untuk mengatasi permasalahan tersebut penulis akan berbagi pengetahuan bagaimana cara membuat sebuah surat yang hanya di ketik dalam satu halaman yang nantinya dapat dig anti atau di isi dengan beberapa yang di tujukan. Untuk itu ikuti langkah-langkah berikut ini.

Langkah pertama yang harus anda lakukan adalah buka jendela Microsoft office excel. Kemudian masukkan field yang anda butuhkan. Misalkan pada surat yang sering diganti isinya adalah Nomor Surat, Kepada yang di tujukan dan Alamat tujuan, jadi yang anda ketik adalah kolom A adalah Nomor Surat, kolom B adalah Nama Tujuan dan kolom C adalah Alamat. Setelah anda ketik fieldnya maka anda ketikkan lagi masing-masing record dari field tersebut. JIka masih bingun maka anda bisa lihat table di bawah ini.

Nomor Surat	Nama Tujuan	Alamat
123/TES/XI/2014	ARIS SUSANTO	KONSEL
124/TES/XI/2014	RAHMAT INGGI	UNAAHA
124/TES/XI/2014	HUSNI KAIMUDDIN	BAU-BAU

Setelah anda sudah ketik seperti contoh table yang sudah di gambarkan di atas maka selanjutnya anda simpan file tersebut dengan nama database atau tergantung dari anda nama file yang akan anda berikan.

Langkah Kedua adalah buka jendela Microsoft office word lalu mulailah mengetik format surat seperti biasa yang anda buat yang tentunya memiliki kop surat, nomor surat, lampiran, perihal, tanggal surat, kepada siapa di tujukan, salam pembuka, isi surat, salam penutup, dan nama terang serta tanda tangan pengirim.

Langkah ketiga adalah koneksikanlah file excel yang sudah anda buat dengan cara masuk di menu Mailings tepatnya di group menu Start Mail Merge lalu klik tanda panah yang ada di menu Start Mail Merge sehingga muncul dropdown menu, langkah berikutnya anda klik pada menu Step by Step Mail Merge Wizard . . . sehingga muncul kotak menu di samping jendela kerja word anda. Selanjutnya anda klik menu Next:Starting document di bagian bawah pada step pertama lalu klik lagi Next:Select recipients pada step kedua. Setelah anda lewati step kedua maka pada step ketiga anda klik menu Browse... yang ada di bagian tengah jendela Mail Merge lalu cari file excel yang anda buat sebelumnya. Setelah di dapat filenya maka langsung klik tombol open.

Langkah ketiga setelah anda membuka file excel anda maka muncul kotak dialog Select table, dimana anda di perintahkan untuk memilih table dimana anda mengetik sebelumnya. Pada tutorial ini karena kita mengetik di sheet1 maka yang di pilih adalah table yang bernama Sheet1. Setelah anda pilih nama tabelnya maka anda klik Ok.

Langkah ke empat adalah arahkan kursor anda pada bagian yang akan di isikan datanya yaitu tepatnya pada bagian nomor dengan menempatkan kursor setelah kata nomor surat lalu masuk lagi di menu Mailings, klik tanda panah kecil pada menu Insert Mergge Field lalu klik Nomor Surat. Selanjutnya anda arahkan atau tempatkan lagi kursor anda pada nama yang di tuju lalu klik lagi insert merge field lalu pilih Nama yang di tuju, selanjutnya tempatkan kursor di bagian alamat lalu klik kembali insert merge field lalu pilih Alamat. Selanjutnya jika anda ingin melihat hasilnya maka anda klik menu Preview Results maka hasil atau record tersebut akan di tampilkan dari record pertama.

Langkah kelima untuk mencetak semua data-data tersebut dengan format surat yang sama maka anda masuk kembali di Menu Mailings lalu anda klik tanda panah kecil pada menu Finish & Merge sehingga muncul sub menu lalu pilih Print Documents… sehingga muncul kotak dialog Merge to printer. Jika anda akan mencetak secara keseluruhan maka anda pilih yang All, jika anda akan mencetak bagian yang aktif saja maka anda pilih Current record, akan tetapi jika anda ingin mencetak bagian tertentu saja maka anda pilih option ketiga dengan cara memasukkan index record yang di inginkan misalkan kita akan mencetak dari record 1 sampai 10 maka yang di masukkan di textbox From adalah angka 1 dan di textbox to adalah angka 10 lalu klik tombol Ok maka muncul kotak dialog untuk memprint. Selanjutnya anda langsung saja klik tombol Ok.

Membuat halaman website dinamis yang di atur dengan file CSS

Pada tutorial ini akan di bahas bagaimana membuat sebuah halaman website yang tampilannya lebih menarik yaitu dari segi layout di antaranya memiliki bagian header, menu navigasi, content, sidebar, dan bagian foter. Pada dasarnya untuk mengatur tampilan tersebut agar membentuk beberapa bagian yang sudah di sebutkan tadi, maka di butuhkan sebuah file untuk mengaturnya sehingga bisa tampil lebih menarik. File yang di maksud untuk mengatur tampilan dan tata letak tersebut yaitu file CSS (Cascading Style Sheet) yang pada dasarnya memang CSS di gunakan untuk penyempurna untuk mengatur layout dan tampilan sebuah halaman website.

Pada tutorial yang penulis tuangkan dalam artikel ini pada dasarnya tidak semua script tersebut di susun dari nol. Akan tetapi, di ambil dari beberapa reperensi yang di download dari internet yang di gabungkan dan di sesuaikan sehingga bisa membentuk sebuah halaman seperti penulis buat. Adapun tambahan lainnya pada tampilan tersebut yaitu penambahan pada menu dalam bentuk dropdown.

Adapun hal-hal yang harus anda perhatikan dalam tutorial ini bahwa file yang di butuhkan ada dua jenis yaitu file HTML dan file CSS. Yang menjadi pertanyaan kenapa harus ada dua file yang kita butuhkan, jawabannya adalah karena pada pembuatan file css kita menggunakan CSS Eksternal yang berarti file CSS di buat secara terpisah atau di rancang dengan file tersendiri. Namun demikian file tersebut pada dasarnya tergabung dengan file HTML.

Untuk lebih jelasnya agar anda tidak bingun bagaimana hasil dari tampilan akhir dari halaman web yang di maksud maka ikuti langkah-langkah berikut. Untuk langkah awal anda buat sebuah file seperti di script di bawah ini yang di ketik atau copy script di bawah ini lalu paste di notepad biasa atau menggunakan notepad++ dan selanjutnya anda simpan dengan nama file Style dengan type file yaitu CSS. Jika anda menggunakan notepad biasa maka ubah pada save as type menjadi All Files lalu ketikkan nama filenya yaitu style.css lalu simpan dalam sebuah folder.

*{
 margin:0;padding:0;
}
body{
 background:black;
 font-family: georgia;
 margin-top:40px;
}
p{
 padding:20px;line-height:30px;text-align:justify;
}
a{
 color:black;text-decoration:none
}
#wrapper{
 width:1060px;
 margin:auto;
 background: white;
 box-shadow:0px 0px 0px 2px #62830a;
}
.clear{clear:both;}
#header{
 background:#9acf11;
 padding:20px;
}
#header:hover{
 background:#9acf11;
 padding:20px;
}

#navigation ul {list-style:none;background:#62830a;
 list-style:none;
 background-image:-webkit-linear-gradient(top,#EBEBEB,#D7D7D7);
 background-color:#EBEBEB;
 box-shadow:0 1px 3px rgba(0,0,0,.5);
}
#navigation ul:after{
 content:" ";
 display:block;
 clear:both;
}
#navigation ul li{
float:left;padding:10px;border-right:1px solid #384b06;
 float:left;
 position:relative;
}

#naviation ul li a{
 color:#111;
 display:block;
 font-size:12px;
 padding:3px 20px;
 text-decoration:none;
}
#navigation ul ul li{
 float:none;
}
#navigation ul ul{
 position:absolute;
 top:100%;
 display:none; /* sembunyikan sub menu */
}
#navigation ul li:hover{
 background-color:#506def;
 display:block;
}
#navigation ul li:hover > ul{background-image:-webkit-linear-gradient(top, #506def,#2041DE);
 background-color:#506def;
 display:block;
}

#navigation ul li:hover >a, navigation ul ul li:hover > a  {
 color :white;
 background-image:-webkit-linear-gradient(top, #506def,#2041DE);
 background-color:#506def;
}
#navigation ul ul ul{
 position:absolute;
 left:100%;
 top:0;
} 
#content {
 
 float:left;
 width:700px;
 box-shadow:3px 0px 0px 0px #62830a;
}

#sidebar{
float:right;width:360px;
height:330px;}

#footer{
 background:#62830a;
}

Setelah anda buat file style.css  langkah selanjutnya adalah buat file HTML dengan mengetik atau copy script di bawah ini lalu pastekan seperti langkah pembuatan file CSS lalu simpan dengan nama file sesuai yang anda inginkan dengan type file HTML. Jika anda menggunakan notepad maka langkahnya hamper sama dengan pembuatan file CSS yang berbeda hanya nama file dan type filenya saja, akan tetapi jika anda menggunakan notepad++ maka langsung saja ketik nama filenya dan save as typenya cari Hypertext Markup Language (HTML) dan simpan dalam satu folder dengan file CSS yang anda telah buat. Pada artikel ini penulis memberikan nama file yaitu index.html. 

<!DOCTYPE HTML>
<html lang="en-US">
<head>
 <title>Blog Haris Larva</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
 <div id="wrapper">
  <div id="header">
   <h1><a href="http://www.pencariinfo.com" title="">Blog Haris Larva</a></h1>
  </div>
  <div id="navigation">
 <ul>
  <li><a href="#">Home</a></li>
  <li><a href="#">Blog</a>
   <ul>
    <li><a href="#">HTML</a></li>
    <li><a href="#">CSS</a></li>
    <li><a href="#">Javascript</a>
     <ul>
      <li><a href="#">HTML</a></li>
      <li><a href="#">CSS</a></li>
      <li><a href="#">Javascript</a></li>
     </ul>
    </li>
   </ul>
  </li>
  <li><a href="#">Portfolio</a></li>
  <li><a href="#">Contact</a></li>
 </ul>
</div>
  <div id="content">
   <p>
    Website merupakan sekumpulan halaman-halaman yang berisi informasi - informasi yang saling berkaitan antara satu 
    sama lain yang tersimpan dalam hosting yang di akses melalui jaringan internet.</p>
   <p>Jenis-jenis Website di bedakan menjadi beberapa macam yaitu : Website Statis, Website Dinamis, dan Website Interaktif.</p>
<p> Yang dimaksud dengan website statis adalah website yang tidak selalu berubah isi atau content pada website tersebut dan hanya admin yang bisa mengubahnya.</p>
  </div>
  <div id="sidebar">
   <p>Informasi Admin : Nama saya Aris Susanto, saya adalah mahasiswa STMIK Bina Bangsa Kendari dan mengambil jurusan Sistem Informasi</p>
  </div>
  <div class="clear"></div>
  <div id="footer">
   <p>
    copyright © 2014 by <a href="http://www.pencariinfo.com" rel="dofollow">pencariinfo.com</a>
   </p>
  </div>
 </div>
 <div class="clear"></div>
</body>
</html>

Semoga artikel ini dapat bermanfaat dan memberikan pengetahuan tentang membuat halaman website yang layout dan tampilannya di atur melalui sebuah file CSS (Cascading Style Sheet)