Powered by Blogger.
RSS
Showing posts with label PHP Code. Show all posts
Showing posts with label PHP Code. Show all posts

Setting G-Zip encoding untuk speed load dan SEO blog


Saat membuka halaman website (blog),  sebenarnya Anda meminta browser (e.g. Google Chrome / Firefox) untuk menampilkan file /index.html (secara default merupakan heavy file). Sebelum menampilkannya, browser terlebih dahulu request file /index.html ke web server website Anda agar mengirim file /index.html tersebut.

Terkait setting G-Zip Encoding untuk mempercepat loading laman web dan untuk memperbaiki SEO (Search Engine Optimization), kerjasama Server dan Browser punya rumus simpel, yaitu :

Smaller file = faster download = happy user.

KIta dapat mengatur setting web server dengan mengubah heavy file /index.html yang size terlalu besar dengan mengubahnya ke file ZIP. Jika web server bisa mengirim file zip. Ke browser (index.html.zip), MAKA akan menghemat bandwidth dan waktu download. Browser bisa lakukan download file zip, mengekstrak, lalu  menunjukkan ke user browser dan memuat webpage tersebut lebih cepat.

Percakapan antara Browser dengan Web Server saat request file /index.html yang dikompresss (diubah ke file ZIP) kurang lebihnya seperti terlihat di bawah ini :

skema HTTP-request-response-compressed file index

  1. BROWSER : Hei! Bisakah saya dapatkan /index.html?  Saya ingin versi compres jika Anda bisa lakukan.
  2. SERVER : Coba saya lihat.  Yup! Ini dia. Anda ingin compressed version? Ini dia, keren!.
  3. SERVER : Saya telah temukan /index.html, dan kini saya jadikan file zip dan kirimkan ke Anda.
  4. BROWSER : Great! Bagus! Ukuran file zip menjadi hanya 10KB. Saya akan unzip dan menunjukkannya ke pengguna saya.

Bagaimana Cara Setting G-Zip Encoding?

Kita sebagai User tidak dapat mengkontrol Browser, namu user dapat mengkonfigurasi Web Server terkait dengan content file ZIP, sehingga browser bisa mengatasi speed loading, menghemat bandwidth untuk semua orang HINGGA blog kita memberikan ke user rasa senang dan good user experience.

Jika menggunakan Web Server IIS, Anda perlu mengaktifkan kompresi dalam pengaturan.

  • Pengguna Web Server Apache memungkinkan kompresi output cukup mudah. Tambahkan baris berikut ke file  .htaccess dalam web server Anda :

    # compress text, html, javascript, css, xml:
    AddOutputFilterByType DEFLATE text/plain
    AddOutputFilterByType DEFLATE text/html
    AddOutputFilterByType DEFLATE text/xml
    AddOutputFilterByType DEFLATE text/css
    AddOutputFilterByType DEFLATE application/xml
    AddOutputFilterByType DEFLATE application/xhtml+xml
    AddOutputFilterByType DEFLATE application/rss+xml
    AddOutputFilterByType DEFLATE application/javascript
    AddOutputFilterByType DEFLATE application/x-javascript

    # Or, compress certain file types by extension:
    <files *.html>
    SetOutputFilter DEFLATE
    </files>

Web Server Apache memiliki 2 opsi metode kompresi HTTP :

  • mod_deflate, opsi set up standard yang lebih mudah.
  • mod_gzip, opsi lebih powerful: Anda dapat melakukan pre-compress content.

Dibandingkan dengan mod_deflate, mod_gzip memberikan rasio kompresi HTTP yang lebih besar. Artinya mod_gzip lebih baik daripada mod_deflate.

Mod_gzip secara otomatis bekerja pada server apache.  Mod_gzip menghemat bandwidth dengan cara mengkompresi bodi respon HTTP sebelum dikirimkan ke BROWSER. Rata-rata browser modern bisa membaca respon yang terkompresi. Perbandingan jumlah request teks (HTML, txt, js, css) dan gambar (gif, jpg, swf) untuk sebuah situs tipikal adalah 1:1 hingga 1:3, dan gzip dapat mengkompresi teks hingga 50%-80%. Maka pengiritan trafik outgoing web yang diperoleh rata-rata bisa berkisar antara 10%–35%. Dan total penghematan bandwidth yang diperoleh antara 4%–15%.

Agar deflate (perampingan) heavy file /index.html berlangsung cepat dan bekerja, gunakan opsi mod_gzip. Apache juga memeriksa apakah browser mengirimkan "Accept-encoding" header dan mengembalikan versi kompresi ataupun versi reguler dari file. 

Bagaimana jika kita tidak dapat mengubah (memodifikasi) file .htaccess?

Jika Anda tidak dapat mengubah file htaccess., Anda dapat menggunakan PHP. Gunakan PHP untuk mengembalikan compressed content. Berikan file HTML dengan .php extension, dengan menambahkan kode berikut ini di bagian atas file HTML Anda :

<?php if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) ob_start("ob_gzhandler"); else ob_start(); ?>

Syarat-syarat untuk dapat menggunakan metode kompresi HTTP di atas adalah browser dan server harus mendukung. Khusus untuk mod_gzip, PHP yang digunakan harus versi 4.0.6 hingga terbaru. Untuk dapat mengetahui versi PHP pada server yang kita gunakan, buat sebuah file php (contoh: info.php), kemudian ketikkan kode berikut:

<?php
phpinfo ();
?>

Kemudian simpan dan uploadlah file tersebut ke root direktori wordpress. Kemudian buka file tersebut melalui browser yang kita gunakan. Contoh: http://nama-domain.com/info.php  Disini akan terlihat informasi lengkap PHP yang ada di server. Kita bisa mencari fitur-fitur yang terintegrasi di dalamnya.

Verify Your Compression

Setelah melakukan konfigurasi web server, silahkan periksa untuk memastikan ada compressed content.

  • Online : GUNAKAN online gzip test untuk memeriksa apakah halaman web Anda telah compressed.
  • Pada browser : GUNAKAN Web Developer Toolbar >> Information >>  View Document Size UNTUK melihat apakah halaman web Anda telah compressed.
  • View the headers : GUNAKAN Live HTTP Headers UNTUK memeriksa response. Carilah baris yang berisi frase  "Content-encoding: gzip".

Hasilnya sangat mengagumkan! Misalnya, ukuran (size) instacalc homepage dapat menyusut ukurannya dari 36kb ke 10kb, atau penyusutan ukuran sampai 75%.

Try Some Examples

Untuk dicoba, bukalah downloadable example:

  • index.html - No explicit compression (pada server ini digunakan compression by default ).
  • index.htm - Explicitly compressed with Apache. File .htaccess menggunakan .htm sebagai rule
  • index.php - Explicitly compressed using the PHP header

Jangan ragu untuk men-download contoh-contoh file di atas. Tempatkan mereka pada server Anda dan tweak pengaturan.

PERINGATAN

