Showing posts with label ilmu komputer. Show all posts
Showing posts with label ilmu komputer. Show all posts

Bagaimana Cara membuat Website menggunakan Notepad part.2

Bagaimana Cara membuat Website menggunakan Notepad part.2


setelah anda mengerti tag-tag yang sering digunakan, sekarang lanjut pada topik bahasan yang kedua

langkah kedua ini bagaimana cara anda membuat garis header, navigasi tempat berita dan copyright.

 tuliskan syntac dibawah ini kedalam notepad kemudian dengan nama belajar.html

tuliskan script dibawah ini kemudian save jangan lupa format file adalah .html:
Berikut:

<html>
<head>
<body>
<title>Belajar</title>
</body>
<table border="2px" width="100%" height="100%">
<td colspan="2" width="100" height="10%"><center><h1>Microsoft Office</h1></center></td>
</tr>
<tr>
<td valign="top" width="20%">Tempat Berita
<br>
<a href="#masukan link">Fungsi Microsoft word</a>
<br>
<a href="#masukan link">Fungsi Microsoft Excel</a>
<br>
<a href="#masukan link">Fungsi Microsft Power Point </a>
</td>
<td>
<font size=2" color="red">Tanggal 01 November 2014</font>
<br>
artikel anda isikan disini
</td>
</tr>
<!--Baris ketiga untuk copyright-->
<tr>
<td align="center" colspan="2" height="10%">Copyright@2014 by Parta Sinaga</td>
<td> </td>
</tr>
</table>
</head>
</html>

Dari sini anda bisa berkreasi sendiri, terima kasih atas kunjungannya jangan lupa komentarnya

Bagaimana Cara membuat Website menggunakan Notepad

Bagaimana Cara membuat Website menggunakan Notepad


Sekarang saya akan memberikan tutorial bagaimana cara membuat web menggunakan notepad,
Notepad adalah sebuah aplikasi sebuah text editor simple yang sudah ada sejak Windows 1.0 di tahun 1985 yang ada di setiap system windows baik xp, vista, seven dan lain lain.

nah untuk itu lakukan langkah-langkah dibawah ini:
1.pertama  buka notepad kemudian tuliskan script dibawah ini:
 <html>
 <head>
 <title>BELAJAR</title>
 </head>
 <body>
 <center><h1>Microsoft Corporation</h1></center>
 </body>
 </html>

hal di atas adalah hal terpenting dalam membangun sebuah web.
kemudian save dengan nama belajar.html , kemudian klik 2 kali maka akan muncul WHITE SCREEN dengan tulisan Microsoft Corporation

Sebelum lanjut kedalam topik bahasan anda harus mengerti dulu Tag-Tag yang sering digunakan dalam membuat web.
silahkan Baca:http://www.blogparta.com/2014/10/mengenal-html.html





Membuat website yang full color in background

Membuat website yang full color in background




Teknik mendesain website sangat beragam, salah satu yang digemari para desainer yaitu membuat sebuah gambar menjadi background yang full satu halaman. Gambar full background akan menciptakan efek elegan pada website, tentunya harus didukung dengan pemilihan gambar yang bagus, jenis dan warna font yang dipakai juga menentukan.

Bagaimana cara membuat halaman website full background tersebut,  tidak terlalu sulit, pada tulisan ini wakaka design akan memberikan potongan kode yang berguna untuk membuat sebuah gambar menjadi full background.

Kita akan memanfaatkan fungsi css bernama Background-size.

Inti dari membuat website full background adalah menggunakan potongan kode seperti ini, bisa diterapkan di tag html, atau body.

Kita akan memanfaatkan fungsi css bernama Background-size.

Inti dari membuat website full background adalah menggunakan potongan kode seperti ini, bisa diterapkan di tag html, atau body.

