Firebugs untuk desain website


Saya dalam mengedit sebuah website, sangat mengandalkan add-ons pada firefox yaitu firebugs. Karena saya bisa langsung merubah isi websitenya tinggal di letakkan mouse dimana letak website yang akan di ubah. Setelah di rubah syntax websitenya, otomatis hasilnya juga berubah, namun jika di refresh akan kembali lagi seperti semula. Jadi Anda bisa mengetahui dimana letaknya yang akan di rubah, sehingga Anda tidak perlu edit-save dan preview lagi, tapi Anda hanya menggunakan add-ons firebugs sebagai editor sementara website Anda. Setelah selesai mengedit lewat Add-ons firebugs kemudian Anda hanya mengimplementasikan hasil editan Anda ke editor sesungguhnya (di cpanel, atau di halaman Admin website Anda)

Download add-ons firebugs pada firefox disini. Setelah install restart firefox. Untuk mengaktifkan add-ons tekan tombol F12. Untuk saat ini, add-ons firebugs belum support buat firefox 4, jadi disarankan pake firefox yang versi di bawah 4 atau versu 3.6xx.

Preview :

Advertisements

Cara upload website di hosting


Setelah selesai membuat website secara offline, tahap selanjutnya adalah mengupload website ke hosting. Proses uploading website, ada banyak cara yang bisa digunakan, misalnya menggunakan cpanel/vista panel (pada menu filemanager), menggunakan FTP (fireFTP, filezilla) dan lain lain.

Upload website menggunakan cpanel/vistapanel (file manager)

– Pertama-tama Anda harus siapkan terlebih dahulu file-file website Anda, kemudian kompress menjadi 1 file berformat zip

– Login ke cpanel/vista panel

– Pilih menu “File manager” atau “Online File Manager”

– Pilih letak letak domain dimana website akan diupload di domain Anda

– Masuk ke folder htdocs/public_html

– Klik upload

– Kalau sudah selesai, cek website Anda

 

Upload website via FTP (filezilla/fireftp) => menyusul ya.. heheh 🙂

Kirim hasil inputan dari form ke email dengan PHP


Biasanya data hasil inputan, akan di kirim ke database. Namun ada alternatif lain untuk menyimpan data hasil inputan, yaitu bisa menggunakan email.

Setelah data di input, kemudian akan di kirimkan ke email.

Caranya adalah :

– Buat form yang akan di inputkan, dengan action=”input.php” (fungsinya, nanti jika data di submit, maka data akan di proses ke dalam file input.php)

– Buat file input.php dan letakkan ke dalam satu folder dengan file lainnya, kodenya :

<?php
$warna = $_POST[‘warna’];
$ukuran = $_POST[‘ukuran’];
$posisi = $_POST[‘posisi’];
$gambar = $_POST[‘id_gambar’];
$to = “alamatemail@abcde.com“;
$subject = “Desain Kaos”;
$message .= “warna : $warna \n”;
$message .= “ukuran : $ukuran \n”;
$message .= “posisi : $posisi \n”;
$message .= “gambar : $gambar \n”;
$mail_sent = @mail( $to, $subject, $message );

?>

Saya misalkan, data yang akan saya kirim adalah warna, ukuran, posisi dan id_gambar

– Simpan filenya dan dicoba

Membuat Related Post di WordPress tanpa Plugin


Pada website, sering ditemukannya related post yang letaknya di bawah artikel. Fitur ini digunakan agar para pembaca mengetahui, apa saja artikel yang terkait didalam kategori yang sama. Sehingga pembaca akan lebih lama mengakses website Anda

Cara memasangnya adalah :

– Login dulu di website Anda, sebagai Admin tentunya

– Masuk ke bagian appearance – editor

– Pilih file single post (single.php)

– masukkan kode berikut di setelah kode  <?php edit_post_link……>?