HTTP Compression tidak selalu bekerja baik dan menyenangkan karena masalah ini :

  • Older browsers sering ada trouble terkait dengan compressed content.
  • Already-compressed content : Image, musik dan video telah compressed. Jangan buang-buang waktu mengkompres lagi. Anda hanya perlu kompres untuk “the big 3" (HTML, CSS and Javascript).
  • CPU-load
    Mengkompres content on-the-fly menggunakan waktu CPU dan menghemat bandwidth. Biasanya ini adalah tradeoff yang besar mengingat kecepatan kompresi. Ada cara untuk pra-kompres content statis dan mengirimkan versi terkompresi. Hal ini memerlukan konfigurasi lebih. Menggunakan siklus CPU untuk pengalaman user yang lebih cepat adalah layak, mengingat rentang perhatian yang pendek di web.

Mengaktifkan kompresi adalah salah satu cara tercepat untuk meningkatkan kinerja situs Anda. Lakukan dan biarkan pengguna Anda menikmati manfaat sebagai user-experience yang baik.

Related Post : Mengatur G-Zip Encoding untuk percepat Speed Loading

Source :   How To Optimize Your Site With GZIP Compression


  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Basic PHP : Latihan Sederhana – Bagian 2


Selayang Pandang

PHP ditemukan Rasmus Lerdorf tahun 1995. PHP merupakan free software di-release dibawah PHP License, yang tidak compatible dengan GNU General Public License (GPL) karena restriksi dalam penggunaan term PHP.

PHP merupakan script yang dijalankan di Server. Manfaat penggunaan PHP adalah code yang menyusun program tidak perlu diedarkan ke user sehingga kerahasiaan code terlindungi. Hal yang menarik adalah PHP bisa digunakan untuk akses atau support bermacam database seperti Access, Oracle, MySQL etc. Salah satu persyaratan teknis penggunaan PHP adalah website harus beli domain name dan menyewa web server karena mengakses PHP via Control Panel.

Pada bagian 1, membicarakan macam variable dan tipe data, beserta latihan 1 - 4 untuk penggunaan Parsing Variabel via Form dan Parsing Variable via Link. Kita juga akan mengulas Pernyataan (Statement) Program.

BAGIAN 1                     BAGIAN 2                         BAGIAN 3                         BAGIAN 4

Pernyataan Kontrol

Pernyataan IF

Pernyataan if pada PHP berguna untuk melakukan Decision Making terhadap lebih dari 1 alternatif. Bentuknya :
  • If
  • If else
  • If elseif
A.     Bentuk pernyataan if paling sederhana

If (ekspresi) {
              pernyataan;
}

Penjelasan :
Bagian pernyataan akan dijalankan kalau bagian ekspresi bernilai benar.
Bila jumlah pernyataan yang akan dijalankan if lebih dari 1 (satu)

If (ekspresi) {
              pernyataan satu;
              … … …
              Pernyataan_n;
}

B.     Bentuk If – else

B.1.  Bentuk ini melibatkan bagian else, formatnya berikut ini :

If (ekspresi) {
              pernyataan X;
else
              Pernyataan Y;
}

Bagian pernyataan_1 akan dijalankan jika ekspresi bernilai benar. Jika bernilai salah maka dijalankan pernyataan_2.

B.2.   Jumlah pernyataan yang akan dijalankan If atau else lebih dari satu, maka bentuknya adalah :

If (ekspresi) {
              Pernyataan X1;
              … … … 
              Pernyataan Xn;
} else {
             Pernyataan Y1;
             … … … 
             Pernyataan Yn; 
}  

B.3.   Bentuk ini digunakan untuk mengambil keputusan yang melibatkan banyak alternatif.

If (ekspresi) {
              Pernyataan_1;
             … … … 
             Pernyataan_n;
}
else if (ekspresi2) {
             Pernyataan_1;
             … … … 
             Pernyataan_n;
}
… … … 
else {
             Pernyataan_1;
             … … … …
             Pernyataan_n;
}

Latihan5.php (Latihan Bentuk If – else)
<HTML>
<HEAD>
<TITLE> Latihan kelima </TITLE>
</HEAD>
<BODY>
<?
$nama_hari=date("l");  If ($nama_hari=="Monday"){
print"Hari ini hari Senin";
} else{
}
print"Hari ini bukan hari Senin";
       ?>
</BODY>
</HTML>


Pada latihan diatas dibuat program konversi hari English ke hari Indonesia.

Pernyataan Switch

Pernyataan ini berfungsi menyeleksi sejumlah alternatif. Bentuk umumnya sebagai berikut :

switch (ekspresi){
case ekspresi_case_1 :
pernyataan_1;
break;
case ekspresi_case_2 :
pernyataan_2;
break;
…
default :
pernyataa/n_n;
}

Kegunaan break untuk mengarahkan eksekusi ke akhir switch. Setiap case bisa mengandung lebih dari 1 pernyataan, antar pernyataan dipisahkan dengan titik-koma. Bagian default akan dieksekusi kalau tidak ada yang cocok pada bagian case.

Latihan6.php
<HTML>
<HEAD>
<TITLE> Latihan keenam </TITLE>
</HEAD>
<BODY>
<?
$nama_hari=date("l");
switch ($nama_hari){
case "Sunday" : 
print"Hari ini hari Ahad";
break;
default :
print"Hari ini bukan hari Ahad"; }
?>
</BODY>
</HTML>


Pada latihan diatas dibuat konversi hari English ke hari Indonesia.
Pernyataan Perulangan

Pernyataan While

Pernyataan while berguna untuk melakukan suatu perulangan. Bentuknya :

while (ekspresi){
                pernyataan_pernyataan;
}

Pernyataan For

Sebagaimana while, pernyataan for berguna untuk perulangan. Bentuknya

for (ekspresi1; ekspresi2; ekspresi3){                                                 pernyataan_pernyataan;   }
  • ekspresi1 untuk memberi nilai awal variable yang digunakan untuk melakukan pencacahan pengulangan.
  • ekspresi2 untuk menentukan repetisi pernyataan yang ada dalam tanda 2 kurung kurawal ( { … } ) akan dilakukan atau tidak.
  • ekspresi3 untuk mengatur nilai variable yang digunakan dalam ekspresi1.
Latihan7.php
<HTML>
<HEAD>
<TITLE> Latihan ketujuh </TITLE>
</HEAD>
<BODY> 
<? 
for ($i=1;$i<=7;$i++){
print"<FONT SIZE=\"$i\" COLOR=\"silver\" FACE=\"Verdana\">$i</FONT>
<BR>";
}
?>
</BODY>
</HTML>
Latihan8.php
<HTML>
<HEAD>
<TITLE> Latihan kedelapan </TITLE>
</HEAD>
<BODY> <?
$i=1;
while ($i<=7){
print"<FONT SIZE=\"$i\" COLOR=\"silver\" FACE=\"Verdana\">$i</FONT>
<BR>";
$i++;
}
?>
</BODY>
</HTML>

Latihan sendiri
Buat program dengan tampilan seperti latihan sebelumnya tapi menggunakan while


Bersambung ke :  Bagian 3                    atau                  Kembali :  Bagian 1


  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

A trick of Prestashop : Direct to Payment Step after Login in Order Page

 

Secara default CMS Prestashop menawarkan proses berbelanja dalam 5 tahap, yaitu :