html{
background: url(img/bromo.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

Sekarang waktunya anda memilih gambar


Membuat Struktur HTML
Pada tulisan ini kita akan menggunakan 2 buah Font yang akan kita embed dari Google Web Fonts, yaitu



Rancangan struktur yang akan kita buat terdiri dari
header, untuk menempatkan judul website.
content, untuk menuliskan isi dari website.
footer, untuk menuliskan hak cipta dan sumber.

berikut ini kode selengkapnya
<div class="container">

<div class="header">
<h1 class="brand">Mount Bromo</h1>
<span class="red">East Java,</span> <span class="white">Indonesia</span>
</div>

<div class="content">
</div>

<div class="footer">
<div class="footer-left">Designed by <a href="http://tutorial-webdesign.com">Wakaka Design</a> | back to <a href="#">tutorial</a></div>
<div class="footer-right">Image By <a href="http://www.flickr.com/photos/daniele_parisi/2825831148/sizes/o/in/photostream/">Daniele Parisi</a></div>
</div>

</div>
Code CSS
*{padding:0;margin:0}
html{
background: url(img/bromo.jpg) no-repeat center center fixed;
 -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
font-family: 'Open Sans', sans-serif;
font-size:13px;
text-shadow: 0px 1px 2px #000;
}
a{color:#999;text-decoration:none}
a:hover{border-bottom:1px solid #999}
.header{
padding:8% 2%;
font-size:24px;
text-shadow: 0px 1px 0px #333;
}
h1.brand{
font-size:50px;
font-family: 'Oleo Script', cursive;
text-shadow: 0px 2px 3px #f4f4f4;
}
.header span.red{color:#f20000;}
.header span.white{color:#fff;}

.content{padding:2%;color:#f4f4f4;}
.content p{margin:10px 0}
.footer{
padding:5% 2%;
width:95%;
position:absolute;
overflow:hidden;
color:#f4f4f4;
}
.footer-left{
position:relative;
width:45%;
float:left;
}
.footer-right{
text-align:right;
position:relative;
width:45%;
float:right;
}
Sekian tutorial kali ini, silahkan tuliskan jika ada masukan atau pertanyaan. Tentang Membuat website full color in background

Cara membuat form login , logout , dan daftar dengan Mysql

CARA MEMBUAT FORM LOGIN, LOGOUT, DAFTAR DENGAN PHP MYSQL




Disini saya akan membagi postingan bagaimana cara membuat sebuah form login, daftar, dan logout dengan PHP MySQL, mungkin sahabat semua ada yang sudah tidak asing lagi dengan bahasan ini, yuk langsung saja kita simak bersama sama ..

Terlebih dahulu buatlah database, dalam contoh ini saya menggunakan phpMyAdmin.
Buat database dengan nama “latihan”.

Buat tabel dengan nama “user” dan isikan 3 untuk jumlah kolom yang akan dibuat.

Kemudian isikan ke 3 kolom yang telah dibuat tadi seperti berikut :

Jika sudah silahkan tekan tombol save untuk menyimpan field yang telah kita isikan.
Apabila langkah diatas telah dilalui berati database telah selesai dibuat dan siap digunakan. Langkah berikutnya adalah membuat form dan proses PHP ke database MySQL.

Disini diperlukan beberapa file yang harus dibuat.

koneksi.php
index.php
daftar.php
prosesdaftar.php
login.php
proseslogin.php
logout.php
Sebelum ke pembuatan form daftar dan login saya minta untuk membuat file koneksi.phpuntuk menghubungkan ke database, dengan kode dibawah ini.

<?php
$host = "localhost";
$user = "root";
$pass = "";
$db = "latihan";
$konek = mysql_connect($host, $user, $pass) or die ('Koneksi Gagal! ');
mysql_select_db($db);
?>

Pertama buatlah file dengan nama index.php dimana file ini akan ditampilkan ketika login sukses, isikan dengan kode dibawah :

<?php
session_start();
if(!isset($_SESSION['username'])) {
header('location:login.php'); }
else { $username = $_SESSION['username']; }
require_once("koneksi.php");

$query = mysql_query("SELECT * FROM user WHERE username = '$username'");
$hasil = mysql_fetch_array($query);
?>
<html>
<head>
<title>Halaman Sukses Login</title>
</head>
<body>
<center>
<?php
echo "<h2>Selamat Datang, $username </h2>";
?>
<a href="logout.php"><b>Logout</a>
</center>
</body>
</html>

Buatlah file dengan nama daftar.php dan isikan dengan code dibawah ini.

<?php
session_start();
if(isset($_SESSION['username'])) {
header('location:index.php'); }
?>
<html>
<head>
<title>Form Pendaftaran</title>
</head>
<body>
<center>
<form action="prosesdaftar.php" method="post">
<table>
<tr><td colspan="2" align="center"><h1>Daftar Baru</h1></td></tr>
<tr><td>Username</td><td> : <input type="text" name="username"></td></tr>
<tr><td>Password</td><td> : <input type="password" name="password"></td></tr>
<tr><td colspan="2" align="right"><input type="submit" value="Daftar"> <input type="reset" value="Batal"></td></tr>
<tr><td colspan="2" align="center">Sudah Punya akun ? <a href="login.php"><b>Login</b></a></td></tr>
</table>
</form>
</center>
</body>
</html>

Sekarang buat file prosesdaftar.php untuk melakukan proses yang diminta pada file daftar.php.

<?php
require_once("koneksi.php");
$username = $_POST['username'];
$pass = $_POST['password'];
$cekuser = mysql_query("SELECT * FROM user WHERE username = '$username'");
if(mysql_num_rows($cekuser) <> 0) {
echo "Username Sudah Terdaftar!<br/>";
echo "<a href='daftar.php'>&amp;amp;laquo; Back</a>";
} else {
if(!$username || !$pass) {
echo "Masih ada data yang kosong!<br/>";
echo "<a href='daftar.php'>&amp;amp;laquo; Back</a>";
} else {
$simpan = mysql_query("INSERT INTO user(username, password) VALUES('$username','$pass')");
if($simpan) {
echo "Pendaftaran Sukses, Silahkan <a href='login.php'>Login</a>";
} else {
echo "Proses Gagal!";
}
}
}
?>

Selanjutnya adalah membuat file login.php dengan kode dibawah.

<?php
session_start();
if(isset($_SESSION['username'])) {
header('location:index.php'); }
require_once("koneksi.php");
?>
<html>
<head>
<title>Form Login</title>
</head>
<body>
<center>
<form action="proseslogin.php" method="post">
<tr><td colspan="2" align="center"><h1>Masuk</h1></td></tr>
<table>
<tr><td>Username</td><td> : <input type="text" name="username"></td></tr>
<tr><td>Password</td><td> : <input type="password" name="password"></td></tr>
<tr><td colspan="2" align="right"><input type="submit" value="Login"> <input type="reset" value="Batal"></td></tr>
<tr><td colspan="2" align="center">Belum Punya akun ? <a href="daftar.php"><b>Daftar</b></a></td></tr>
</table>
</form>
</center>
</body>
</html&gt;

Agar file login dapat berjalan buatlah file proseslogin.php dengan kode dibawah.

<?php
session_start();
require_once("koneksi.php");
$username = $_POST['username'];
$pass = $_POST['password'];
$cekuser = mysql_query("SELECT * FROM user WHERE username = '$username'");
$jumlah = mysql_num_rows($cekuser);
$hasil = mysql_fetch_array($cekuser);
if($jumlah == 0) {
echo "Username Belum Terdaftar!<br/>";
echo "<a href='login.php'>&amp;amp;laquo; Back</a>";
} else {
if($pass <> $hasil['password']) {
echo "Password Salah!<br/>";
echo "<a href='login.php'>&amp;amp;laquo; Back</a>";
} else {
$_SESSION['username'] = $hasil['username'];
header('location:index.php');
}
}
?>

Dan yang terakhir adalah membuat file logout.php untuk menghapus session yang telah digunakan, isi dengan kode dibawah.

<?php
session_start();
unset($_SESSION['username']);
?>
<center>
<h2>Anda telah berhasil logout..</h2>
Silahkan klik <b>disini</b> untuk login kembali
</center>

Demikian yang bisa sampaikan tentang postingan kali ini, semoga bermanfaat bagi sahabat semua..Smile :)

sumber: http://nhunhuxshareilmu.blogspot.com/2013/12/cara-membuat-form-login-logout-daftar.html

Menggenal DIV dan CSS

Menggenal DIV dan CSS


DIV di gunakan untuk mendefinisikan divisi atau bagian dari suatu halaman penagturan tata letak DIV ini menggunakan CSS (Cascading Style Sheets). Sedangkan CSS adalah script yang digunakan untuk mengatur hasil tampilan halaman, misal posisi, bentuk, atau dimensi, warna, ukuran font, bentuk font dan sebagainya.
CSS sama dengan Style,

Contoh Struktur CSS adalah

[#] [.]nama id {
 /*property css*/
}
contoh;
3header{
    width:100%;
}
bisa juga:
.header{
      font-style; italic;
}

untuk lebih lengkapnya ;
contoh:::

<html>
         <tittle>
       </tittle>
       <head>
               <link href="Percobaan.css"rel="stylesheet"type="text/css"/>
       </head>
       <body>
       <div id="PageUtama">
       
         <div id="header">header halaman</div>
            <div id="conten tengah">
              <div id="konten kiri"> Menu berita</div>
                 <div id="konten kanan judul berita</div>
             </div>
        <div id="footer">>tempat copyright</div>
       </div>
     </body>

</html>

Selesai sekarang giliran anda mencoba... :D

Cara memecah File index PHP dengan dreamweaver

MEMECAH INDEX PHP KE DREAMWEAVER


Langsung saja tutorial dreamweaver kali ini yaitu memecah file index.php dengan Dreamweaver,

Buka program Adobe Dreamweaver anda, kemudian buka file index.php.

Buatlah 3 file baru, tekan Ctrl + N pilih PHP, kemudian simpan beri nama :

header.php
sidebar.php
footer.php
Setelah anda membuat ke 3 file tersebut, hapus semua kode yang ada didalamnya. Sekarang kita akan menggabungkan semua file tersebut kedalam file index.php

Kemarin susunan kode website kita sepert berikut :


<body>

<div id="header">
<a href="index.php"><img src="images/logo.png" alt="logo websiteku" border="0" /></a>
<p>Deskripsi website anda disini</p>
</div>

<div id="navigasi">
  <table border="0" cellspacing="5" cellpadding="5">
    <tr>
      <td><a href="index.php">Home</a></td>
      <td><a href="#">Profile</a></td>
      <td><a href="#">Gallery</a></td>
      <td><a href="#">Contact</a></td>
    </tr>
  </table>
</div>

<div id="conten-wrapper">
<div id="conten"></div>
<div id="sidebar"></div>
</div>

<div id="footer"></div>
</body>
Kemudian cut kode :


<div id="header">
<a href="index.php"><img src="images/logo.png" alt="logo websiteku" border="0" /></a>
<p>Deskripsi website anda disini</p>
</div>

<div id="navigasi">
  <table border="0" cellspacing="5" cellpadding="5">
    <tr>
      <td><a href="index.php">Home</a></td>
      <td><a href="#">Profile</a></td>
      <td><a href="#">Gallery</a></td>
      <td><a href="#">Contact</a></td>
    </tr>
  </table>
</div>
Paste kedalam header.php, kemudian gabungkan file header.php dengan file index.php caranya ketikkan kode berikut

1
<?php include ('header.php') ?>
letakkan di tempat kode yang anda cut tadi atau di bawah <body>

Selanjutnya kita akan menggabungkan atau menghubungkan file sidebar.php dengan file index.php. Cut kode berikut :

1
<div id="sidebar"></div>
paste kedalam sidebar.php, dan ketikkan kode berikut di bawah <div id=”conten”></div>

1
<?php include ('sidebar.php') ?>
Terakhir kita akan menggabungkan file footer.php dengan file index.php, cut kode berikut :

1
<div id="footer"></div>
Paste kedalam file footer.php, dan ketikkan kode berikut tepat di atas </body>

1
<?php include ('footer.php') ?>
Jadi dalam folder websiteku.com kita telah memiliki 4 file, yaitu :

index.php
header.php
sidebar.php
footer.php
Sedangkan untk membuat halaman yang lainnya, misalnya profile, contact, dan gallery anda tinggal mencopy file index.php kemudian ubah namanya menjadi nama halaman tersebut, dan untuk jelasnya nanti akan saya terangkan dalam tutorial dreamweaver berikutnya.

Jadi kesimpulannya jika anda memiliki ingin mengedit atau mengubah pada bagian sidebar, anda tinggal membuka file sidebar.php, dan jika anda memiliki file yang banyak anda tidak perlu merubah semua file anda, cukup sidebar.php saja yang perlu anda edit, itu karena fungsi dari include tadi.

Program bantu untuk mengakses MySQL

Program bantu untuk mengakses MySQL


Dasarnya, MySQL adalah sebuah program database clientserver yang berbasis console, berupa kode kode atau teks.

Untuk mempermudah mengakses MySQl aada beberapa program bantu antaralain

  1. MySQL Ouery Browser
    MySQL Ouery Browser sudah terpaket dalam Program MySQLGUITools.
    namun jika anda ingin meng update program tersebut, dapat anda download pada
    http://dev.mysql.com/downloads/#mysql-tools
untuk cara menginstalnya:
setelah anda mendownload program bantu tersebut silahkan untuk mengikuti perintah instalasi yang benar:
  • jalankan file installer mysql-gui-tools-xx-xx-win32.msi , lalu klik next
  • pilih acccept in terms lincense agreement, lalu next
  • pilih folder yang dituju
  • pilih complete atau anda juga dapat menentukan file-file instalasi dengan memilih costum, lalu klik next
  • selanjutnya klik install
  • selesai
Setelah instalasi selesai , buka program MySQL Query Browser. isi kolom server host dengan nama localhost, kolom username dengan root, kolom password(secara defauld password dikosongkan)
dan kolom Default Schema dengan MySQL dengan MYSQL, lalu klik OK.