<?php
$tags = wp_get_post_tags($post->ID);
if ($tags) {
	$tag_ids = array();
	foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;

	$args=array(
		'tag__in' => $tag_ids,
		'post__not_in' => array($post->ID),
		'showposts'=>5, // Number of related posts that will be shown.
		'caller_get_posts'=>1
	);
	$my_query = new wp_query($args);
	if( $my_query->have_posts() ) {
		echo '<h3>Related Posts</h3><ul>';
		while ($my_query->have_posts()) {
			$my_query->the_post();
		?>
			<li><a href="<?php the_permalink() ?>" rel="bookmark" 
                       title="Permanent Link to <?php the_title_attribute(); ?>">                   
                       <?php the_title(); ?></a></li>
		<?php
		}
		echo '</ul>';
	}
}
?>

– Klik Update file dan lihat hasilnya

Menambahkan User di Website PHP


Dalam website, sering menggunakan user dalam fitur websitenya. Sehingga website tersebut bisa di update oleh user-user yang telah terdaftar.

Untuk membuatnya, Anda bisa menggunakan PHP dan MySQL. Langkah-langkahnya adalah :

1. Membuat halaman registrasi user, simpan dengan file register.php

Contoh form yang akan digunakan :
<form method=”post” action=”save_user.php“>

<br/>

<table align=”center”>

<tr>

<td>Username</td>

<td><input name=”username” type=”text” size=”33″ /></td>

</tr>

<tr>

<td>Password</td>

<td><input name=”password” type=”password” size=”33″ /></td>

</tr>

<tr>

<td>Nama Lengkap</td>

<td><input name=”nama_lengkap” type=”text” size=”33″ /></td>

</tr>

<tr>

<td>Email</td>

<td><input name=”email” type=”text” size=”33″ /></td>

</tr>

<tr>

<td></td>

<td><input type=”submit” name=”Submit” value=”Submit” /></td>

<tr/>

</table>

</form>
Contoh tampilannya :

Untuk form bisa Ana tambahkan sendiri


2. Membuat file save_user.php


<?php

$username = $_POST[‘username’];

$password = $_POST[‘password’];

$nama_lengkap = $_POST[‘nama_lengkap’];

$email = $_POST[’email’];

include(“koneksi.php“);

if ($username != “” and $password != “”){

$query=mysql_query(“INSERT INTO pengguna (username,password,nama_langkap,email) VALUES (‘$username’,’$password’,’$nama_lengkap’,’$email’)”);

}

header( “Location: berhasil.php” ) ;

?>
— Buat file berhasil.php, jika ingin ditambahkan sebagai pesan bahwa telah berhasil membuat user

masukkan kode :
<p align=”center” style=”font-weight: bold”><blink>Pendaftaran Berhasil, Silahkan login</blink></p>

3. Membuat file koneksi.php

<?php

mysql_connect(“host“,”user_db“,”pass_db“);

mysql_select_db(“name_db“);
host : nama host pada server database

user_db : nama user yang digunakan pada database

pass_db : password database

name_db : nama database yang digunakan

4. Membuat database