1.   RESUME/ Kesimpulan : Ketika Anda klik produk-produk untuk dibeli akan dihasilkan list belanjaan.
2.   LOGIN. Ini untuk melanjutkan transaksi. Untuk member, hanya perlu ketik email dan password Anda.
3.   ALAMAT. Pada tahap ini dikonfirmasikan alamat tujuan pengiriman barang.
4.   PENGIRIMAN. Pada tahap ini fitur jasa kurir yang dipilih (JNE) akan mengenali alamat tujuan.
5.   PEMBAYARAN. Pada tahap terakhir ini Anda diarahkan ke cara pembayaran. Atau lebih spesifik lagi
      akan ditampilkan daftar rekening bank untuk menerima pembayaran.

image

Pada topik ini kita akan menyederhanakan transaksi toko online dengan menghapus step pengiriman (shipping) dari 5 tahapan transaksi : Ringkasan / Kesimpulan ---> LOGIN ---> ALAMAT ---> SHIPPING (Pengiriman) --->PEMBAYARAN.

(Setelah pengunjung mengeksplorasi produk dan klik-klik produk yang diminati, selanjutnya dia hanya perlu LOGIN untuk mencantumkan ALAMAT Tujuan pengiriman barang yang dibeli dan bisa langsung transfer uang sebesar harga barang + Ongkos kirim dan melakukan konfirmasi bahwa telah dilakukan pembayaran).

Skip Shipping Step :

  1. Buka file order.php pada root directory. Pada baris ke 85, Anda akan melihat script yang ditulis dengan switch blahblahblah.

    Anda lihat ada case 1 : displayAddress().

    Silahkan diblokir (Block) baris tersebut dengan menambahkan “ // “ di depannya dan tulis baris lainnya seperti dibawah ini :

    case 1: displayPayment(); //displayAddress(); break;

    Tindakan ini akan menjadikan user (pembeli online) akan dibawa langsung ke Payment Choice (tahap metode pembayaran).

  2. Kemudian Anda buka file order-steps.tpl dalam themes directory pada root directory (public.html).  Kemudian tambahkan baris ini : <!– and end with –> ke baris 39

    <!-- 
    {if $current_step=='payment' || $current_step=='shipping'}
            {l s='Address'}
            {else} 
            {l s='Address'}
            {/if}
    -->
    <!--  {if $current_step=='payment'} 
            {l s='Shipping'}
            {else}
            {l s='Shipping'}
            {/if}
    -->

    Sekarang step-step lain pun telah disabled (tidak aktif).

  3. Langkah penutup, Anda buka file order-payment.tpl yang juga ada dalam themes directory.

  4. Lihat baris 24 dan check baris ini :

    {$base_dir_ssl}order.php?step=2

    Gantilah angka2 dengan angka 0. Maka ketika menekan tombol “Kembali” pada layar “Payment Choose”, akan mengembalikan Anda ke halaman Daftar Belanja.



  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

PHP Code : Module Pengiriman SMS Secara Serentak


Kita akan belajar PHP bersama dan sharing ilmu dengan topik membuat aplikasi untuk mengirim pesan Sekaligus ke banyak orang dengan jquery.  konsep pengiriman SMS serentak ini adalah memilih penerima yang ada di dalam database kita untuk dikirimi pesan. Lalu bagaimana jika orang yang ingin dikirimi SMS tersebut belum terdaftar di database???  Ya, kita daftarkan dulu.
Ada 5 tahapan yang harus dilakukan :

step 1:

Membuat database untuk message-list dan membuat field dengan nama “list” dan “message”

Jangan lupa memasukkan data dummy ke dalam field list untuk mengidentifikasi namanya.
create table list (
id int(15)auto_increment,
nama varchar(255),
primary key(id)
)

create table message (
id int(15)auto_increment,
untuk varchar(255),
pesan varchar(255),
primary key(id)
)
Setelah database selesai dibuat, kemudian kita membuat form untuk mengirim pesannya.


step 2 : Membuat file index.php


<html>
<head>
<title>Message list</title>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" title="Test Stylesheet" charset="utf-8" />
<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="js/fcbkcomplete.min.js" type="text/javascript" charset="utf-8"></script>
</head>


<body id="test">
<div id='title-list'>
<h1>Message list Demo</h1>
</div>


<form action="submit.php" method="post">
<ol>
<li id="message-list">
<?
$cfr = $_GET['cfr'];


if($cfr == '1'){
echo "<center><h3>Sukses</h3></center>";
}
?>
<label>Input Name</label>
<input type="text" value="" id="message-demo" />
<ul id="preadded" style="display:none">


</ul>
<div id="message-auto">
<div>Ketik namanya</div>
<ul id="feed">


</ul>
</div>
</li>
</ol>
<div id='message-form'>
<label>Message</label>
<textarea name='message' cols='60' rows='5'></textarea>
</div>
<input type='submit' value='kirim'>
</form>


<script language="JavaScript">
$(document).ready(function() {
$.facebooklist('#message-demo', '#preadded', '#message-auto',{url:'fetched.php',cache:1}, 10, {userfilter:1,casesensetive:0});
});
</script>


</body>
</html>





step 3 : membuat file fetched.php


Selanjutnya kita membuat file fetched.php untuk include nama yang ada dalam field list, seluruh nama yang ada dalam field list akan di cetak ke dalam message input

<?
$db='db_blog_message';
$con=mysql_connect('localhost', 'root', '');
mysql_select_db($db, $con);

$q='select * from list order by nama';
$h=mysql_query($q);
echo '[';
while($r=mysql_fetch_array($h)){
echo '{"caption":"'.$r['nama'].'","value":"'.$r['username'].'"},';
}
echo ']';
?>

step 4 : membuat file submit.php

Berikutnya kita membuat file submit.php. File ini untuk insert data ke dalam field message dan kita gunakan array karena kita akan memasukan data lebih dari satu.

<?php
$db="db_blog_message";
$con=mysql_connect('localhost', 'root', '');
mysql_select_db($db, $con);

$nama = $_REQUEST;
$isi = $_POST['message'];
$data = $nama['message-demo'];

foreach ($data as $to => $val) {
$q="insert into message(untuk, pesan)values('$val', '$isi')";
$h=mysql_query($q)or die(mysql_error());

//echo $q;exit;
}
if($h){
header('location:index.php?cfr=1');
}
?>
dalam submit kita menggunakan foreach untuk mempermudah langkah kita, jangan lupa kita harus melakukan pengecekan apakah benar array kita sudah berjalan, cara untuk mengecek adalah dengan menambahkan script pada file submit.php seperti dibawah ini

echo "<pre>";
print_r($data);
echo"</pre>";
hasilnya akan seperti dibawah ini  :

step 5 : membuat file css

Tahap terakhir, untuk tampilannya kita harus membuat file css-nya.

