Cara Membuat Flash Button Menggunakan Dreamweaver

Saya akan membagikan kembali sebuah tutorial mengenai pembuatan menu untuk website. Kali ini yang akan saya paparkan adalah bagaimana cara membuat menu flash menggunakan Dreamweaver. Tutorial tersebut akan saya kupas pada bagian pertama yaitu postingan yang sedang Anda buka sekarang. Pada bagian kedua, saya juga akan menjelaskan langkah-langkah memasukkan flash menu tersebut ke dalam blog Anda yang di blogspot. Bagi pembaca yang mungkin baru mendengar tentang Dremaweaver, saya sarankan untuk membaca postingan mengenai Dreamweaver disini.
Berikut langkah-langkah yang akan kita lakukan untuk membuat menu flash dengan Dreamweaver:

1. Buka program Macromedia Dreamweaver dari komputer Anda.
2. Buatlah sebuah dokumen baru dengan jenis misalnya HTML. Pilih menu File -> New, kemudian pilih kategori Basic Page  dan gunakan tipe HTML.
3. Simpan terlebih dahulu dokumen tersebut. Beri nama misalnya "menu_flash.html". Saran saya, simpanlah di dalam sebuah folder baru, beri nama folder misalnya "menu".
   
4. Masuklah ke dalam layar design.
5. Pilih menu Insert -> Media -> Flash Button, maka akan muncul sebuah kotak dialog pembuatan tombol flash yang akan digunakan sebagai menu pada website.
   
   
   • Sample. Menunjukkan preview dari tombol flash yang kita pilih.
   • Style. Bentuk dari tombol yang kita bisa kita pilih. Sebagai contoh kita pilih "Slider".
     
   • Button Text. Tulisan yang terlihat pada tombol. Sebagai contoh kita tulis "Home".
   • Font. Jenis huruf dari button text.
   • Size. Ukuran huruf dari button text.
   • Link. Alamat URL yang akan dituju bila tombol menu flash tersebut diklik. Anda bisa memilih halaman/dokumen dari website yang sedang Anda desain pada komputer Anda dengan mengklik tombol Browse. Pada contoh ini kita akan me-link kan ke halaman luar misalnya: "http://www.banditbatak.com". Tuliaslah URL tersebut pada isian Link.
   • Target.Untuk memilih target halaman ketika menu tersebut diklik.
   • Bg color. Memilih warna background dari tombol flash yang sedang kita buat. Pilihlah transparent dengan mengklik tombol kecil yang berdiagonal warna merah.
   • Save as. Nama file flash yang sedang kita buat. Simpanlah dengan nama misalnya "home.swf"
6. Setelah semua dirasakan cukup dan benar, klik tombol Save.
7. Pada dukumen kerja Dreamweaver akan muncul tombol flash menu yang telah kita buat tadi.
   
   
8. Kita bisa menambah menu flash baru disamping menu Home yang telah kita buat tersebut. Misalkan kita ingin membuat menu lain yang letaknya sejajar dengan menu Home  tersebut sehingga tampil secara horizontal. Terlebih dahulu letakkan pointer di sebelah kanan tombol flash menu Home, kemudian lakukan hal yang sama seperti membuat menu flash dengan nama Home tersebut dari langkah 5 -6. Sebagai contoh saya membuat menu flash baru bernama "Tutorial Website" dengan link : "http://4zky4.blogspot.com/" dan saya simpan dengan nama "tutorial_website.swf".  Hasilnya akan tampak seperti gambar di bawah ini.
   
   
9. Di dalam folder "menu" yang Anda jadikan sebagai tempat menyimpan dokumen "menu_flash.html" tadi telah bertambah 2 buah file flash yang bernama home.swf dan tutorial_website.swf
   
   

Sumber

Membuat Form Sign Up / Register, Login Dan Logout

Membuat Form Sign Up/Register, Login dan Logout untuk pembangunan sebuah web dengan berbasiskan member saat ini sudah menjadi tren bagi para webmaster yang ingin membangun web yang "look professional". Pada artikel ini akan dijelaskan tutorial untuk membuat form sign up dan login serta logout yang masih berbentuk sederhana. Untuk selanjutnya, anda dapat membuat sendiri pengembangan dari script ini.

• Langkah pertama, anda harus membuat file  "Config.php". File ini berfungsi menghubungkan script yang anda buat dengan database. Isi dari file "config.php" ini dapat anda lihat di bawah
  
  <?php
  $server = "localhost"; // server web anda.
  $database = "mydata"; // nama dari database yang anda buat.
  $db_user = "myusername"; // username dari mysql anda.
  $db_pass = "mypassword"; // password untuk mengakses mysql anda tersebut.
  $table = "users"; //nama table yang akan dibuat di database.
  ?>
  
  Simpan file tersebut di root web anda. Setelah selesai, anda dapat melanjutkan pada tahap yang kedua.

• Buat file dengan nama "create.php". File ini berfungsi menjalankan perintah query database dalam pembuatan table signup dan login ini. Isi dari file ini dapat anda lihat dibawah.
  
  <?php
  include ("config.php");
  // konek ke server MYSQL
  $link = mysql_connect($server, $db_user, $db_pass)
  or die ("Could not connect to mysql because ".mysql_error());
  // pilih database
  mysql_select_db($database)
  or die ("Could not select database because ".mysql_error());
  // bikin tabel di database
  $create = "create table $table (
  id smallint(5) NOT NULL auto_increment,
  username varchar(30) NOT NULL,
  password varchar(32) NOT NULL,
  PRIMARY KEY (id),
  UNIQUE KEY username (username)
  );";
  mysql_query($create)
  or die ("Could not create tables because ".mysql_error());
  echo "Mangstabs!!sekarang lanjut ke tahap yang ketiga";
  ?> 

• Sekarang anda perlu membuat form yang digunakan pengunjung untuk sign up dan berikan nama "register.html". File yang anda buat ini boleh berupa halaman HTML biasa yang nantinya akan terhubung pada script php yang nantinya anda akan buat. Untuk percobaan yang sederhana, anda dapat meng-copy script di bawah pada halaman baru Dreamweaver.
  
  
  <html><head>
  <title>REGISTRASI MEMBER</title>
  </head><body>
  <form action="register.php" method="post">
  Pilih Username: <input type="text" name="username" size="20"><br>
  Pilih Password: <input type="password" name="password" size="20"><br>
  <input type="submit" value="Sign Up">
  </form>
  </body></html>

• Setelah itu buat file dengan nama "register.php". File ini akan berfungsi sebagai perantara yang menghubungkan file register.html diatas dengan database yang sudah anda buat. Untuk isi dari file "register.php dapat anda lihat dibawah.
  
  
  <?php
  include("config.php");
  // konek ke server MYSQL
  $link = mysql_connect($server, $db_user, $db_pass)
  or die ("Could not connect to mysql because ".mysql_error());
  // pilih database
  mysql_select_db($database)
  or die ("Could not select database because ".mysql_error());
  // cek kesamaan username
  $check = "select id from $table where username = '".$_POST['username']."';";
  $qry = mysql_query($check) or die ("Could not match data because ".mysql_error());
  $num_rows = mysql_num_rows($qry);
  if ($num_rows != 0) {
  echo "Maaf, username $username sudah ada yang punya<br>";
  echo "<a href=register.html>Anda belum beruntung, silakan dicoba kembali</a>";
  exit;
  } else {
  // masukkan data
  $insert = mysql_query("insert into $table values (’NULL’, '".$_POST['username']."',
  '".$_POST['password']."')")
  or die("Could not insert data because ".mysql_error());
  // tampilkan pesan sukses
  echo "Akun Anda Telah Selesai Dibuat!<br>";
  echo "Sekarang anda bisa <a href=login.html>Login sebagai member web Cyber4rt</a>";
  }
  ?>

• Sekarang anda perlu membuat form member untuk Login. Beri file ini dengan nama "login.html". Isi dari file ini yaitu sebagai berikut :
  
  <html><head>
  <title>MEMBER LOGIN</title>
  </head><body>
  <form action="login.php" method="post">
  Username: <input type="text" name="username" size="20"><br>
  Password: <input type="password" name="password" size="20"><br>
  <input type="submit" value="Log In">
  </form>
  </body></html>
  

• Sekarang anda perlu membuat file yang akan menghubungkan file login.html dengan database, berikan nama file ini dengan "login.php". Script-nya dapat anda lihat dibawah.
  
  <?php
  include("config.php");
  // konek ke server MYSQL
  $link = mysql_connect($server, $db_user, $db_pass)
  or die ("Could not connect to mysql because ".mysql_error());
  // pilih database
  mysql_select_db($database)
  or die ("Could not select database because ".mysql_error());
  $match = "select id from $table where username = '".$_POST['username']."'
  and password = '".$_POST['password']."';";
  $qry = mysql_query($match)
  or die ("Could not match data because ".mysql_error());
  $num_rows = mysql_num_rows($qry);
  if ($num_rows <= 0) {
  echo "Maaf, tidak ada username $username dengan password tersebut.<br>";
  echo "<a href=login.html>Coba lagi</a>";
  exit;
  } else {
  setcookie("loggedin", "TRUE", time()+(3600 * 24));
  setcookie("mysite_username", "$username");
  echo "Anda telah login!<br>";
  echo "Lanjutkan ke <a href=members.php>member</a> area.";
  }
  ?>
  

• Perhatikan file tersebut pad baris ketiga paling bawah, disana berisi <a href=members.php> members.php ini adalah sebuah area yang hanya bisa dilihat oleh para member. Anda dapat membuat file members.php dengan kreasi sendiri. Sekarang saya akan menjelaskan script yang digunakan untuk mengecek cookie, apakah orang tersebut sudah login atau tidak. Simpan scipt ini di seluruh area members. Script-nya sebagai berikut :
  
  <?php if (!isset($_COOKIE['loggedin'])) die("Anda sedang tidak login! Silakan login terlebih dahulu");
  $mysite_username = $HTTP_COOKIE_VARS["mysite_username"];
  echo "Anda login sebagai $mysite_username.
  "; ?>
  

• Akhirnya script yang terakhir yaitu script untuk logout. Script ini dapat dihubungkan dengan link pada html biasa. Link ini diletakkan pada area member. Lihat isi script-nya di bawah ini :
  
  <?php
  // masa aktif cookie
  setcookie ("loggedin", "", time() - 3600);
  echo "Anda sudah logout.<br>";
  echo "<a href=\"login.html\">Login</a>.";
  ?>

Untuk peng-aplikasi-an dari script-script yang saya jelaskan di atas, dapat anda kreasikan sendiri. Selamat berkreasi.!!!! 

 

Sumber