– Buka phpMyAdmin (jika menggunakan xampp / local buka alamat http://localhost/phpmyadmin/)

– Create new database = Masukkan nama database yang akan dibuat kemudian klik create

– Jika berhasil, maka akan muncul tulisan (“Database coba has been created.”)

– Kemudian membuat tabel user (sesuaikan dengan form yang telah di buat)

— name : tempat masukan nama tabel

— number of fields : jumlah kolom yang akan di buat (sesuaikan dengan form yang akan di buat)

– Isikan kolom berikut dengan nama-nama berdasarkan pada form yang telah di buat pada file register.php

– Bisa juga menggunakan query SQL berikut ini
CREATE TABLE `coba`.`pengguna` (

`id` INT( 2 ) NOT NULL AUTO_INCREMENT PRIMARY KEY ,

`username` VARCHAR( 50 ) NOT NULL ,

`password` VARCHAR( 50 ) NOT NULL ,

`nama_langkap` VARCHAR( 50 ) NOT NULL ,

`email` VARCHAR( 50 ) NOT NULL

)

5. Membuat halaman login, masukkan kode berikut kemudian simpan sebagai menu_login.php

<?php

if(!isset($_SESSION[‘username’]))

{

?>

<form action=”login.php” method=”post”>

<p align=”left” class=”style2″>

Username<br/><input type=”text” name=”username” />

Password<br/><input type=”password” name=”password” />

<input type=”submit” name=”Submit” value=”Login” />

</p>

Tidak Punya Akun? <br/>

<a href=”register.php”>Register</a>

<br/>

</form>

<?php

} else {

echo “<br />You are logged in as <b>”.$_SESSION[‘username’].”</b>”;

?>

<form action=”logout.php” method=”post”>

<input type=”submit” value=”logout”>

</form>

<?php

}

?>

6. Buat file login.php


<?php

$username = $_POST[‘username’];

$password = $_POST[‘password’];

include(“koneksi.php“);

$query=mysql_query(“SELECT * FROM pengguna WHERE username=’$username’ AND password=’$password'”);

while ($record=mysql_fetch_array($query)){

session_start();

$_SESSION[‘username’]=$username;

}

header( “Location: index.php” ) ;

?>

7. Buat file logout.php

<?php

session_start();

session_destroy();

header( “Location: index.php” ) ;

?>

8. Jangan lupa masukkan kode berikut di setiap halaman

<?php session_start(); ?>
====================================================

++++++++++++++++++  Selamat Mencoba ++++++++++++++++++

====================================================

Cara Membuat Website di 000webhost


Tempat gratisan yang paling sering digunakan untuk membuat website adalah di http://www.000webhost.com, karena fiturnya hampir sama dengan hostingan yang berbayar, yaitu sudah menggunakan cpanel bukan vistapanel yang sering digunakan oleh hostingan byethost family.

Oke langsung saja caranya :

1. Daftar di websitenya : http://www.000webhost.com/order.php

  • Masukkan alamat website Anda, disarankan menggunakan sub domain yang telah di sediakan, misalnya untuk contoh gambar diatas net78.net, misalnya saya masukkan cobacoba, maka alamat website hasilnya adalah http://cobacoba.net78.net
  • Untuk password, dianjurkan menggunakan huruf dan angka, misalnya = password123
  • Kalau sudah selesai mengisi form, klik centang pada I gree to Terms of  Service kemudian klik Create My Account
  • Klik Activate Account
  • Tunggu Email Aktivasinya, maksimal 24 jam setelah registrasi
  • Untuk Detail akun, bisa Anda lihat di email
  • Cara Backup Website


    Seperti halnya data pada komputer, website juga perlu dilakukan backup secara rutin untuk menghindari hilangnya data / kerusakan pada website yang mungkin sewaktu waktu akan terjadi, misalnya di hack orang, salah konfigurasi, atau ada file yang terhapus dan masalah-masalah lainnya. Nah langsung saja langkah-langkahnya adalah :

    1. Login ke cpanel website yang akan di backup

    2. Backup dulu Databasenya, klik backup

    3. Pilih database yang akan di download

    4. Seteleh selesai download, sekarang backup file website, masuk ke menu file manager

    5. Pilih website yang akan di backup, jangan lupa kasih centang pada Show Hidden Files (supaya file yang tersembunyi bisa kelihatan dan masuk ke file backup an)

    6. Setelah masuk ke file manager, klik select all

    7. Pastikan semua file terseleksi, kemudiam klik compress

    8. Setting tipe file backup dan nama filenya

    Compressed type : file hasil kompresan, bisa zip, tar, dll

    kemudian ganti nama file hasil kompresan (ada pada gambar yang di blok) selanjutnya klik compress file(s)

    9. Tunggu hingga selesai proses compressing

    10. Setelah selesai, klik close

    11. Cari nama file yang baru saja di kompress, misalnya tadi saya kasih nama namafileyangdibackup.zip, kemudian download file tersebut dengan alamat http://www.namawebsiteanda.com/namafileyangdibackup.zip

    Nah, sekarang Anda sudah mendapatkan 2 file penting untuk website tersebut yaitu file database dan file isi website tersebut, mungkin suatu saat akan digunakan untuk merestore website Anda jika nanti akan terjadi kerusakan.  Selamat mencoba !!!

    Pasang Theme di Drupal


    Setelah instalasi selesai, langkah selanjutnya adalah mengganti theme bawaan pada drupal dengan hasil theme yang kita buat sendiri atau hasil mendownload. Langsung saja cara-caranya :

    1. Login dahulu di website drupal Anda, tentunya login sebagai admin

    2. Setelah login akan muncul menu-menu seperti berikut, kemudian klik appearance

    3. Klik Install New Theme

    4. Upload theme !

    Install from a URL = alamat url theme yang sudah di upload di lain tempat [jika theme sudah di upload di hostingan]

    Upload a module or theme archieve to install = upload dari komputer

    5. Kemudian klik Install

    Jika theme benar, maka akan muncul proses seperti ini :

    Jika sukses, maka akan tampil seperti ini :

    6. Setting theme yang baru saja di upload, Klik Enable newly added themes

    7. Cari theme yang baru saja di upload kemudian Klik Enable and set default [misalnya saya memakai theme Zen]

    8. Lihat hasilnya, buka alamat website drupal Anda

    #Selamat Mencoba

    Menyembunyikan Link/Gambar Messages Pada Thread di PHP Fusion


    Pada php fusion, secara default, akan menampilkan identitas para member di forum. Setiap membuka thread/postingan member, dibawahnya akan ada nama website,pm dll. Pada PM (messages), jika belum login kan muncul, namun ketika di klik akan otomatis dialihkan ke index.php (karena hanya member yang sudah login yang bisa masuk). Nah dari pada gak ada gunanya, sebaiknya di sembunyikan hanya untuk member saja yang bisa melihatnya.

    Caranya adalah :

    1. Login di cpanel kemudian masuk ke file manager

    2. Buka file public_html/infusions/fusionboard4/includes/fusion.php

    3. Cari kode “pm” (tanpa tanda petik)

    4. Kemudikan akan ketemu kode :

    echo “<a href='”.BASEDIR.”messages.php?msg_send=”.$data[‘user_id’].”‘><img src='”.get_image(“pm”).”‘ alt='”.$locale[‘572’].”‘ style=’border:0;vertical-align:middle’ /></a>\n”;

    5. Sisipkan kode berikut sebelum kode tadi:

    if (iMEMBER){

    6. Sisipkan kode berikut setelah kode tadi

    }

    7. Hasilnya adalah :

    if (iMEMBER){
    echo “<a href='”.BASEDIR.”messages.php?msg_send=”.$data[‘user_id’].”‘><img src='”.get_image(“pm”).”‘ alt='”.$locale[‘572’].”‘ style=’border:0;vertical-align:middle’ /></a>\n”;
    }

    8. Simpan dan lihat hasilnya

    #Selamat Mencoba

    About Drupal


    Saya mengenal drupal sudah sejak lama, setelah mengenal CMS Joomla dan WordPress. Namun mencobanya belum lama ini setelah ada acara Drupal 7 Release Party yang diadakan

    Tanggal : 7 Januari 2011
    Tempat : University Club UGM ruang Yustisia
    Lokasi : Yogyakarta, Indonesia

    Setelah acara itu, saya tertarik  untuk mencobanya karena banyak mengatakan bahwa drupal :

    • Satu-satunya CMS yang dipakai oleh banyak perusahaan besar: McD, Walt Disney, Sony UK
    • Dipake oleh instansi pemerintah: White House, Obama, Hillary Clinton
    • Security terbukti ampuh
    • Mendukung Relasi antar Tabel, Multi Language, Unlimited Categories Deep
    • API yang canggih
    • Mendukung Database: MySQL, PostgreSQL, MS SQL, Oracle, dll
    • System modular yang sangat praktis
    • Layout yang sangat flexible
    • Mampu membuat Laporan secara online (tanpa programming skill)

    http://drupal-id.com

    Setelah mencobanya, ternyata memang benar apa kata diatas :).

    Oke, kiranya sampai disini dulu postingan saya, lain kali akan saya posting beberapa artikel tutorial drupal :> .