/* TextboxList sample CSS */
ul.holder { margin: 0; border: 1px solid #999; overflow: hidden; height: auto !important; height: 1%; padding: 4px 5px 0; }
*:first-child+html ul.holder { padding-bottom: 2px; } * html ul.holder { padding-bottom: 2px; } /* ie7 and below */
ul.holder li { float: left; list-style-type: none; margin: 0 5px 4px 0; }
ul.holder li.bit-box, ul.holder li.bit-input input { font: 11px "Lucida Grande", "Verdana"; }
ul.holder li.bit-box { -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; border: 1px solid #CAD8F3; background: #DEE7F8; padding: 1px 5px 2px; }
ul.holder li.bit-box-focus { border-color: #598BEC; background: #598BEC; color: #fff; }
ul.holder li.bit-input input { width: 150px; margin: 0; border: none; outline: 0; padding: 3px 0 2px; } /* no left/right padding here please */
ul.holder li.bit-input input.smallinput { width: 20px; }

/* message demo CSS */
form, #add { border: 1px solid #999; width: 550px; margin: 50px; padding: 20px 30px 10px; }
form ol li { list-style-type: none; }
form ol { font: 11px "Lucida Grande", "Verdana"; margin: 0; padding: 0; }
form ol li.input-text { margin-bottom: 10px; list-style-type: none; padding-bottom: 10px; }
form ol li.input-text label { font-weight: bold; cursor: pointer; display: block; font-size: 13px; margin-bottom: 10px; }
form ol li.input-text input { width: 500px; padding: 5px 5px 6px; font: 11px "Lucida Grande", "Verdana"; border: 1px solid #999; }
form ul.holder { width: 500px; }
form ul { margin: 0 !important }
#message-list ul.holder li.bit-box, #apple-list ul.holder li.bit-box { padding-right: 15px; position: relative; }
#apple-list ul.holder li.bit-input { margin: 0; }
#apple-list ul.holder li.bit-input input.smallinput { width: 5px; }
ul.holder li.bit-hover { background: #BBCEF1; border: 1px solid #6D95E0; }
ul.holder li.bit-box-focus { border-color: #598BEC; background: #598BEC; color: #fff; }
ul.holder li.bit-box a.closebutton { position: absolute; right: 4px; top: 5px; display: block; width: 7px; height: 7px; font-size: 1px; background: url('../images/close.gif'); }
ul.holder li.bit-box a.closebutton:hover { background-position: 7px; }
ul.holder li.bit-box-focus a.closebutton, ul.holder li.bit-box-focus a.closebutton:hover { background-position: bottom; }

/* Autocompleter */

#message-auto { display: none; position: absolute; width: 512px; background: #eee; }
#message-auto .default { padding: 5px 7px; border: 1px solid #ccc; border-width: 0 1px 1px; }
#message-auto ul { display: none; margin: 0; padding: 0; overflow: auto; }
#message-auto ul li { padding: 5px 12px; z-index: 1000; cursor: pointer; margin: 0; list-style-type: none; border: 1px solid #ccc; border-width: 0 1px 1px; font: 11px "Lucida Grande", "Verdana"; }
#message-auto ul li em { font-weight: bold; font-style: normal; background: #ccc; }
#message-auto ul li.auto-focus { background: #4173CC; color: #fff; }
#message-auto ul li.auto-focus em { background: none; }

#demo ul.holder li.bit-input input { padding: 2px 0 1px; border: 1px solid #999; }
#add a { color: #666; }
#add-test { width: 100px; padding: 2px; }
#button_container { margin-left: 70px; margin-bottom: 30px;}
.hidden { display:none;}
#message-form{ font : 14px "Lucida Grande", "Verdana";font-weight : bold;}
#title-list{margin-left : 200px;}
Modul latihan di atas bisa di-download disini (sumber Message list like facebook).






  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Struktur Dasar Prestashop dan Konfigurasi Bagian 1


Sebagai Administrator toko online kita tahu prestashop punya banyak sekali fitur untuk dioptimalkan pemakaiannya. Sebagai web designer kita bingung ada begitu banyak module yang ditawarkan. Kali ini kita bicara sebagai web designer.
Prestashop seperti juga pada semua script PHP akan memuat  website dengan menggunakan sebuah index.php. Misalnya, toko online client  saya www.bajuditoko.com  atau www.lovingprize.com menggunakan theme Prestashop. Artinya semua file  .php, .tpl, .css dan semua folder dalam CMS Prestashop akan ditempatkan pada lovingprize.com.
Maka ketika pengunjung memasukkan URL http://www.lovingprize.com pada address bar, web server pun akan memuat halaman indeks tersebut. halaman indeks ini merupakan informasi yang menentukan apa yang terjadi. Untuk memahami apa yang terjadi ketika Anda memuat toko prestashop Anda, kita perlu memahami apa itu file indeks.
INDEX.PHP
Halaman file index,php (v1.1.0.5) pada Prestashop secara garis besar meliputi kode berikut ini:


<?php
include(dirname(__FILE__).'/config/config.inc.php');
include(dirname(__FILE__).'/header.php');
$smarty->assign('HOOK_HOME', Module::hookExec('home'));
$smarty->display(_PS_THEME_DIR_.'index.tpl');
include(dirname(__FILE__).'/footer.php');
?>

Penjelasannya:
Pertama, index.php termasuk di dalamnya file config.inc.php yang terletak di direktori config.
File config.inc.php ini melakukan konfigurasi dan pengaturan setting lainnya.
File config.inc.php akan memeriksa apakah semuanya sudah terpasang (ter-install) dan mendefinisikan template dasar (base theme), default direktori dan alurnya (paths), status order dan pengaturan lainnya.
Saya tidak akan menyibukkan diri dengan penjelasan rinci. Sebagai Web Desainer, kita perlu melacak jejak error dari waktu ke waktu sehingga ada satu hal yang saya ingin membuat kita sadari bersama.
Jika Anda membuka /config /config.inc.php pada baris paling atas file Anda akan melihat ini
@ini_set('display_errors', 'off');
Jika Anda ubah menjadi :
@ini_set('display_errors', 'on');
Berarti telah mengaktifkan “Error Reporting” – tetapi harus diingat, Anda segera mengembalikannya ke status off setelah dengan itu Anda berhasil melacak error yang terjadi.  Saya tegaskan, kembalikan ke status default “off” ketika live installation. Karena kalau Anda lupa akan muncul pesan ini:
image
Kedua, config ini dimuat (loaded), maka file index.php diperintahkan untuk menyertakan file header.php dari instalasi root (root install). Yang dimaksud dengan root install berarti langsung dari situs Prestashop kita, bukan dari sesuatu yang terdapat dalam setiap sub-direktori.
File header.php secara garis besar meliputi kode-kode berikut ini:


<?php
// P3P Policies (http://www.w3.org/TR/2002/REC-P3P-20020416/#compact_policies)
header('P3P: CP="IDC DSP COR CURa ADMa OUR IND PHY ONL COM STA"');
require_once(dirname(__FILE__).'/init.php');
/* CSS */
$css_files[_THEME_CSS_DIR_.'global.css'] = 'all';
/* Hooks are voluntary out the initialize array (need those variables already assigned) */
$smarty->assign(array(
    'HOOK_HEADER' => Module::hookExec('header'),
    'HOOK_LEFT_COLUMN' => Module::hookExec('leftColumn'),
    'HOOK_TOP' => Module::hookExec('top'),
    'static_token' => Tools::getToken(false),
    'token' => Tools::getToken(),
    'priceDisplayPrecision' => _PS_PRICE_DISPLAY_PRECISION_,
    'content_only' => intval(Tools::getValue('content_only'))
));
if(isset($css_files) AND !empty($css_files)) $smarty->assign('css_files', $css_files);
if(isset($js_files) AND !empty($js_files)) $smarty->assign('js_files', $js_files);
/* Display a maintenance page if shop is closed */
if (isset($maintenance) AND (!isset($_SERVER['REMOTE_ADDR']) OR $_SERVER['REMOTE_ADDR'] != Configuration::get('PS_MAINTENANCE_IP')))
{
    header('HTTP/1.1 503 temporarily overloaded');
    $smarty->display(_PS_THEME_DIR_.'maintenance.tpl');
    exit;
}
$smarty->display(_PS_THEME_DIR_.'header.tpl');
?>


Disini saya juga tidak akan terlalu jauh membicarakan kode-kode pada file header.php diatas.
Ketiga, kita temukan ini :
$smarty->assign('HOOK_HOME', Module::hookExec('home'));
Dengan baris kode ini untuk menentukan Hook (pada dasarnya Hook memungkinkan administrator situs untuk menentukan di mana mereka ingin modul tertentu ditampilkan pada toko PrestaShop).
Keempat, selanjutnya kita temukan ini:
$smarty->display(_PS_THEME_DIR_.'index.tpl');
Baris kode ini mengatakan tentang display file index.tpl dalam posisi ini dari direktori default theme Anda. (Anda menentukan theme tersebut untuk digunakan di Back Office >>Preferances >> appearance).
Kelima, kita temukan footer.php
include(dirname(__FILE__).'/footer.php');
Baris kode ini mengatakan php ini mencakupi file footer.php dari direktori kita (dirname).
File footer.php secara garis besar memiliki kode-kode berikut ini:


<?php
if (isset($smarty))
{
    $smarty->assign(array(
        'HOOK_RIGHT_COLUMN' => Module::hookExec('rightColumn'),
        'HOOK_FOOTER' => Module::hookExec('footer'),
        'content_only' => intval(Tools::getValue('content_only'))));
    $smarty->display(_PS_THEME_DIR_.'footer.tpl');
}
?>


Setiap file-nya  mengandung permintaan PHP untuk memasukkan file lain. Tapi kita hanya peduli dengan prinsip apa yang sedang terjadi untuk memberi pemahaman bagaimana PrestaShop bekerja.
Meskipun kita punya pengaturan konfigurasi Prestashop, namun Hooks dan berbagai file php  belum memiliki HTML apapun. Di sinilah template kita (tpl) masuk.  File tpl adalah file template yang mencakup HTML dan kode Smarty. File-file tpl sebagian besar berada di direktori theme, tetapi juga ada di modul karena setiap seseorang menulis modul perlu file template sendiri (tpl) juga.

$css_files[_THEME_CSS_DIR_.'global.css'] = 'all';
if(isset($css_files) AND !empty($css_files)) $smarty->assign('css_files', $css_files);
if(isset($js_files) AND !empty($js_files)) $smarty->assign('js_files', $js_files);
$smarty->display(_PS_THEME_DIR_.'maintenance.tpl');  -  Will display a maintenance page called maintenance.tpl if your shop is closed */
$smarty->display(_PS_THEME_DIR_.'header.tpl');
Jadi file global.css kita sedang dipanggil dari direktori theme Prestashop untuk ini diperlukan file CSS lain dan juga file JavaScript yang sudah terkandung didalamnya. Tampilan HTML sebenarnya (yang merupakan bagian dari tata letak halaman web) berasal dari file header.tpl
Index.php memanggil index.tpl dan file footer.php dan juga memanggil (atau meminta) footer.tpl. Sekali lagi file-file tpl menentukan layout situs html kita dan ada dalam folder theme.
Bersambung ke >>>>    BAGIAN 2

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Prestashop : Struktur Dasar dan Konfigurasi - Bag.2


Sama seperti pada semua script PHP, Prestashop loading website menggunakan SATU file index.php. Misalnya  toko online  pakai theme Prestashop. Artinya semua file .php, .tpl, .html dan file lainnya beserta semua folder dalam CMS Prestashop ditempatkan di toko tersebut. Kita tidak membicarakan file Index.php, file .html atau .tpl secara detail. Kita hanya peduli dengan pemahaman bagaimana PrestaShop bekerja. Untuk menguatkan pemahaman saya ulang lagi esensi Bagian SATU.

CARA KERJA

Saat  Anda masukkan URL www.bajuditoko.com atau www.lovingprize.com di address bar, webserver akan loading halaman index (index.php) dan mengubahnya  menjadi informasi yang menentukan isi webpage. File index.php ini termasuk di dalamnya file config.inc.php yang ada di direktori config.
Pengaturan konfigurasi Prestashop diperankan oleh  config.inc.php untuk seluruh konfigurasi dan setting. File config.inc.php memeriksa apakah semuanya sudah ter-install dan mendefinisikan template dasar (base theme), default direktori beserta alurnya (paths), status order dan lainnya.
Misalnya, kita akan sering mengubah kode pada baris 29 isi file config.inc.php : 
@ini_set('display_errors', 'off'); menjadi @ini_set('display_errors', 'on');
untuk mengaktifkan “Error Reporting” - saat menginginkan pesan error ditampilkan di webpage untuk mengetahui diagnosa error. (setelah diagnosa didokumentasikan, segera kembalikan lagi status off).
Ketika file config (di folder config) dimuat (loaded), maka file index.php diperintahkan untuk menyertakan file header.php yang diambil langsung dari root install. Yang dimaksud dengan root install berarti langsung diambil dari Prestashop, bukan dari dalam subdirektori yang ada.
INDEX.PHP
Isi file index,php (v1.1.0.5) pada Prestashop secara garis besar meliputi kode berikut:

<?php
include(dirname(__FILE__).'/config/config.inc.php');
include(dirname(__FILE__).'/header.php');
$smarty->assign('HOOK_HOME', Module::hookExec('home'));
$smarty->display(_PS_THEME_DIR_.'index.tpl');
include(dirname(__FILE__).'/footer.php');
?>

HEADER.PHP
Isi file header.php  secara garis besar meliputi kode berikut:

<?php
// P3P Policies (http://www.w3.org/TR/2002/REC-P3P-20020416/#compact_policies)
header('P3P: CP="IDC DSP COR CURa ADMa OUR IND PHY ONL COM STA"');
require_once(dirname(__FILE__).'/init.php');
/* CSS */
$css_files[_THEME_CSS_DIR_.'global.css'] = 'all';
/* Hooks are voluntary out the initialize array (need those variables already assigned) */
$smarty->assign(array(
    'HOOK_HEADER' => Module::hookExec('header'),
    'HOOK_LEFT_COLUMN' => Module::hookExec('leftColumn'),
    'HOOK_TOP' => Module::hookExec('top'),
    'static_token' => Tools::getToken(false),
    'token' => Tools::getToken(),
    'priceDisplayPrecision' => _PS_PRICE_DISPLAY_PRECISION_,
    'content_only' => intval(Tools::getValue('content_only'))
));
if(isset($css_files) AND !empty($css_files)) $smarty->assign('css_files', $css_files);
if(isset($js_files) AND !empty($js_files)) $smarty->assign('js_files', $js_files);
/* Display a maintenance page if shop is closed */
if (isset($maintenance) AND (!isset($_SERVER['REMOTE_ADDR']) OR $_SERVER['REMOTE_ADDR'] != Configuration::get('PS_MAINTENANCE_IP')))
{
    header('HTTP/1.1 503 temporarily overloaded');
    $smarty->display(_PS_THEME_DIR_.'maintenance.tpl');
    exit;
}
$smarty->display(_PS_THEME_DIR_.'header.tpl');
?>

HOOK
Baris kode ini:
$smarty->assign('HOOK_HOME', Module::hookExec('home'));
akan menentukan Hook (Hook memungkinkan administrator situs untuk menentukan di lokasi mana mereka ingin modul tertentu ditampilkan di webpage).
DISPLAY
Baris kode ini:
$smarty->display(_PS_THEME_DIR_.'index.tpl');
mengatakan tentang tampilan  index.tpl dari direktori default theme. Prestashop (Anda menentukan theme untuk digunakan dengan pergi ke Back Office >>Preferances >> appearance).
FOOTER.PHP
Baris kode ini:
include(dirname(__FILE__).'/footer.php');
mengatakan tentang php yang mencakupi file footer.php dari direktori kita (dirname).
File footer.php secara garis besar mencakup kode berikut:

<?php
if (isset($smarty))
{
    $smarty->assign(array(
        'HOOK_RIGHT_COLUMN' => Module::hookExec('rightColumn'),
        'HOOK_FOOTER' => Module::hookExec('footer'),
        'content_only' => intval(Tools::getValue('content_only'))));
    $smarty->display(_PS_THEME_DIR_.'footer.tpl');
}
?>

FILE TPL
Setiap file diatas  terkandung request PHP untuk memasukkan file lain.  Meski ada pengaturan konfigurasi Prestashop, tapi Hooks dan file-file php  belum punya HTML. Di sinilah diperlukan peranan file tpl. 
File tpl adalah file template yang mencakup HTML dan kode Smarty.
File tpl sebagian besar ada di direktori theme, namun ada juga di modul karena setiap penulisan modul diperlukan file template (tpl) tersendiri.
Jika melihat header.php, Anda temukan bahwa file tersebut meliputi kode berikut:

$css_files[_THEME_CSS_DIR_.'global.css'] = 'all';
if(isset($css_files) AND !empty($css_files)) $smarty->assign('css_files', $css_files);
if(isset($js_files) AND !empty($js_files)) $smarty->assign('js_files', $js_files);
$smarty->display(_PS_THEME_DIR_.'maintenance.tpl');  -  Will display a maintenance page called maintenance.tpl if your shop is closed */
$smarty->display(_PS_THEME_DIR_.'header.tpl');


Isi kode diatas bisa dijelaskan sebagai berikut:
File global.css  sedang dipanggil dari direktori theme Prestashop untuk itu diperlukan file-file CSS lain dan JavaScript yang sudah terkandung di dalamnya.
$smarty->display(_PS_THEME_DIR_.'maintenance.tpl');  -  Akan menampilkan halaman pemeliharaan yang disebut maintenance.tpl jika toko online ditutup */
Tampilan HTML (yaitu bagian layout halaman web) berasal dari file header.tpl.

Kesimpulan Singkat


  • Index.php memanggil index.tpl dan file footer.php dan juga memanggil (atau meminta) footer.tpl.
  • Perlu diketahui bahwa file-file tpl menentukan layout situs html kita dan ada dalam folder theme.
  • File index.php meliputi header.php, index.tpl dan footer.tpl dari direktori theme.
  • Kemudian header.php memanggil header.tpl dan footer.php juga memanggil footer.tpl.
  • Kesimpulan akhir : HTML utama berasal dari ke-3 file template: index.tpl, header.tpl dan footer.tpl
Agar semuanya masuk akal mari kita buka header.tpl, index.tpl dan footer.tpl secara bersamaan.

Header.tpl
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="{$lang_iso}">
    <head>
        <base href="{$protocol}{$smarty.server.HTTP_HOST|escape:'htmlall':'UTF-8'}{$base_dir}" />
        <title>{$meta_title|escape:'htmlall':'UTF-8'}</title>
{if isset($meta_description) AND $meta_description}
        <meta name="description" content="{$meta_description|escape:htmlall:'UTF-8'}" />
{/if}
{if isset($meta_keywords) AND $meta_keywords}
        <meta name="keywords" content="{$meta_keywords|escape:htmlall:'UTF-8'}" />
{/if}
        <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
        <meta name="generator" content="PrestaShop" />
        <meta name="robots" content="{if isset($nobots)}no{/if}index,follow" />
        <link rel="icon" type="image/vnd.microsoft.icon" href="{$img_ps_dir}favicon.ico" />
        <link rel="shortcut icon" type="image/x-icon" href="{$img_ps_dir}favicon.ico" />
{if isset($css_files)}
    {foreach from=$css_files key=css_uri item=media}
    <link href="{$css_uri}" rel="stylesheet" type="text/css" media="{$media}" />
    {/foreach}
{/if}
        <script type="text/javascript" src="{$base_dir}js/tools.js"></script>
        <script type="text/javascript">
            var baseDir = '{$base_dir}';
            var static_token = '{$static_token}';
            var token = '{$token}';
            var priceDisplayPrecision = {$priceDisplayPrecision*$currency->decimals};
        </script>
        <script type="text/javascript" src="{$base_dir}js/jquery/jquery-1.2.6.pack.js"></script>
        <script type="text/javascript" src="{$base_dir}js/jquery/jquery.easing.1.3.js"></script>
{if isset($js_files)}
    {foreach from=$js_files item=js_uri}
    <script type="text/javascript" src="{$js_uri}"></script>
    {/foreach}
{/if}
        {$HOOK_HEADER}
    </head>
    <body {if $page_name}id="{$page_name|escape:'htmlall':'UTF-8'}"{/if}>
    {if !$content_only}
        <div id="page">
            <!-- Header -->
            <div>
                <h1 id="logo"><a href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}"><img src="{$img_ps_dir}logo.jpg" alt="{$shop_name|escape:'htmlall':'UTF-8'}" /></a></h1>
                <div id="header">
                    {$HOOK_TOP}
                </div>
            </div>
            <!-- Left -->
            <div id="left_column" class="column">
                {$HOOK_LEFT_COLUMN}
            </div>
            <!-- Center -->
            <div id="center_column">
    {/if}

Index.tpl

{$HOOK_HOME}

Footer.tpl

{if !$content_only}
            </div>
<!-- Right -->
            <div id="right_column" class="column">
                {$HOOK_RIGHT_COLUMN}
            </div>
<!-- Footer -->
            <div id="footer">{$HOOK_FOOTER}</div>
        </div>
    {/if}
    </body>
</html>



Kesimpulannya :

Kita bisa melihat SUMBER DARI HOMEPAGE (semua modulnya dalam kondisi un-instal dan ada sedikit JavaScript yang dihapus dari footer sehingga kita bisa fokus pada HTML-nya saja)  BERASAL DARI FILE TPL UTAMA.

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  <head>
    <base href="http://127.0.0.1/prestashop/" />
    <title>Prestashop demo</title>
    <meta name="description" content="Shop powered by PrestaShop" />
    <meta name="keywords" content="shop, prestashop" />
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
    <meta name="generator" content="PrestaShop" />
    <meta name="robots" content="index,follow" />
    <link rel="icon" type="image/vnd.microsoft.icon" href="/prestashop/img/favicon.ico" />
    <link rel="shortcut icon" type="image/x-icon" href="/prestashop/img/favicon.ico" />
    <link href="/prestashop/themes/commotion/css/global.css" rel="stylesheet" type="text/css" media="all" />
        <script type="text/javascript" src="/prestashop/js/tools.js"></script>
        <script type="text/javascript">
            var baseDir = '/prestashop/';
            var static_token = '8d6a4d79d983512d770333775a7d8d24';
            var token = '521aacf70fb52a35b4f94e01366c4c64';
            var priceDisplayPrecision = 2;
        </script>
        <script type="text/javascript" src="/prestashop/js/jquery/jquery-1.2.6.pack.js"></script>
        <script type="text/javascript" src="/prestashop/js/jquery/jquery.easing.1.3.js"></script>
  </head>
    <body id="index">
            <div id="page">
            <!-- Header -->
            <div>
                <h1 id="logo"><a href="/prestashop/" title="Prestashop demo"><img src="/prestashop/img/logo.jpg" alt="Prestashop demo" /></a></h1>
                <div id="header">
                </div>
            </div>
            <!-- Left -->
            <div id="left_column" class="column">
            </div>
            <!-- Center -->
            <div id="center_column">
                     </div>
<!-- Right -->
            <div id="right_column" class="column">
            </div>
<!-- Footer -->
            <div id="footer">
        </div>
        </div>
        </body>
</html>

REKAPITULASI
Pertama,  index.php loading request halaman php lain yang didefinisikan dalam file php. Selanjutnya halaman php ini memanggil file-fle tpl dan bersama-sama mengubahnya menjadi webpage. 
Kedua, index.tpl hanya berisi satu baris:
{$ HOOK_HOME}.
Hal ini disebabkan file index hanya akan menampilkan modul-modul yang ditugaskan untuk homepage. Kategori dan halaman produk akan ditampilkan dengan bantuan modul lain.
Ketiga, kita menemukan body ID yang berbeda-beda pada masing-masing halaman, index.tpl, category.tpl, product.tpl misalnya.
Sehingga kita memiliki fleksibilitas untuk style halaman berbeda-beda dengan hanya menggunakan aturan pada global.css untuk menargetkan body ID. Darimana hal ini berasal? Jika melihat header.tpl Anda akan melihat satu baris ini:
<body {if $page_name}id="{$page_name|escape:'htmlall':'UTF-8'}"{/if}>
dan kode ini yang menjadikan nama halaman. Sehingga category.tpl akan memiliki <body id="category">
SEMOGA BERMANFAAT                  KEMBALI KE  >>>>>  BAGIAN 1

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Dasar-Dasar PHP dan Latihan Sederhana – Bagian 1

 

Jika Anda ingin membuat atau melakukan Kustomisasi Toko Online disyaratkan Anda mengetahui kode HTML, CSS, Javascript dan bahasa kode lain. Pemasangan plugin pada pada Quick.Cart v3.0 untuk fitur “Keranjang Belanja” (Add Cart) suatu Toko Online harus dilakukan oleh seseorang yang mengerti HTML dan PHP dasar. Pada kali ini saya hanya ingin sedikit mengenalkan sebagian dari dasar-dasar PHP.

PHP adalah script yang dijalankan di Server. Manfaat dari penggunaan PHP adalah kode yang menyusun program tidak perlu di-release ke User sehingga kerahasiaan kode tetap terlindungi. Hal menarik adalah kenyataan bahwa PHP bisa digunakan untuk mengakses atau men-support berbagai macam database seperti Access, Oracle, MySQL, dan lain-lain. Untuk lebih mudah memahami PHP, langsung saja pada Exercise di bawah ini.

BAGIAN 1                                       BAGIAN 2                                         BAGIAN 3                                            BAGIAN 4

Bagian 1 : Pengkodean PHP

_latihan1.php

<HTML>
<HEAD>
<TITLE> Latihan pertama </TITLE>
</HEAD>
<BODY>
<H1>Contoh PHP pertama</H1>
<?
//latihan pertama
print"Selamat belajar PHP <BR>";
print"Semoga Anda sukses !";
/* Komentar Program : menampilkan pesan di halaman browser
Selamat Belajar PHP
Semoga sukses ! 
Teks komentar program tidak dimunculkan */
?>
</BODY>
</HTML>

Pada  program diatas terdapat code HTML dan PHP.  Code PHP diawali <? dan diakhiri tanda  ?>. Di dalam pasangan tersebut terdapat pernyataan-pernyataan PHP.   Snippet kode :

  • print "Selamat belajar PHP <BR>";

disebut sebagai Pernyataan atau statement  dan  antar-pernyataan dipisahkan tanda titik-koma (;).  Hasilnya :  Dimunculkan pada halaman Browser teks berikut  :

Selamat belajar PHP
Semoga Anda sukses !

Teks yang ada setelah tanda //  disebut komentar program yang tidak akan dieksekusi. Pada contoh diatas menunjuk :

//latihan pertama

Teks diantara tanda /* dan */ disebut juga komentar program. Pada contoh diatas menunjuk :

/* Komentar Program : menampilkan pesan di halaman browser
Selamat Belajar PHP
Semoga sukses ! 
Teks komentar program tidak dimunculkan */

Tanda // hanya berlaku untuk 1 baris.  Sedangkan tanda /* … …  */ berlaku untuk 2 baris atau lebih.

Variabel dan Tipe Data pada PHP

Variable berfungsi menyimpan suatu nilai, dan nilai yang ada di dalamnya bisa diubah-ubah. Penulisan Variable didahului tanda $.  Nama Variable harus memenuhi aturan pengenal (Identifier) yang digunakan pada pemberian nama Variable, Fungsi atau Kelas. Aturan untuk pengenal (Identifier) sebagai berikut :

  • Karakter yang digunakan adalah huruf, angka atau garis bawah
  • Karakter pertama harus berupa huruf atau garis bawah
  • Panjang pengenal bisa berapa saja
  • Case Sensitive.

Contoh : _latihan1.php atau latihan2.php atau latihan_3.php atau _latihan_4.php  dan seterusnya

Tipe data

Tipe data PHP ada 3 macam, yaitu :

  • Integer menyatakan tipe data bilangan bulat
  • Double menyatakan tipe data bilangan real yaitu bilangan yang mempunyai bagian pecahan
  • String menyatakan tipe data teks.

_latihan2.php

<HTML>
<HEAD>
<TITLE> Latihan kedua </TITLE>
</HEAD>
<BODY>
<H1>Contoh PHP kedua</H1>
<?
$nama="Anwar";
$nomor=2;
$tanggal=date("d F Y");
$jam=date(H:i:s);
print"Ini Halaman ke-$nomor diakses pada tanggal $tanggal<BR> ";
print"Ini Halaman ke-$nomor diakses pada jam $jam<BR> ";
print"Selamat belajar PHP $nama <BR>";
print"Semoga sukses !";
?>
</BODY>
</HTML>

 

Parsing Variabel Melalui Form

latihan3.php

<HEAD>
<TITLE> Latihan ketiga </TITLE>
</HEAD>
<BODY>
<FORM METHOD=POST ACTION="latihan3_hasil.php">
Silakan Masukkan Nama Anda <BR>
<INPUT TYPE="text" NAME="nama"><BR>
Silakan Masukkan Pesan Anda <BR>
<TEXTAREA NAME="pesan" ROWS="5" COLS="30"></TEXTAREA><BR>
<INPUT TYPE="submit" value="Kirim">
</FORM>
</BODY>
</HTML>

Latihan3_hasil php

<HTML>
<HEAD>
<TITLE> Hasil Latihan ketiga </TITLE>
</HEAD>
<BODY>
<?
print"<B>Data yang Anda masukkan :</B> <BR>";
print"Nama Anda : $nama <BR>";
print"Pesan Anda : $pesan";
?>
</BODY>
</HTML>

 

Parsing Variabel Melalui Link

latihan4.php

<HTML>
<HEAD>
<TITLE> Latihan keempat </TITLE>
</HEAD>
<BODY>
Silakan Klik di
<A HREF="latihan4_proses.php?nama=Anwar&pesan=Terima+kasih">sini</A>
</BODY>
</HTML>

latihan4_proses.php

<HTML>
<HEAD>
<TITLE> Hasil Latihan keempat </TITLE>
</HEAD>
<BODY>
<?
print"Variabel dan nilai yang terkirim adalah : <BR>";
print"\$nama = $nama <BR>";
print"\$pesan = $pesan";
?>
</BODY>
</HTML>

Soalan Latihan :

Setelah mencermati exercise 1,2,3, dan 4 cobalah Anda uraikan kode PHP tayangan form input data dan data hasil isian (output) seperti 2 gambar dibawah ini : 

clip_image001clip_image001[4]


Bersambung ke : BAGIAN  2

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Dasar-Dasar PHP dan Latihan Sederhana – Bagian 3

 

Welcome to Coding World,

Kita sekarang membicarakan topik “Scripting Language” dalam pengembangan website, khususnya Toko Online. Menurut informasi dari official site PHP, yaitu PHP.net, PHP atau PHP: Hypertext Prepocessor merupakan bahasa pemrograman web yang bisa disisipkan dalam script HTML. Banyak sintaks di dalamnya yang mirip dengan bahasa C, Java dan Perl. Tujuannya adalah membantu para Pengembang Website  (Web Developer) untuk membuat web dinamis dengan cepat.

Saat Anda membuka website berbasis PHP, web server akan memproses code-code PHP. Beberapa code atau perintah dari PHP tersebut selanjutnya ada yang diterjemahkan ke dalam HTML dan ada yang disembunyikan (misalnya proses kalkulasi dan operasi). Setelah diterjemahkan ke dalam HTML, web server akan mengirim kembali ke web browser pengunjung tersebut.

BAGIAN 1                                       BAGIAN 2                                         BAGIAN 3                                            BAGIAN 4

Pada bagian 1, membicarakan macam variable dan tipe data, beserta latihan 1 - 4 untuk penggunaan pada Parsing Variabel melalui Form dan Parsing Variable melalui Link. Bagian 2 mengulas Statement Program. Pada bagian 3 ini akan membicarakan dasar-dasar proses operasi dan kalkulasi pada program PHP.

Operator

Operator adalah symbol yang digunakan dalam program untuk melakukan suatu operasi, misal perkalian atau pembandingan, penjumlahan, kesamaan dua buah nilai, atau bahkan memberikan nilai ke variable.

Operator Aritmatika

+= menambahkan variable di sisi kiri dengan nilai di sisi kanan

-= mengurangi isi variable di sisi kiri dengan nilai di sisi kanan

/= membagi isi variable di sisi kiri dengan nilai di sisi kanan

%= memperoleh sisa pembagian antara variable di sisi kiri dengan nilai di sisi kanan

Operator Pembanding

== sama dengan

< kurang dari

> lebih dari

<= kurang dari atau sama dengan

>= lebih dari atau sama dengan

!= tidak sama dengan (bisa juga menggunakan <>)

Latihan9.php

<?
switch ($operator){ 
            case "+" : $hasil=$angka1+$angka2; 
                                break;
            case "-" : $hasil=$angka1-$angka2;
                               break;
            case "*" : $hasil=$angka1*$angka2; 
                               break;
            case "/" : if ($angka2==0) $hasil="E"; else $hasil=$angka1/$angka2;
                              break;
}
?>

<HTML>
<HEAD>
<TITLE> Latihan kesembilan </TITLE>
</HEAD>
<BODY>
<FORM METHOD=POST ACTION="latihan9.php">
<TABLE style="font-family:verdana;font-size:10pt" align=center border=5
cellspacing=0>
<TR bgcolor=f1f1f1>
<TD colspan=4>Kalkulator Sederhana</TD>
</TR>
<TR>
<TD colspan=4><INPUT TYPE="text" NAME="angka1" value="<? print $angka1
?>"></TD>
</TR>
<TR>
<TD colspan=4><INPUT TYPE="text" NAME="angka2" value="<? print $angka2
?>"></TD>
</TR>
<TR align=center>
<TD><INPUT TYPE="submit" name="operator" value="+"></TD>
<TD><INPUT TYPE="submit" name="operator" value="-"></TD>
<TD><INPUT TYPE="submit" name="operator" value="*"></TD>
<TD><INPUT TYPE="submit" name="operator" value="/"></TD>
</TR>
<TR>
<TD colspan=4><INPUT TYPE="text" NAME="hasil" value="<? print
$hasil?>"></TD>
</TR>
</TABLE>
</FORM>
</BODY>
</HTML>

Array

Pengertian Array

Array adalah wadah yang dapat menyimpan sejumlah nilai scalar

Masing-masing nilai diakses melalui indeks yang biasa disebut subskrip. Dalam hal ini indeks berupa bilangan bulat yang dimulai dari nol.

Menciptakan Array

Array dalam PHP diciptakan dengan bentuk sebagai berikut :

$namaArray=array(elemen_1, … , elemen_N);

Mengubah Variabel Biasa Menjadi Array

Sebuah variable biasa bisa diubah keadaannya menjadi sebuah array, contoh :

variable $kalimat="Saya belajar PHP";

bisa diubah menjadi array $kata dengan masing-masing elemen sebagai berikut :

$kata[0]="Saya"; $kata[1]="belajar"; $kata[2]="PHP";

Fungsi untuk melakukan hal tersebut adalah menggunakan explode. Sintaknya adalah  :

explode("pemisah","string yang akan dijadikan array");

Karena itu pernyataan di atas dapat dituliskan dalam program berikut ini :

$kalimat="Saya belajar PHP";
$kata=explode(" ",$kalimat);

Kebalikan explode adalah implode. Sintaknya adalah :

implode("perekat","array yang akan digabung")    

Jika variable array di atas akan digabung kembali dengan penggabungnya tanda strip tengah (-) misalnya maka hal tersebut dapat dituliskan dalam program berikut ini :

$gabung=implode("-",$kata);

Mengetahui Jumlah Elemen Array

Untuk mengetahui jumlah elemen array digunakan fungsi count() dengan argument berupa nama array.

Latihan10.php

<?
$kalimat="Saya belajar PHP";
$kata=explode(" ",$kalimat);
$jumlahArray=count($kata);
for ($i=0;$i<$jumlahArray;$i++){
             print "\$kata[$i]=$kata[$i]<BR>";
}
$gabung=implode("-",$kata);
print"<BR>";
print "\$gabung=$gabung";
?>

 


  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS