Showing posts with label pemrograman. Show all posts
Showing posts with label pemrograman. Show all posts

Membagi Side Bar Menjadi 2 Kolom

Artikel membagi sidebar blogspot menjadi 2 kolom ini sebenarnya sudah banyak sobat blogger yang menulis di blognya namun berhubung ada sobat pengunjung blog Belajar Ilmu Komputer yang menanyakan maka saya juga ikutan menulis cara membagi sidebar menjadi 2 kolom ini agar pengunjung blog BIK Pemula ini tidak susah mencari lagi kesana-kemari.

Membagi sidebar menjadi dua kolom atau dengan kata lain sidebar 1 kolom di atasnya kemudian sidebar di bawahnya diubah menjadi 2 kolom. Kalau belum jelas juga perhatikan contohnya di sini.

Perhatikan di sample blog tersebut terdapat 3 buah sodebar yang terdiri dari 1 kolom dan 1 buah sidebar yang saya bagi menjadi 2 kolom yg letaknya di bawah gadget follower.

Belajar HTML untuk Pemula (bagian 5)

Elemen ol (ordered list), ul (unordered list) dan li (list item)

Untuk elemen ol memiliki attribut start dan type, start untuk menentukan format penomoran awal, sebagai contoh apabila dimulai dengan nomor 1 maka start akan diberikan attribut 1 (start="1" dan apabila ingin memulai dengan nomor 2 atau tiga atau empat maka attribute untuk startnya sesuaikan dengan awal penomoran tersebut.

HTML untuk elemen ul (unordered list) digunakan untuk membuat list tanpa adanya nomor urut baik berupa angka maupun abjat seperti 1, A, a, I, i dan sebagainya melainkan berupa bentuk lingkaran, kotak maupun bundar dan memiliki attribute type yang berfungsi untuk mengubah bentuk attribute tersebut.

HTML untuk elemen li (list item) juga memiliki attribute start dan type

Berikut ini beberapa contoh html untuk elemen ol, ul dan li.

Contoh HTML untuk ol dan li

Link Blog Saya
<ol>
     <li>Belajar Ilmu Komputer</li>
     <li>Computer Serve</li>
     <li>TobiPuken.com</li>
     <li>KlikGanda</li>
     <li>Kokiku-tobipuken</li>
     <li>Belajar HTML</li>
</ol>

Hasilnya seperti berikut :

Link Blog Saya

        
  1. Belajar Ilmu Komputer
  2.     
  3. Computer Serve
  4.     
  5. TobiPuken.com
  6.     
  7. KlikGanda
  8.     
  9. Kokiku-tobipuken
  10.     
  11. Belajar HTML

Contoh untuk elemen ul (unordered list)

Link Blog Saya
<ul>
     <li>Belajar Ilmu Komputer</li>
     <li>Computer Serve</li>
     <li>TobiPuken.com</li>
     <li>KlikGanda</li>
     <li>Kokiku-tobipuken</li>
     <li>Belajar HTML</li>
</ul>

Hasilnya seperti berikut

Link Blog Saya

        
  • Belajar Ilmu Komputer
  •     
  • Computer Serve
  •     
  • TobiPuken.com
  •     
  • KlikGanda
  •     
  • Kokiku-tobipuken
  •     
  • Belajar HTML

Untuk mencoba sendiri html untuk elemen ol, ul dan li silahkan copy kode html di atas dan pastekan pada notepad kemudian simpat dengan nama file : olulli.html kemudian coba jalankan pada browser dan lihat hasilnya.

Cara Membuat TextArea Dilengkapi Dengan Select All

Artikel textarea  yang sudah dilengkapi dengan fasilitas select all ini sudah tidak asing lagi didunia per"blogger"an namun berhubung masih ada sobat yang ingin agar lebih mudah menemukannya maka artikel inipun saya tulis dengan harapan bisa mempermudah sobat semua para pengunjung setia Belajar Ilmu Komputer.

Text area adalah merupakan salah satu kode HTML yang berfungsi untuk membentuk daerah persegi atau kotak yang berfungsi untuk membatasi teks atau kode tertentu.

berikut ini adalah contoh textarea



Untuk membuat textarea seperti di atas kodenya adalah seperti berikut :



<textarea style="padding: 3px; width:200px; height:60px";>Inilah teks yang berada di dalam kotak</textarea>

Kode di atas hanya berupa textarea saja sedangkan tab atau tombol untuk Select All belum ada. Kita harus menambahkan kode untuk tab Select All seperti berikut.


kode untuk tombol (button)Select All di atas adalah

<form name="copy"><div align="center"><input value="Select All" onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button"/></div>

Jika digabungkan maka kode selengkapnya menjadi seperti berikut. Kode yang berawarna biru adalah kode untuk button Select All sedangkan kode berwarna orange adalah kode untuk textarea.

<form name="copy"><div align="left"><input value="Select All" onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button"/></div><textarea style="padding: 3px; width:200px; height:60px" name="txt";>Inilah teks yang berada di dalam kotak</textarea>

sehingga hasil akhirnya menjadi seperti berikut.



Coba klik pada Select All maka semua teks yang berada di dalam kotak akan terseleksi, jika hendak memperbanyak (copy) maka klik kanan di dalam kotak tersebut dan klik copy dan kemudian pastekan kodenya di tempat yang dituju.

Semoga artikel ini bermanfaat bagi pengunjung Belajar Ilmu Komputer.

Belajar HTML untuk Pemula (bagian 4)

Format Teks HTML

Paragraph atau alinea dalam bahasa indonesianya yang memiliki tag <p> untuk awal paragraf sedang untuk tag penutup adalah </p>.
penulisan sintaksnya adalah :

<p>
...................
</p>

tag <p> memiliki attribut align yang memiliki nilai left, right dan center dan sintaksnya sebagai berikut :

<p align="left">
...................
</p>

contoh :

<p align="center">
Ini adalah HTML rata tengah
</p>
<p align="right">
Ini adalah HTML rata kanan
</p>
<p align="left">
Ini adalah HTML rata kiri
</p>

ketiklah contoh di atas pada notepad kemudian simpan dengan nama file format.html dan coba jalankan pada browser dan lihat hasilnya.

Font atau huruf memiliki tag <font> dengan attribute color, face dan size, sintaksnya akan menjadi

<font color="red" face="arial" size="10">
ini HTML font
</font>


Belajar HTML untuk pemula (bagian 3)

Bentuk HTML tabel pada dasarnya adalah seperti berikut

<table>
<tr>
<td>kolom1 </td><td>kolom2 </td>
</tr>
<tr>
<td>kolom1 </td><td>kolom2 </td>
</table>

Penjelasan

<tabel>dan </tabel>adalah merupakan batasan area HTML untuk tabel.
<tr>dan </tr>menyatakan batasan untuk sebuah baris dalam table.
<td>dan </td>adalah batasan untuk data dalam sebuah sel tabel, pada bentuk penulisan HTML di atas pada kata "kolom1" dan "kolom2" yang pertama menyatakan posisi sel kolom1 baris1 dan kolom2 baris1 sedangkan untuk kata "kolom1" dan "kolom2" yang kedua adalah menyatakan posisi sel berada pada kolom1 baris2 dan kolom2 baris2.

Contoh

<table border="1">
<tr>
<td>baris1 kolom1 </td>
<td>baris1 kolom2 </td>
</tr>
<tr>
<td>baris2 kolom1 </td>
<td>baris2 kolom2 </td>
</tr>
<tr>
<td>baris3 kolom1 </td>
<td>baris3 kolom2 </td>
</tr>
Penambahan border="1" adalah dengan maksud memberikan batasan antar setiap sel dengan sbuah garis atau tabel bergaris, jika tabel dibuat tidak bergaris maka tinggal menghilangkan penulisan border. Angka 1 pada kata border="1" menyatakan nilai atau ukuran garis pada tabel tersebut, semakin besar nilainya maka semakin besar pula garisnya.

ketiklah contoh di atas pada notepad kemudian simpan dengan nama file latihan3.html dan coba jalankan dari browser pada komputer anda.

Hasilnya jika di jalankan pada browser akan terlihat seperti di bawah ini :






Belajar HTML untuk pemula (bagian 2)

Heading atau Judul

Untuk membuat heading atau judul pada HTML terdiri dari :

  1. <h1>Judul 1</h1>
  2. <h2>Judul 2</h2>
  3. <h3>Judul 3</h3>
  4. <h4>Judul 4</h4>
  5. <h5>Judul 5</h5>
  6. <h6>Judul 6</h6>

Penjelasannya :

<h1>....</h1> adalah merupakan penulisan judul dengan ukuran huruf yang paling besar dan untuk <h2>...</h2> dan seterusnya sampai <h6>...</h6> adalah judul kedua sampai dengan judul keenam dengan ukuran huruf semakin besar nilainya maka semakin kecil ukuran hurufnya.

Sebagai praktek buatkan atau ketik kode HTML berikut ini pada notepad kemudian simpan dengan nama file praktek2.html kemudian buka atau jalankan pada web browser anda dan perhatikan hasil yang terjadi.

<h1>Judul Baris Pertama</h1>
<h2>Judul Baris Kedua</h2>
<h3>Judul Baris Ketiga</h3>
<h4>Judul Baris Keempat</h4>
<h5>Judul Baris Kelima</h5>
<h6>Judul Baris Keenam</h6>

Dan hasilnya akan terlihat seperti berikut :

Judul Baris Pertama


Judul Baris Kedua


Judul Baris Ketiga


Judul Baris Keempat


Judul Baris Kelima

Judul Baris Keenam


Selamat mencoba semoga bermanfaat

Belajar HTML untuk pemula (bagian 1)

Sebelum memulai mempraktekan HTML ada baiknya kenal terlebih dahulu apa itu HTML.

HTML (HiperText Markup Language) adalah merupakan sebuah bahasa text yang digunakan untuk membuat sebuah halaman web untuk menampilkan informasi-informasi ke sebuah software browser di internet seperti internet explorer, mozila firefox dan lainnya.

Memulai HTML

Software apakah yang digunakan untuk menulis bahasa HTML ? untuk menulis bahasa html biasa digunakan software bawaan windows yaitu notepad tetapi bisa juga menulis HTML pada Microsoft Front Page, DOS Edit.

Untuk membuat sebuah bahasa HTML pada notepad harus disimpan (save) dengan akhiran atau extensi html agar bisa dibaca oleh web browser, sebagai contoh latihan1.html.

Menjalankan HTML

Setelah membuat sebuah proyek HTML dengan cara mengetik pada notepad, selanjutnya HTML tersebut coba dijalankan dengan menggunakan sotware browser yang ada pada komputer anda, misalnya Internet Explorer yang merupakan bawaan windows, atau bisa juga dengan firefox, gunakan salah satunya.

Cara membuka file HTML

Jalankan wbe browser anda (IE atau firefox), jika menggunakan Internet Explorer, maka klik menu File kemudian pilih Open, selanjutnya cari file html yang barusan anda buat kemudian klik open. Apabila menggunakan firefox maka klik menu File kemudian pilih Open File, selanjutnya cari file html yang sudah dibuatkan tadi kemudian klik Open.

Itu adalah langkah-langkah dalam membuat bahasa html hingga menjalankannya pada web browser.

bentuk dasar dari html adalah :

<html>
<head>
<title>
Judul HTML pertamaku
</title>
</head>
<body>
body/isi HTML pertamaku.
</body>
</html>
Untuk mencoba sebuah proyek html anda yang baru, coba buka notepad kemudian ketikan kode di atas dan simpan (save) dengan nama file latihan1.html kemudian coba jalankan pada browser (Internet Explorer/Mozilla Firefox) di komputer anda.

Selamat mencoba

Membuat Menu pada Joomla

Untuk menambah atau membuat sebuah menu baru sebelumnya harus login terlebih dahulu menggunakan username Admin dan password yang sudah anda buatkan di saat installasi joomla pertama kali. Cara login, ketik //localhost/tobipuken/administrator pada address browser kemudian tekan enter atau klik Login.

Karena pada awalnya menu yang ada pada Main Menu adalah hanya sub menu Home maka sekarang kita akan melanjutkan membuat sebuah submenu baru dengan nama menunya adalah About Us tepat di bawah submenu Home.

Mari kita mulai, pada menu Menus klik Main Menu, dan disitu terlihat hanya satu buah submenu yaitu Home, dan sekarang kita menambah sebuah submenu baru, namun sebelum membuat sebuah submenu baru maka terlebih dahulu buatkan sebuah artikel About Us. Ini dimaksud agar nantinya apabila pengunjung situs kita klik pada submenu About Us maka pengunjung website akan membaca isi atau konten daripada artikel About Us tersebut. Bagi yang belum memiliki sebuah artikel silahkan baca cara mengetik/membuat artikel pada joomla.

Setelah memiliki artikel yang isinya tentang About Us maka mari kita lanjutkan dengan membuat submenu About Us. Caranya, klik menu Menus dan pilih Main Menu, kemudian klik New kemudian pilih articles dan sub article layout. Pada article layout ketik About Us pada bagian Title, sedangkan aliasnya dibiarkan kosong karena joomla akan secara otomatis membuat alias name sesuai dengan judul dari menu itu sendiri.
Selanjutnya adalah pilih artikel yang sesuai dengan menu yang akan kita buat, dalam hal ini karena kita membuat sebuah sebmenu About Us maka artikel yang dipilih adalah artikel About Us kemudian klik Save.
Sekarang menu About Us sudah selesai, coba jalankan website anda kemudian klik pada menu About Us maka akan muncul isi dari artikel About Us tersebut. Untuk menjalankan website anda caranya ketik //localhost/tobipuken pada browser anda. Bila sudah berhasil jangan lupa untuk mencoba membuat menu-menu baru sebagai bahan belajar anda selanjutnya.

Selamat mencoba semoga bisa membantu...

Belajar Membuat Website dengan Joomla

Pada awal tahun 2008 tepatnya di bulan mei saya memulai belajar tentang membuat blog, mempercantik blog hingga satu tahun sudah bergelut dengan blog dan pada akhirnya sudah tiba saatnya untuk belajar tentang website.

Pada awalnya memang tidak terbayangkan bagaimana caranya membuat sebuah website seperti yang sering saya lihat di dunia internet. Dengan adanya matakuliah pemrograman web yang saya peroleh dari bangku kuliah di Sekolah Tinggi Manajemen Informatika dan Komputer (STMIK) Denpasar, akhirnya saya mencoba membuat sendiri sebuah website yang sederhana sebagai percobaan dan juga untuk menambah pengetahuan tentang pembuatan website.

Diperjalanan pembuatan website ternyata tidak hanya ilmu tentang bagaimana cara membuat sebuah website tetapi kita juga memperoleh ilmu tentang bagaimana caranya untuk membeli sebuah domain di internet dan bagaimana caranya untuk upload website ke server serta koneksi antar website dengan database.
Setelah hampir sebulan mengutak-atik website di locak computer akhirnya pada bulan juni 2009 website sederhana inipun sudah bisa online dan hasilnya bisa dilihat dengan klik banner dibawah ini.
Website ini dibuat dengan joomla 1.5.9 dan masih jauh dari sempurna, untuk itu kami akan terus mencaritahu bagaimana cara yang baik membuat sebuah website.
Bagi pengunjung yang ingin memberikan saran silahkan berikan komentarnya di blog kesayangan kita ini atau bisa juga pada komentar di http://www.tobipuken.com.

Belajar Delphi

Pengenalan Delphi


Apa itu Delphi ? Delphi adalah salah satu perangkat lunak yang digunakan untuk menyusun program aplikasi yang berjalan di atas system operasi windows. Belajar Delphi adalah belajar bagaimana cara membuat sebuah program aplikasi.
Dengan Delphi kita dimanjakan dengan komponen-komponen yang sudah tersedia sehingga kita tidak perlu repot untuk membuat komponen-komponen yang akan dibutuhkan dalam pembuatan sebuah program aplikasi.

Kita tidak perlu lagi membuat window, kotak dialog, maupun perangkat control lainnya dengan kode yang rumit karena semuanya sudah tersedia dalam Delphi untuk menghemat waktu atau mempercepat proses pembuatan program aplikasi.

Selain kemudahan dan kelebihan di atas Delphi juga memiliki kecepatan dalam proses kompilasi program, exe (execution) file yang dapat berjalan di luar software pembangunnya serta file dll (dynamic link library) juga bisa berdiri sendiri tanpa harus melalui program utamanya.

Lembar Kerja Delphi


Lembar kerja Delphi terdiri dari :
Baris Judul yaitu baris paling atas yang menyatakan nama dari projek yang sedang dikerjakan dalam hal ini nama sebuah program.
Di Bawah baris judul ada Baris Menu, terdapat menu-menu yang dapat digunakan dalam penyusunan sebuah program aplikasi.

Di Bawah Baris Menu terdapat Toolbar dan Component Pallete, tersedia komponen-komponen yang dapat digunakan secara cepat dalam pembuatan program aplikasi.
Kemudian yang berada di tengah-tengah adalah sebuah disebut window yang disebut Form dengan nama Form1. Form inilah tempat dimana kita akan menempatkan komponen-komponen yang tersedia pada component pallete misalnya sebuah button atau sebuah label.

Disebelah kiri jendela Delphi adalah Object Tree View dan Object Inspector yang menyatakan properties dari objek-objek yang digunakan dalam Form.
Selain Form ada sebuah jendela yang hampir sama dengan Form, namun jendela ini hanya menyimpan kode-kode berdasarkan komponen-komponen yang terpasang pada Form yang disebut Unit.

Pada keadaan Standard saat pertama kali di jalankan, kode dari program Delphi yang ada dalam Unit adalah sebagai berikut :

unit Unit1;
interface
uses
Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,
Dialogs;
type
TForm1 = class(TForm)
private
{ Private declarations }
public
{ Public declarations }
end;
var
Form1: TForm1;
implementation
{$R *.dfm}
end.

Pengikut Belajar Ilmu Komputer