M-S Blog

Mengenal Berbagai Function PHP String dan Cara Penggunaannya

<div dir="ltr" style="text-align: left;" trbidi="on">
<h3 class="post-title entry-title" style="background-color: white; color: #222222; font-family: Georgia,Times,serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px; text-align: center;">
OPERASI STRING PHP</h3>
<h3 class="post-title entry-title" style="background-color: white; color: #222222; font-family: Georgia,Times,serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px; text-align: center;">
 </h3>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQErAyiG1HMWqLykkeW57vsqEMfCd6fnB8JGS_GKoHVnohRWIghH26zUQhXJRifFjngVcK9WAlXX3eeY-M-nXdsPsWlDeFQcRhasDpi-sZOqCPLVFWwHne1V59hyphenhyphen9xrlL26fXxxXtylTk/s1600/index.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Mengenal Berbagai Function PHP String dan Cara Penggunaannya" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQErAyiG1HMWqLykkeW57vsqEMfCd6fnB8JGS_GKoHVnohRWIghH26zUQhXJRifFjngVcK9WAlXX3eeY-M-nXdsPsWlDeFQcRhasDpi-sZOqCPLVFWwHne1V59hyphenhyphen9xrlL26fXxxXtylTk/s1600/index.jpg" title="Function PHP" width="320" /></a></div>
<h3 class="post-title entry-title" style="background-color: white; color: #222222; font-family: Georgia,Times,serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px; text-align: center;">
 </h3>
<div class="post-header" style="background-color: white; color: #444444; font-family: Georgia, serif; font-size: 12px;">
<div class="post-header-line-1" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; margin-bottom: 15px;">
<div style="color: #888888; font-style: italic; margin: 5px;">
</div>
<div style="clear: both;">
</div>
</div>
</div>
<div id="tutorial">
Pada tutorial kali ini saya akan menyajikan bentuk-bentuk function 
buil-in didalam PHP yang digunakan untuk mengelola Dan Pengolahan String
 atau disebut juga dengan Operasi String Slamat untuk Membaca....! 
he.... 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Menghitung Jumlah Karakter</h3>
<h4>
strlen()</h4>
Untuk menghitung jumlah karakter dalam suatu variabel string, dapat menggunakan strlen() 
Syntax:  
<pre class="script">strlen($string); 
</pre>
Biasanya fungsi ini digunakan untuk membatasi/filter terhadap jumlah character string yang didinputkan yang pada textbox . 
Contoh 
<pre class="script"><?
$data="Belajar Program PHP tidak sulit."; 
$jumlah=strlen($data); 
echo"variabel string\$data=$data
"; 
echo"Data'$data'diatas jumlah karakternya adalah = $jumlah"; 
?>
</pre>
hasil program, apabila dijalankan pada browser, akan tampak seperti berikut :  
variabel string$data=Belajar Program PHP tidak sulit. 
Data'Belajar Program PHP tidak sulit.'diatas jumlah karakternya adalah = 32 
 
<h4>
strpos()</h4>
Syntax:  
<pre class="script">strpos('[var||string]','[value]' )
</pre>
Function strpos() digunakan untuk menentukan posisi suatu substring dari
 sederetan string. Function ini akan mereturn bilangan integer yang 
merupakan urutan posisi substring tersebut. 
Contoh 
<pre class="script"><?
$stringku = "1234567890";
$posisi = strpos($stringku, "5");
echo "Posisi dari karakter 5 dalam string adalah $posisi";
?>
</pre>
Script di atas akan menghasilkan posisi karakter '5' adalah di 4. 
NB: 
Ingat bahwa index dari array dalam PHP dimulai dari index ke - 0. 
Kelemahan dari strpos() adalah bahwa function tersebut hanya dapat 
menentukan posisi suatu substring pada pemunculan pertama. Pada 
pemunculan substring pada posisi yang berikutnya tidak akan terdeteksi. 
Meskipun demikian, Anda masih tetap menggunakannya untuk mencari posisi 
yang lain dari suatu substring dengan sedikit melakukan pemrograman. 
 
Contoh 
<pre class="script"><?
$stringku = "1234567890123456789012345678901234567890";
$offset = 0;
$counter = 1;
while($offset = strpos($stringku, "5", $offset + 1))
{
$counter++;
echo "
Karakter 5 ke-$counter ada posisi - $offset";
}
?>
</pre>
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Mengulang Penulisan String</h3>
<h4>
str_repeat()</h4>
Gunakan fungsi Str_repeat() apabila suatu program membutuhkan 
pengulangan proses pencetakan dengan jumlah tertentu. Hasil fungsi 
tersebut berupa string yang diulang - ulang sesuai dengan isi teks pada 
argument string. 
Syntax:  
<pre class="script">strpos('[var||string]','[value]' )
</pre>
Contoh 
<pre class="script"><?
//pengulangan data string 
//str_repeat.php 
$ulang=str_repeat("selamat ",4); 
$ulang2=str_repeat("Horee! ",4); 
echo"Anda telah lulus Ujian!
"; 
echo"$ulang
"; 
echo"Welcome to the Holiday
"; 
echo"$ulang2"; 
?>
</pre>
Hasilnya adalah: 
Anda telah lulus Ujian! 
selamat selamat selamat selamat 
Welcome to the Holiday 
Horee! Horee! Horee! Horee! 
 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Mencari dan Mengganti String.</h3>
<h4>
1. ereg_replace()</h4>
<h4>
2. eregi_replace()</h4>
<h4>
3. str_replace()</h4>
Adapun beberapa fungsi yang dapat digunakan untuk mencari dan mengganti bagian string tertentu adalah fungsi Ereg_replace(), Eregi_replace(), dan Str_replace().
 Ketiga fungsi tersebut mempunyai kegunaan yang sama, yaitu mencari pola
 tertentu pada sebuah data string dan menggantinya dengan string yang 
baru 
<h4>
1. ereg_replace()</h4>
Syntax:  
<pre class="script">ereg_replace(pola awal,pola pengganti,string);
</pre>
<h4>
2. eregi_replace()</h4>
Syntax:  
<pre class="script">eregi_replace(pola awal,pola pengganti,string);
</pre>
<h4>
3. str_replace()</h4>
Syntax:  
<pre class="script">Str_replace('[string_replace]','[string_ubah]','[string_asli]' )
</pre>
Function ini memiliki peran yang sama seperti ketika kita menggunakan 
fasilitas Replace All pada MS. Word. Function ini akan menggantikan 
suatu string dengan string yang lain. 
Contoh 
<pre class="script"><?
//replace.php 
//mengganti sebagian dari sebuah string. 
$data="Reog adalah salah satu kesenian tari budaya daerah yang berasal 
 dari kota ponorogo. Reog digambarkan dengan sebuah 
 harimau jawa dan seekor burung merak yang ada diatasnya.";
$str="kesenian"; 
$str2=str_replace($str,"$str",$data); 
echo"Diganti menggunakan fungsi str_replace()."; 
echo" $str2 "; 
$ereg="ponorogo"; 
$ereg2=ereg_replace($ereg,"$ereg",$data); 
echo"Diganti menggunakan fungsi ereg_replace()."; 
echo" $ereg2 "; 
$eregi="seekor"; 
$eregi2=eregi_replace($eregi,"$eregi",$data); 
echo"Diganti menggunakan fungsi eregi_replace()."; 
echo" $eregi2 "; 
 
?>
</pre>
Hasilnya adalah: 
Diganti menggunakan fungsi str_replace(). 
Reog adalah salah satu kesenian tari budaya daerah yang berasal dari 
kota ponorogo. Reog digambarkan dengan sebuah harimau jawa dan seekor 
burung merak yang ada diatasnya. 
Diganti menggunakan fungsi ereg_replace(). 
Reog adalah salah satu kesenian tari budaya daerah yang berasal dari 
kota ponorogo. Reog digambarkan dengan sebuah harimau jawa dan seekor 
burung merak yang ada diatasnya. 
Diganti menggunakan fungsi eregi_replace(). 
Reog adalah salah satu kesenian tari budaya daerah yang berasal dari 
kota ponorogo. Reog digambarkan dengan sebuah harimau jawa dan seekor 
burung merak yang ada diatasnya. 
Contoh 
<pre class="script"><?
$rawstring = "Welcome Birmingham parent! Your offspring 
 is a pleasure to have! We believe pronoun is learning a lot. 
 The faculty simple adores pronoun2 and you can often hear them 
 say \"Attah sex!\" "; 
$replace = array('offspring', 'pronoun2', 'pronoun', 'sex');
 $ubah1 = array('son', 'he', 'him', 'boy'); 
 $ubah2 = array('daughter', 'she', 'her', 'girl'); 
 $malestr = str_replace($replace, $ubah1, $rawstring); 
 $femalestr = str_replace($replace, $ubah2, $rawstring);
 echo "Asli :".$rawstring." "; 
 echo "Son: ". $malestr . " "; 
 echo "Daughter: ". $femalestr; 
 
?>
</pre>
dan tampilannya adalah sbb: 
Asli :Welcome Birmingham parent! 
Your offspring is a pleasure to have! We believe pronoun is learning a lot. 
The faculty simple adores pronoun2 and you can often hear them say "Attah sex!" 
Son: Welcome Birmingham parent! 
Your son is a pleasure to have! We believe him is learning a lot. 
The faculty simple adores he and you can often hear them say "Attah boy!" 
Daughter: Welcome Birmingham parent! 
Your daughter is a pleasure to have! We believe her is learning a lot. 
The faculty simple adores she and you can often hear them say "Attah girl!" 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Fungsi transform string</h3>
<table><tbody>
<tr><th>Function</th><th>Description</th></tr>
<tr><td valign="top">strtoupper()</td><td valign="top">Mengubah string menjadi kapital</td></tr>
<tr><td valign="top">Strtolower()</td><td valign="top">Mengubah string menjadi kecil</td></tr>
<tr><td valign="top">ucfirst()</td><td valign="top">Mengubah awal string menjadi capital</td></tr>
<tr><td valign="top">ucword()</td><td valign="top">Mengubah awal kata dalam string menjadi capital</td></tr>
</tbody></table>
<h4>
1. strtoupper()</h4>
Syntax:  
<pre class="script">strtoupper('[string_convert]' )
</pre>
Function ini digunakan untuk mengubah semua karakter huruf dari suatu string menjadi kapital. 
Contoh 
<pre class="script"><?
$Asli= "Ubah huruf besar 1234";
$upper = strtoupper($Asli);
echo "Old string - $Asli ";
echo "New String - $upper";
?>
</pre>
Hasilnya adalah: 
Old string - String Capitalization 1234 
New String - STRING CAPITALIZATION 1234 
 
<h4>
2. strtolower()</h4>
Syntax:  
<pre class="script">strtolower('[string_convert]' )
</pre>
Kebalikan dari strtoupper(), function ini mengubah semua karakter huruf dari string menjadi huruf kecil. 
Contoh 
<pre class="script"><?
$Asli= "Ubah huruf besar 1234";
$lower = strtolower($Asli);
echo "Old string - $Asli ";
echo "New String - $lower";
?>
</pre>
Hasilnya adalah: 
Old string - String Capitalization 1234 
New String - string capitalization 1234 
<h4>
3. ucfirst()</h4>
Syntax:  
<pre class="script">ucfirst('[string_convert]' )
</pre>
Karakter huruf pertama dalam string juga diubah menjadi huruf capital menggunakan function ini. 
Contoh 
<pre class="script"><?
$string ="berik lagi belajar program php";
echo ucfirst($string);
?>
</pre>
Hasilnya adalah: 
Berik lagi belajar program php4 
<h4>
4. ucwords()</h4>
Syntax:  
<pre class="script">uswords('[string_convert]' )
</pre>
Karakter huruf pertama dari suatu kata dalam string juga dapat diubah menjadi huruf capital menggunakan function ini. 
Contoh 
<pre class="script"><?
$titleString = "a title that could use some hELP";
$ucTitleString = ucwords($titleString);
echo "Old title - $titleString ";
echo "New title - $ucTitleString";
?>
</pre>
Hasilnya adalah: 
Old title - a title that could use some hELP 
New title - A Title That Could Use Some HELP 
Bagaimana cara mengubah HELP menjadi Help (pada tampilan outputnya)? Perhatikan script modifikasi berikut ini 
Contoh 
<pre class="script"><?
$titleString = "a title that could use some hELP";
$lowercaseTitle = strtolower($titleString);
$ucTitleString = ucwords($lowercaseTitle);
echo "Old title - $titleString ";
echo "New title - $ucTitleString";
?>
</pre>
yaitu dengan cara mengubahnya ("hELP") ke huruf kecil semua terlebih 
dahulu ("help"), kemudian huruf pertama dari "help" diberikan perintah 
ucwords(). 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Menghapus Spasi Pada String</h3>
<table><tbody>
<tr><th>Function</th><th>Description</th></tr>
<tr><td valign="top">trim()</td><td valign="top">untuk menghilangkan spasi di bagian kiri dan kanan teks</td></tr>
<tr><td valign="top">rtrim()</td><td valign="top">untuk menghilangkan spasi di bagian kanan teks</td></tr>
<tr><td valign="top">ltrim()</td><td valign="top">untuk menghilangkan spasi di bagian kiri teks</td></tr>
<tr><td valign="top">uchop()</td><td valign="top">untuk menghilangkan spasi di bagian kanan dan juga menghilangkan karakter - karakter whitespace, 
seperti : "\n", "\r", "\t", "\v", "\0"</td></tr>
</tbody></table>
Untuk mengolah data dalam bentuk string, suatu saat ingin mengubah 
posisi spasi pada suatu variabel string. Cara menghapus spasi pada 
sebuah string dapat menggunakan beberapa fungsi sesuai dengan kondisi 
data string. 
Syntax:  
<pre class="script"> trim(string); 
 rtrim(string); 
 ltrim(string); 
 chop(string);

</pre>
Contoh 
<pre class="script"><?
$kata = " Program PHP "; 
echo "Kata '$kata' dengan spasi di depan dan di belakang "; 
$hilang1 = ltrim($kata); 
echo "Di hilangkan spasi di depan menjadi : "; 
echo "'$hilang1' "; 
$hilang2 = rtrim($kata); 
echo "Di hilangkan spasi di belakang menjadi : "; 
echo "'$hilang2' "; 
$hilang3 = trim($kata); 
echo "Di hilangkan spasi di depan dan di belakang menjadi : "; 
echo "'$hilang3' "; 
?>
</pre>
Hasilnya adalah: Kata ' Program PHP ' dengan spasi di depan dan di belakang 
Di hilangkan spasi di depan menjadi : 
'Program PHP ' 
Di hilangkan spasi di belakang menjadi : 
' Program PHP' 
Di hilangkan spasi di depan dan di belakang menjadi : 
'Program PHP' 
 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Pemecah String</h3>
<table><tbody>
<tr><th>Function</th><th>Description</th></tr>
<tr><td valign="top">Strtok()</td><td valign="top">Pemecahan string</td></tr>
<tr><td valign="top">Split()</td><td valign="top">Pemecahan string dilengkapi dengan argumen parameter pembagi.</td></tr>
<tr><td valign="top">Explode()</td><td valign="top">Pemecahan string</td></tr>
<tr><td valign="top">Substr()</td><td valign="top">memecah string berdasarkan no index_awal mulai sampai batasan charakter di inginkan</td></tr>
</tbody></table>
Sebuah string dapat dipecah menjadi beberapa bagian, per kata, dapat menggunakan fungsi Strtok() danSplit() adalah fungsi yang digunakan untuk memecah string, namun fungsi Split() dilengkapi dengan argumen parameter pembagi. Split(Pola,String,Parameter Pembagi); 
<h4>
1. Strtok()</h4>
Syntax:  
<pre class="script">Strtok(nama_string,karakter_pemisah);
</pre>
Contoh 
<pre class="script"><?
$kalimat = "Ibukota Indonesia adalah Jakarta"; 
$pecah = strtok ($kalimat," "); 
while ($pecah) 
{ 
echo " $pecah "; 
$pecah=strtok(" "); 
} 
?>
</pre>
Hasilnya adalah: Penulisan fungsi Strtok() dalam sebuah program adalah : 
Ibukota 
Indonesia 
adalah 
Jakarta 
 
<h4>
2. Split()</h4>
Syntax:  
<pre class="script">Split(Pola,String,Parameter Pembagi); 
</pre>
<h4>
3. explode()</h4>
Syntax:  
<pre class="script">explode('[karakter_explode]','[val||string_awal]')
explode('[karakter_explode]','[val||string_awal]','[value_batasan]')
</pre>
Sesuai namanya "explode", fungsi ini digunakan untuk meledakkan/memecah 
suatu string menjadi potongan-potongan string yang kecil. Selanjutnya 
potongan-potongan string ini akan disimpan dalam suatuarray. Perhatikan contoh berikut ini 
Contoh 
<pre class="script"><?
$PhoneNumber = "800-555-5555";
$hasil = explode("-", $PhoneNumber);
echo " Phone Number = $PhoneNumber ";
echo "Pecahan 1 = $hasil[0] ";
echo "Pecahan 2 = $hasil[1] ";
echo "Pecahan 3 = $hasil[2]";
?>
</pre>
Hasilnya adalah: Phone Number = 800-555-5555 
Pecahan 1 = 800 
Pecahan 2 = 555 
Pecahan 3 = 5555 
 
Contoh 
<pre class="script"><?
$PhoneNumber = "800-555-5555";
$hasil = explode("-", $PhoneNumber);
echo " Phone Number = $PhoneNumber ";
echo "Pecahan 1 = $hasil[0] ";
echo "Pecahan 2 = $hasil[1] ";
echo "Pecahan 3 = $hasil[2]";
?>
</pre>
Pada perintah explode("-", $PhoneNumber); di atas, karakter "-" dapat 
diibaratkan sebagai dinamitnya. Dinamit ini apabila diledakkan akan 
memecah string dari $PhoneNumber.Karakter yang akan digunakan sebagai 
dinamit dapat ditentukan sendiri oleh programmer, dapat berupa spasi, 
koma dsb.Jumlah pecahan string dari hasil ledakan dapat dibatasi dengan 
menambahkan jumlah batasledakan sebagai paramater ketiga dari function 
explode(). 
Perintah explode("-", $PhoneNumber, 2); di atas membatasi 2 buah pecahan string dari hasil ledakan. Dengan demikian, tampak pada hasil bahwa pecahan ketiga tidak ada. 
<h4>
4. substr()</h4>
Syntax:  
<pre class="script">substr('[var||string_awa]','[noindex_start]','[limit_char]')
</pre>
substr adalh fungsi yang dapat memecah string berdasarkan no index_awal mulai sampai batasan charakter di inginkan 
Contoh 
<pre class="script"><?
$tgl="2010-05-12"; 
echo "Tanggal : ".$tgl.""; 
echo "tahun : ".substr($tgl,0,4).""; 
echo "bulan : ".substr($tgl,5,2).""; 
echo "tggl : ".substr($tgl,8,2).""; 
?>
</pre>
Hasilnya adalah: Tanggal : 2010-05-12 
tahun : 2010 
bulan : 05 
tggl : 12 
 
pada contoh diatas dapat dilihat pemecahan suatu string hanya dengan batasan dari parameter fungsisubstr() tujuan dan pengunaanya sama pengunaan fungsi explode() dimana sama-sama memecahkan string.kedua fungsi ini sama tapi berbeda dalam kebutuhan yang efisiensinya masing2. 
Teman saya meminta tolong untuk dibuatkan aplikasi untuk membaca data 
file teks yang dihasilkan dari sebuah mesin presensi bernama AMANO. File
 teks itu berisi data-data presensi karyawan setiap harinya. Mau tahu 
bentuk datanya? Ini saya tampilkan 10 baris contoh datanya ya.... 
<pre>31200801211455000100093408000002
31200801211455000100032510950002
31200801211529000100034212950002
31200801211530000100018412930002
31200801211531000100177001050002
31200801211531000100197108050002
31200801211531000100163007030002
31200801211531000100179402050002
31200801211531000100198408050002

</pre>
Kalau datanya cuman 10 saja seperti di atas sih gak masalah.... Tapi 
kenyataannya satu file teks berisi kira-kira 2000-3000 data presensi. 
Satu file teks dihasilkan dari presensi sehari. Padahal file teks yang 
saya terima berjumlah sekitar 30 buah (presensi dalam 30 hari). Itu pun 
hanya sample file saja yang dikirimkan 
Dari sebuah data yang ada dalam file teks itu bermakna sesuatu. Berikut ini penjelasannya: 
Misalkan diambil data 
31200801211455000100093408000002 
<pre>Penjelasan Digitnya :
Digit 1 - 2 (31) : menunjukkan kode bagian karyawan ditempatkan
Digit 3 - 6 (2008) : menunjukkan tahun ketika presensi
Digit 7 - 8 (01) : menunjukkan bulan ketika presensi
Digit 9 - 10 (21) : menunjukkan tanggal ketika presensi
Digit 11 - 12 (14) : menunjukkan jam ketika presensi
Digit 13 - 14 (55) : menunjukkan menit ketika presensi
Digit 15 - 18 (0001) : menunjukkan keterangan presensi. 
Jika 0001 artinya presensi untuk masuk kerja, dan jika 0002 artinya presensi untuk keluar kerja
Digit 19 - 28 (0009340800) : menunjukkan kode karyawan yang melakukan presensi
Digit 29 - 32 (0002) : menunjukkan kode mesin presensi

</pre>
Nah.... yang jadi permasalahan adalah bagaimana cara mengambil atau 
memisahkan digit-digit tersebut, sehingga dapat dibaca per item data 
seperti penjelasan di atas? 
Dalam PHP, hal ini tidak menjadi masalah karena ada function substr(). Bagaimana sintaksnya? 
<pre class="inden">substr(x, y [, z]);
</pre>
dengan x adalah string utuh yang akan diambil substring nya, y adalah 
posisi awal substring (dimulai dari 0), dan z adalah panjang substring 
yang akan diambil. Parameter z sifatnya optional. Apabila z tidak 
diberikan, maka pengambilan substring mulai dari posisi awal y sampai 
dengan akhir dari string. 
Contoh 
<pre class="script"><?
$stringKu = "hallo";
echo substr($stringKu, 1); // menghasilkan "allo"
echo substr($stringKu, 1, 3); // menghasilkan "all"
echo substr($stringKu, 0, 4); // menghasilkan "hall"

?>
</pre>
Sehingga untuk kasus data presensi di atas, script untuk memisahkan setiap item adalah sebagai berikut: 
Contoh 
<pre class="script"><?
$data = "31200801211455000100093408000002";
$kodeBagian = substr($data, 0, 2);
$tahun = substr($data, 2, 4);
$bulan = substr($data, 6, 2);
$tanggal = substr($data, 8, 2);
$jam = substr($data, 10, 2);
$menit = substr($data, 12, 2);
$keterangan = substr($data, 14, 4);
$kodeKary = substr($data, 18, 10);
$kodePresensi = substr($data, 28, 4);
?>
</pre>
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Mengabungkan string yang terpecah</h3>
<h4>
implode()</h4>
Syntax:  
<pre class="script">explode('[karakter_implode]','[val||string_awal]')
</pre>
Kebalikan dari explode(), function implode() digunakan untuk menyatukan pecahan-pecahan string menjadi satu kesatuan string. 
Contoh 
<pre class="script"><?
$pecahan = array("Hello", "World,", "I", "am", "Here!");
$disatukandenganspasi = implode(" ", $pecahan);
$disatukandengandash = implode("-", $pecahan);
echo "$disatukandenganspasi ";
echo "$disatukandengandash ";
?>
</pre>
Hasilnya adalah: Hello World, I am Here! 
Hello-World,-I-am-Here! 
 
Bagaimana jika pengabungan kerja fungsi explode() dengan implode() 
dimana satu memisahkan dan yang satu mengabungkan adalah seperti contoh 
berikut: 
Contoh 
<pre class="script"><?
$PhoneNumber = "800-555-5555"; 
$hasil = explode("-", $PhoneNumber);
 echo " Phone Number = $PhoneNumber "; 
echo "Pecahan 1 = $hasil[0] "; 
echo "Pecahan 2 = $hasil[1] "; 
echo "Pecahan 3 = $hasil[2] "; 
$join=implode("**",$hasil); 
echo "Join :$gabung"; 
?>
</pre>
Hasilnya adalah: Phone Number = 800-555-5555 
Pecahan 1 = 800 
Pecahan 2 = 555 
Pecahan 3 = 5555 
pengabugana :800**555**5555 
 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Memecah File Ber-extensi</h3>
<h4>
pathinfo()</h4>
Syntax:  
<pre class="script">pathinfo('[file]')
</pre>
fungsi pathfile bekerja untuk memecah file yang berexstensi .dimana pecahan tersebut terbentuk dalam kedalam array assosatif . yaitu pecahan fiename dan pecahan extension 
Contoh 
<pre class="script"><?
$str='text.php';
$ext=pathinfo($str);
echo $ext['filename']." "; 
echo $ext['extension']; 
 
?>
</pre>
Hasilnya adalah: text 
php 
 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Membaca nama file dari suatu path</h3>
<h4>
basename()</h4>
Syntax:  
<pre class="script">basename('path_root_dir')
</pre>
Function ini digunakan untuk membaca nama file dari suatu path. 
Contoh 
<pre class="script"><?
$path = "/home/httpd/html/index.php";
echo basename($path); // menghasilkan 'index.php'
echo basename($path, ".php") ; // menghasilkan 'index' (menghapus ekstensi .php)
?>
</pre>
Contoh lain, bila script di bawah ini disimpan dengan nama myscript.php 
Contoh 
<pre class="script"><?
echo basename($_SERVER['PHP_SELF'], ".php"); // menghasilkan 'myscript' 
?>
</pre>
Hasilnya adalah: menghasilkan 'myscript' 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Character ASCII</h3>
<h4>
chr()</h4>
Syntax:  
<pre class="script">chr('[nomber_karakter_ASCII]')
</pre>
Function chr() digunakan untuk menghasilkan karakter ASCII berdasarkan bilangan bulat ASCII nya. 
Contoh 
<pre class="script"><?
$ascii = chr(97);
echo "Karakter ASCII dari 97 adalah: ".$ascii;
?>
</pre>
Hasilnya adalah: a 
Contoh 
<pre class="script"><?
echo "<table border=1><tr><th colspan=2>Cahracter ASCII</th></tr>
<tr><td>No ASCII</td><td>Character</td></tr>";
for ($n=0;$n<=255:$n++)
{
echo "<tr><td> ASCII : $n </td><td>".chr($n)." </td></tr>";
}
echo "</table>";

?>
</pre>
Hasilnya adalah: Berupa karakter Huruf yang Di konversi ke ASCII dengan bit 127 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Memformat Angka</h3>
<h4>
number _format()</h4>
Standar penulisan angka ( terutama dalam masalah mata uang ), sangat 
berbeda antara negara kita dengan sistem lain diluar negeri. Untuk 
memisahkan jumlah ribuan, biasanya menggunakan tanda titik, sedangkan 
sistem di luar menggunakan tanda koma. Fungsi number-format dapat 
ddigunakan untuk mengubah tampilan angka dalam laporan. 
Contoh 
<pre class="script"><?
$harga_sepatu = 195450; 
echo($harga_sepatu . "\n"); 
echo("\$" . number_format($harga_sepatu,"2",".","") . "\n"); 
echo" "; 
echo"Harga sepeda motor adalah ".number_format("12156688","2",",",".")."(dalam rupiah)"; 
?>
</pre>
Hasilnya adalah: 
195450 $195450.00 
Harga sepeda motor adalah 12.156.688,00(dalam rupiah) 
 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
memberikan tanda slash " \ "</h3>
<h4>
Addcslashes( )</h4>
<pre>Fungsi Addcslashes( ) digunakan untuk memberikan tanda slash " \ " pada karakter tertentu. 
Bentuk : Addcslashes(String_awal, Parameter_slash); 
Keterangan : 
 String adalah argument yang menunjukkan data awal yang akan diproses. 
 Parameter adalah argument yang menunjukkan parameter filter.

</pre>
Contoh 
<pre class="script"><?
// memberikan tanda slash pada karakter tertentu 
// addcslashes.php 
$data="Membuat web interaktif dengan program PHP."; 
echo"Sebelum ditambahkan \"\\\" : "; 
echo"$data"; 
$slash=Addcslashes($data,'ai); 
echo" Sekarang ditambahkan \"\\\" pada huruf a dan i saja : "; 
echo"$slash";

?>
</pre>
Hasil eksekusi adalah sebagai berikut : 
Sebelum ditambahkan "\" : 
Membuat web interaktif dengan program PHP. 
Sekarang ditambahkan "\" pada huruf a dan i saja : 
Membu\at web \inter\akt\if deng\an progr\am PHP. 
 
Untuk Pemahaman lebih lanjut tentang Operasi String saya akan menyajikan pada tutorial selanjutnya Yang terdapat Pada tap menu Tutorial realease Atas Waktu teman2, yang telah membaca tutorial saya yang sederhana ini saya ucapkan Terimakasih.....!</div>
<div id="tutorial">
 </div>
<div id="tutorial">
Re-post : http://almbantuli.blogspot.com/2013/03/php-fungsi-fungsi-php-khusus-string.html </div>
</div>

Mengenal Berbagai Function PHP String dan Cara Penggunaannya

OPERASI STRING PHP Pada tutorial kali ini saya akan menyajikan bentuk-bentuk function buil-in didalam PHP yang diguna...

04:48 +

Cara membuat polling atau voting dengan PHP

<div dir="ltr" style="text-align: left;" trbidi="on"><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6oa2M9cdY-h6mXrCQUnYO5a4KFkFvE6_Yvw7qup04OE94h4SOZa5Ra4EOuNDKHE6qggv0Qlcgt9tIzdrv0OBBFwL-KBRkX0s88Q6P0tqy2mVtEeh3uiLJRXFEN9l9ohMFZtwAwEATdcM/s1600/voting.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Membuat Voting atau Polling dengan PHP" border="0" height="286" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6oa2M9cdY-h6mXrCQUnYO5a4KFkFvE6_Yvw7qup04OE94h4SOZa5Ra4EOuNDKHE6qggv0Qlcgt9tIzdrv0OBBFwL-KBRkX0s88Q6P0tqy2mVtEeh3uiLJRXFEN9l9ohMFZtwAwEATdcM/s1600/voting.png" title="voting" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Membuat Voting atau Polling dengan PHP</td></tr>
</tbody></table> 
 
Kali ini saya bahas tentang Membuat Voting dengan PHP, voting biasanya digunakan oleh admin web dengan menyodorkan sebuah pertanyaan dengan beberapa sebuah pilihan kemudian pengunjung web disuruh memilih mana yang terbaik menurutnya. 
 
 
 
Okee Simak Baik-baik..... 
 
 
 
<div id="tabmenu"><ul id="nar"><li><a class="active" href="#"">Database</a></li>
<li><a href="#">Style.css</a></li>
<li><a href="#">Index.php</a></li>
<li><a href="#">voting.php</a></li>
<li><a href="#">View-voting.php</a></li>
<li><a href="#">koneksi.php</a></li>
</ul><div id="tab-konten"><div id="tab1">Buatlah database dengan nama voting, berikut struktur databasenya: 
 
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6CDJPf1IfAjZz0nrVWj3YQ70bdiP3ZQV5Vzck4Q1bk7_3MQFpOvUhlwooDxrAgQy3Phc0BgoVqQxx7mn_Q_ed_C5Rk3BLTpz9kJKRhE3ZbE2Jfto63XDU3fcDdjoHqXhJolKwA0KtbwE/s1600/db.png" /></div><div id="tab2"> 
 
 
 
body { 
 
 margin:0; 
 
 background-color:#fff; 
 
 
 
} 
 
 
 
#sidebar{ 
 
 background-color:#f3f1e7; 
 
 margin-left:30%; 
 
 margin-right:30%; 
 
 margin-top:5%; 
 
 border-radius:5px; 
 
 box-shadow:5px 0px 5px #999; 
 
 border-color:#C4E0AF; 
 
 border-style:solid; 
 
 border-width:thin; 
 
} 
 
 
 
 #sidebar .body { 
 
 margin: 20px 5px 20px 5px; 
 
 } 
 
 
 
 #sidebar .judul { 
 
 margin:-13px auto 0; 
 
 width:98%; 
 
 height:35px; 
 
 background-color:#96b74b; 
 
 background-repeat:repeat-x; 
 
 border-radius:5px; 
 
 } 
 
 
 
 #sidebar .judul h4{ 
 
 color:#ffffff; 
 
 text-shadow:0px 0px 5px #666666; 
 
 padding-left:10px; 
 
 padding-top:5px; 
 
 } 
 
 
 
 #sidebar li{ 
 
 list-style-type:none; 
 
 display:block; 
 
 padding-top:8px; 
 
 padding-bottom:8px; 
 
 margin-left:-40px; 
 
 border-bottom:1px solid; 
 
 border-color:#C4E0AF; 
 
 
 
 } 
 
 
 
 #sidebar li a{ 
 
 color:#2e776a; 
 
 text-decoration:none; 
 
 padding-left:5px; 
 
 } 
 
 
 
 #sidebar li:hover{ 
 
 color:#ffffff; 
 
 background-color:#b2df8e; 
 
 padding-left:-80px; 
 
 } 
 
 </div><div id="tab3"><?php 
 
include "koneksi.php"; 
 
?> 
 
 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 
<head> 
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
 
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0"/> 
 
<title>Demo Voting - Masholeh</title> 
 
<link href="style.css" rel="stylesheet" type="text/css" /> 
 
<script type="text/javascript"> 
 
function voting(){ 
 
 
 
 alert('Terima Kasih Anda telah mengikuti Voting'); 
 
 return false; 
 
 
 
} 
 
</script> 
 
 
 
</head> 
 
 
 
<body> 
 
<div id="isi"> 
 
 
 
<div id="sidebar"><div class="judul"><h4>Tentukan Pilihan Anda</h4></div> 
 
<div class="body"> 
 
 Apakah Tutorial WWW.BLOG.MASHOLEH.WEB.ID Bermanfaat Bagi Anda? 
 
 <form method="post" action="voting.php"> 
 
 
 
 <table> 
 
 <tr><td width="20"><input type="Radio" name="polling" value="sangat" checked></td> 
 
 <td>Sangat Bermanfaat</td></tr> 
 
 <tr><td width="20"><input type="Radio" name="polling" value="bermanfaat"></td> 
 
 <td>Bermanfaat</td></tr> 
 
 <tr><td width="20"><input type="Radio" name="polling" value="biasa"></td> 
 
 <td>Biasa Saja</td></tr> 
 
 <tr><td width="20"><input type="Radio" name="polling" value="tidak"></td> 
 
 <td>Tidak Bermanfaat</td></tr> 
 
 <tr><td width="20"><input type="Radio" name="polling" value="sangattidak"></td> 
 
 <td>Sangat Tidak Bermanfaat</td></tr> 
 
 <tr><td width="20"></td><td><input type="submit" name="polling2" value="Vote" onClick="voting();"></tr> 
 
 </table> 
 
 
 
 </form> 
 
 
 
</div> 
 
</div> 
 
 
 
 
 
</div> 
 
</body> 
 
</html></div><div id="tab4"><? 
 
if (isset($_POST['polling'])) 
 
{ 
 
 include "koneksi.php"; 
 
 $pilihan=$_POST['polling']; 
 
 $tanggal; 
 
 
 
 $polling=mysql_db_query($db,"select * from voting",$koneksi); 
 
 $baris=mysql_fetch_row($polling); 
 
 list($sangat,$bermanfaat,$biasa,$tidak,$sangattidak)=$baris; 
 
 
 
 $array1=$sangat+1; 
 
 $array2=$bermanfaat+1; 
 
 $array3=$biasa+1; 
 
 $array4=$tidak+1; 
 
 $array5=$sangattidak+1; 
 
 
 
 
 
 switch($pilihan) 
 
 { 
 
 case "sangat"; 
 
 echo " "; 
 
 $update=mysql_db_query($db,"update voting set sangat='$array1', tanggal='$tanggal'",$koneksi); 
 
 echo "<script> document.location.href='view-voting.php'; </script>"; 
 
 break; 
 
 
 
 case "bermanfaat"; 
 
 echo " "; 
 
 $update=mysql_db_query($db,"update voting set bermanfaat='$array2', tanggal='$tanggal'",$koneksi); 
 
 echo "<script> document.location.href='view-voting.php'; </script>"; 
 
 break; 
 
 
 
 case "biasa"; 
 
 echo " "; 
 
 $update=mysql_db_query($db,"update voting set biasa='$array3', tanggal='$tanggal'",$koneksi); 
 
 echo "<script> document.location.href='view-voting.php'; </script>"; 
 
 break; 
 
 
 
 case "tidak"; 
 
 echo " "; 
 
 $update=mysql_db_query($db,"update voting set tidak='$array4', tanggal='$tanggal'",$koneksi); 
 
 echo "<script> document.location.href='view-voting.php'; </script>"; 
 
 break; 
 
 
 
 case "sangattidak"; 
 
 echo " "; 
 
 $update=mysql_db_query($db,"update voting set sangattidak='$array5', tanggal='$tanggal'",$koneksi); 
 
 echo "<script> document.location.href='view-voting.php'; </script>"; 
 
 break; 
 
 
 
 } 
 
 
 
}</div><div id="tab5"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 
<head> 
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
 
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0"/> 
 
<title>Demo Voting - Masholeh</title> 
 
<link href="style.css" rel="stylesheet" type="text/css" /> 
 
</head> 
 
 
 
<body> 
 
 
 
<? 
 
 include "inc/koneksi.php"; 
 
 $hasil=mysql_db_query($db,"select * from voting",$koneksi); 
 
 $row=mysql_fetch_row($hasil); 
 
 list($sangat,$bermanfaat,$biasa,$tidak,$sangattidak,$megah,$masih)=$row; 
 
 $total=(int)$sangat+(int)$bermanfaat+(int)$biasa+(int)$tidak+(int)$sangattidak; 
 
 
 
 //menampilkan persentase 
 
 $persen_sangat =round(((int)$sangat/(int)$total)*100,2); 
 
 $persen_bermanfaat =round(((int)$bermanfaat/(int)$total)*100,2); 
 
 $persen_biasa =round(((int)$biasa/(int)$total)*100,2); 
 
 $persen_tidak =round(((int)$tidak/(int)$total)*100,2); 
 
 $persen_sangattidak =round(((int)$sangattidak/(int)$total)*100,2); 
 
 $persen_megah =round(((int)$megah/(int)$total)*100,2); 
 
 $persen_masih =round(((int)$masih/(int)$total)*100,2); 
 
 
 
 //mengkonversi persentasi menjadi ukuran pada diagram batang dengan mengalikan faktor 2, karena jika 100% artinya lebar maksimum digram adalah 100pt 
 
 $lebar_sangat=$persen_sangat*2; 
 
 $lebar_bermanfaat=$persen_bermanfaat*2; 
 
 $lebar_biasa=$persen_biasa*2; 
 
 $lebar_tidak=$persen_tidak*2; 
 
 $lebar_sangattidak=$persen_sangattidak*2; 
 
 
 
 
 
?> 
 
 
 
<div id="sidebar"><div class="judul"><h4>Hasil Voting</h4></div> 
 
 
 
<center>Apakah Tutorial WWW.BLOG.MASHOLEH.WEB.ID Bermanfaat Bagi Anda?</center> 
 
<table width="100%" border="0" cellspacing="2" cellpadding="2"> 
 
<tr> 
 
 <td><table border="0" width="100%"> 
 
    
 
      <tr> 
 
        <td width="30%" align="left">Sangat Bermanfaat</td> 
 
        <td width="5%" align="right"><? echo $sangat;?></td> 
 
        <td width="1%">&nbsp;</td> 
 
        <td width="20%" align="left"><img src="images/stat.jpg" border="1" width="<? echo $lebar_sangat ?>" height="12"> 
 
 <? echo $persen_sangat."%"; ?></td> 
 
      </tr> 
 
      <tr> 
 
        <td align="left">Bermanfaat</td> 
 
        <td align="right"><? echo $bermanfaat;?></td> 
 
        <td>&nbsp;</td> 
 
        <td align="left"><img src="images/stat.jpg" border="1" width="<? echo $lebar_bermanfaat ?>" height="12"> 
 
 <? echo $persen_bermanfaat."%";?> </td> 
 
      </tr> 
 
      <tr> 
 
        <td align="left">Biasa Saja</td> 
 
        <td align="right"><? echo $biasa;?></td> 
 
        <td>&nbsp;</td> 
 
        <td align="left"><img src="images/stat.jpg" border="1" width="<? echo $lebar_biasa ?>" height="12"> 
 
 <? echo $persen_biasa."%";?></td> 
 
      </tr> 
 
  <tr> 
 
        <td align="left">Tidak Bermanfaat</td> 
 
        <td align="right"><? echo $tidak;?></td> 
 
        <td>&nbsp;</td> 
 
        <td align="left"><img src="images/stat.jpg" border="1" width="<? echo $lebar_tidak ?>" height="12"> 
 
 <? echo $persen_tidak."%"; ?></td> 
 
      </tr> 
 
      <tr> 
 
        <td align="left">Sangat Tidak Bermanfaat</td> 
 
        <td align="right"><? echo $sangattidak;?></td> 
 
        <td>&nbsp;</td> 
 
        <td align="left"><img src="images/stat.jpg" border="1" width="<? echo $lebar_sangattidak ?>" height="12"> 
 
 <? echo $persen_sangattidak."%";?> </td> 
 
      </tr> 
 
    </table> 
 
 </td> 
 
</tr> 
 
<tr> 
 
 <td align="center"><? echo 'Total Voting : ',$total; ?></td> 
 
</tr> 
 
</table> 
 
 
 
<a href="index.php">Back To Home</a> 
 
</div> 
 
 
 
 
</div><div id="tab6"><?php 
 
ini_set('display_errors',FALSE); 
 
 $server="localhost"; 
 
 $user_db="root"; 
 
 $pass_db=""; 
 
 $db="voting"; 
 
 
 
$koneksi=mysql_connect($server,$user_db,$pass_db) or die("Gagal Koneksi DB!"); 
 
mysql_select_db($db) or die ("DB tidak ada!"); 
 
$tanggal=date("Y-m-d"); 
 
 
 
?></div></div></div><div style="text-align: center;">Sekian dari saya, banyak lebihnya Terimakasih !!! 
 
 
</div><div style="text-align: center;"><a class="kr_button rounded" href="http://www.masholeh.web.id/blog/demo/voting" target="_blank"> Demo </a><a class="kr_button rounded" href="http://www.masholeh.web.id/blog/download/voting.zip" target="_blank"> Download</a></div></div>

Membuat Voting atau Polling dengan PHP Kali ini saya bahas tentang Membuat Voting dengan PHP, voting biasanya digunakan oleh admin web ...

06:05 +

Cara membuat dan mendesain progress bar sendiri dengan CSS

<div dir="ltr" style="text-align: left;" trbidi="on">
 
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbycWttad63chJLujRQh_UiPox6zIoastQQij9JCZLRpdikLacMtsXtBB4nXCbeeXZGb_ngluWeXO7RaPl5SMj2TydKYsXxgGfr_-i2UwUEV_3Gc98bCBeW1AopPrJUMKD6j8IIzZwBhM/s1600/5387e_21-35-gorgeous-progress-bars.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt=" Cara membuat dan mendesain progress bar sendiri dengan CSS" border="0" height="192" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbycWttad63chJLujRQh_UiPox6zIoastQQij9JCZLRpdikLacMtsXtBB4nXCbeeXZGb_ngluWeXO7RaPl5SMj2TydKYsXxgGfr_-i2UwUEV_3Gc98bCBeW1AopPrJUMKD6j8IIzZwBhM/s1600/5387e_21-35-gorgeous-progress-bars.png" title="progress bar " width="320" /></a></div>
 
Wah gak terasa udah tahun 2015 dan baru update ne gara-gara di kul 
banyak tugas, (curhat dulu, hehhee). Setelah tugas dan UAS selesai admin
 duduk-duduk dan minum secangkir kopi sambil muter otak kira-kira mau 
update apa ya, emm, dan ahirnya saya tetapkan untuk buat tutorial desain
 progress. Untuk hal ini anda wajib ne mengenal siapa tu mbah jquery 
(library javascript),hahaha bagi yang belum sapa dulu, kenalan gitu sama
 mbah jquery. dan tentunya Css juga harus wajib mengerti, setidaknya 
basicnya.

Lanjut ke tutorial ya, siapkan editor kesayangan anda, apakah wajib? ya 
donk, lah kalau egak mau pake apa? maksudnya kesayangan? ya kalau gak 
sayang gak mood ngerjainnya nanti. 
Setelah itu buat halaman utamanya, masukkan kode HTML di bawah ini, dan 
jangan lupa library javascriptnya itu di atur dimana anda menaruhkan 
library.

<div id="kotakKode">
index.php
<div>
<pre class="prettyprint lang-html linenums prettyprinted"><ol class="linenums">
<li class="L0"><!DOCTYPE HTML></li>
<li class="L1"><head></li>
<li class="L2"> <meta http-equiv="content-type" content="text/html" /></li>
<li class="L3"> <meta name="author" content="mmlpro" /></li>
<li class="L4"> </li>
<li class="L5"> <script type="text/javascript" src="jquery-1.10.2.js"></script></li>
<li class="L6"> </li>
<li class="L7"> <title>desain progress</title></li>
<li class="L8"></head></li>
<li class="L9"> </li>
<li class="L0"><body></li>
<li class="L1"> </li>
<li class="L2"><h1>design progress by:mmlpro</h1></li>
<li class="L3"> </li>
<li class="L4"><div id="konten"></li>
<li class="L5"> <button value="25">25%</button></li>
<li class="L6"> <button value="50">50%</button></li>
<li class="L7"> <button value="75">75%</button></li>
<li class="L8"> <button value="100">100%</button></li>
<li class="L9"> <a class="run">Run</a></li>
<li class="L0"> </li>
<li class="L1"> <div id="progress">0%</div></li>
<li class="L2"></div></li>
<li class="L3"> </li>
<li class="L4"></body></li>
<li class="L5"></html></li>
</ol>
</pre>
</div>
</div>
Udah? cepet banget, padahal aku nulisnya aja lumayan beberapa menit. hehehe 
Sekarang cssnya silahkan dicopy. Simpan dengan nama style.css dan 
panggil css dengan cara external, taruh di dalam element head. Manggil 
cssnya seperti ini. 
<link href="style.css" rel="stylesheet"/>

<div id="kotakKode">
style.css
<div>
<pre class="prettyprint lang-css linenums prettyprinted"><ol class="linenums">
<li class="L0">body{margin:0;padding:0;background:#eeeeee;font-family: 'lucida grande',sans,verdana,arial,sans-serif;font-size:14px;color:#555555;}</li>
<li class="L1">h1{</li>
<li class="L2"> font-weight: normal;</li>
<li class="L3"> text-align: center;</li>
<li class="L4"> position: relative;</li>
<li class="L5">}</li>
<li class="L6">h1 sub{</li>
<li class="L7"> font-size: 12px;</li>
<li class="L8"> position: absolute;</li>
<li class="L9"> bottom:3px;</li>
<li class="L0">}</li>
<li class="L1">#konten{</li>
<li class="L2"> background-color: #ffffff;</li>
<li class="L3"> padding:10px 5px;</li>
<li class="L4"> width:400px;</li>
<li class="L5"> margin: 0 auto;</li>
<li class="L6">}</li>
<li class="L7">a{</li>
<li class="L8"> border:1px solid #bbb;</li>
<li class="L9"> background-color: #eeeeee;</li>
<li class="L0"> cursor: pointer;</li>
<li class="L1"> padding:0px 5px;</li>
<li class="L2"> position: relative;</li>
<li class="L3">}</li>
<li class="L4">a:after{</li>
<li class="L5"> content:"";</li>
<li class="L6"> position: absolute;</li>
<li class="L7"> top:0px;</li>
<li class="L8"> bottom:0px;</li>
<li class="L9"> right:-10px;</li>
<li class="L0"> border-left:10px #eeeeee solid;</li>
<li class="L1"> border-top:7px solid transparent;</li>
<li class="L2"> border-bottom:7px solid transparent;</li>
<li class="L3">}</li>
<li class="L4">a:before{</li>
<li class="L5"> content:"";</li>
<li class="L6"> position: absolute;</li>
<li class="L7"> top:-1px;</li>
<li class="L8"> bottom:-1px;</li>
<li class="L9"> right:-11px;</li>
<li class="L0"> border-left:11px #bbb solid;</li>
<li class="L1"> border-top:7px solid transparent;</li>
<li class="L2"> border-bottom:7px solid transparent;</li>
<li class="L3">}</li>
<li class="L4">button{</li>
<li class="L5"> border:1px solid #ccc;</li>
<li class="L6"> background-color: #eeeeee;</li>
<li class="L7"> cursor: pointer;</li>
<li class="L8">}</li>
<li class="L9">#progress{</li>
<li class="L0"> background-color: #f5f5f5;</li>
<li class="L1"> border:1px solid #ccc;</li>
<li class="L2"> margin: 10px 0px;</li>
<li class="L3"> border-radius: 7px;</li>
<li class="L4"> -webkit-border-radius: 7px;</li>
<li class="L5"> -moz-border-radius: 7px;</li>
<li class="L6"> border-radius: 7px;</li>
<li class="L7">}</li>
<li class="L8">#progress p{</li>
<li class="L9"> text-align: center;</li>
<li class="L0"> font-weight: bold;</li>
<li class="L1"> margin:0;</li>
<li class="L2"> padding:3px 0px;</li>
<li class="L3"> width:0;</li>
<li class="L4"> max-width: 100%;</li>
<li class="L5"> -webkit-border-radius: 7px;</li>
<li class="L6"> -moz-border-radius: 7px;</li>
<li class="L7"> border-radius: 7px;</li>
<li class="L8">}</li>
<li class="L9">.bgColor1{</li>
<li class="L0"> background-color: #DF8E84;</li>
<li class="L1"> color:#ffffff;</li>
<li class="L2">}.bgColor2{</li>
<li class="L3"> background-color: #C6DF84;</li>
<li class="L4"> color:#222;</li>
<li class="L5">}.bgColor3{</li>
<li class="L6"> background-color: #7ED777;</li>
<li class="L7"> color:#ffffff;</li>
<li class="L8">}</li>
</ol>
</pre>
</div>
</div>
Tambahkan script jquerynya seperti ini, taruh di file utama dan didalam element head seperti saat manggil css tadi.

<div id="kotakKode">

<div>
<pre class="prettyprint lang-javascript linenums prettyprinted"><ol class="linenums">
<li class="L0"> <script type="text/javascript"></li>
<li class="L1"> $(function(){</li>
<li class="L2"> var progress=$("#progress");</li>
<li class="L3"> var kontentProgress=$("#progress p");</li>
<li class="L4"> var button=$("button");</li>
<li class="L5"> var runaway=$(".run");</li>
<li class="L6"> var timer=null;</li>
<li class="L7"> </li>
<li class="L8"> //jalankan otomatis</li>
<li class="L9"> runaway.click(function(){</li>
<li class="L0"> var i;</li>
<li class="L1"> i=0;</li>
<li class="L2"> function tambahProgress(){</li>
<li class="L3"> i++;</li>
<li class="L4"> kontentProgress.css({"width":i+"%"}).text(i+"%");</li>
<li class="L5"> bgcolor(i);</li>
<li class="L6"> timer=setTimeout(tambahProgress, 50);</li>
<li class="L7"> if(i==100){</li>
<li class="L8"> clearTimeout(timer);</li>
<li class="L9"> kontentProgress.text("Loading selesai");</li>
<li class="L0"> }</li>
<li class="L1"> }</li>
<li class="L2"> timer=setTimeout(tambahProgress, 50);</li>
<li class="L3"> });</li>
<li class="L4"> </li>
<li class="L5"> //jika button diklik</li>
<li class="L6"> button.click(function(){</li>
<li class="L7"> clearTimeout(timer);</li>
<li class="L8"> var nilaiPersen=$(this).val();</li>
<li class="L9"> kontentProgress.css({"width":nilaiPersen+"%"}).text(nilaiPersen+"%");</li>
<li class="L0"> bgcolor(nilaiPersen);</li>
<li class="L1"> });</li>
<li class="L2"> </li>
<li class="L3"> </li>
<li class="L4"> //pengaturan bacground dan warna</li>
<li class="L5"> function bgcolor(nilai){</li>
<li class="L6"> if(nilai<35){</li>
<li class="L7"> kontentProgress.removeClass();</li>
<li class="L8"> kontentProgress.addClass("bgColor1");</li>
<li class="L9"> }else if(nilai>35 && nilai<60){</li>
<li class="L0"> kontentProgress.removeClass();</li>
<li class="L1"> kontentProgress.addClass("bgColor2");</li>
<li class="L2"> }else if(nilai>60 && nilai<=100){</li>
<li class="L3"> kontentProgress.removeClass();</li>
<li class="L4"> kontentProgress.addClass("bgColor3");</li>
<li class="L5"> }</li>
<li class="L6"> }</li>
<li class="L7"> });</li>
<li class="L8"> </li>
<li class="L9"> </script></li>
</ol>
</pre>
</div>
</div>
Nah coba di jalankan file uatamanya dengan browser kesayangan anda. 
Kalau aku sih pas buatnya makek google chrome (udah kebiasaan pakai 
google chrome) 
Gimana? Jalan atau tidak? jika ada yang eror bisa di tanyakan kok. iya, silahkan saja.

Keterangan :

Disini saya membuatnya untuk simulasi saja. Silahkan atur sendiri dari 
mana progress ini mendapatkan nilai, entah dengan cara eksekusi waktu 
ataupun dengan mendeteksi saat eksekusi file. Kalau di tutorial ini saya
 mengatur nilai progress dari value button dan juga dari looping di 
setTimout. 
Untuk bagian mendapatkan nilai dengan cara klik button, nilai persen di 
ambil dari value button yang di klik. Coba anda lihat discript jquery 
bagian button click. terdapat deklarasi variable seperti ini. 
var nilaiPersen=$(this).val();
 
Itu untuk mendapatkan nilai(value) dari button yang di klik. Nah untuk 
memasukkan nilai persen ke progressnya dan juga nilai panjangnya 
progress berjalan saya gunakan ini.
 
kontentProgress.css({"width":nilaiPersen+"%"}).text(nilaiPersen+"%");
 
Maksud dari script code di atas adalah mengatur panjang element p yang berada di dalam selector #progress menggunakan properti css width, dan megatur text di dalam element p.
 
Anda melihat ini? bgcolor(nilaiPersen);, itu saya gunakan untuk mengeksekusi Function bgcolor
 dan mengirimkan nilainya. Function ini saya gunakan untuk mengatur 
warna background dan text dan didalamnya terdapat if else statement yang
 akan menerima nilai progress dan mengubah warna progress setiap nilai 
yang sudah di tentukan di if else. Pengambilan/pengaturan warna dari 
progress saya gunakan teknik addClass dan removeClass yang nantinya akan
 menambah class keelement dan menghapus class dielement.

Di element run jika diklik progressnya akan berjalan sendiri saya 
gunakan setTimeout. Untuk memasukkan nilai ke progress tekniknya sama 
seperti tadi, cuma bedanya disini mendapatkan nilainya dari looping dan 
nantinya akan menghentikan setTimeout bila variable i sudah mencapai nilai 100 dengan tekik if statement condisi itu.
 
clearTimeout(timer); 
code inilah yang untuk menghentikan setTimeoutnya. Perhatikan deklarasi 
var yang di buat diatas sendiri, semua berhubungan dengan setTimoutnya 
kan maka clear timoutnya ditujukan ke timer.
 
Untuk perubahan warna sama seperti button klik tadi, memanggil function bgcolor(i); dan mengirimkan nilainya dari looping.

Yah, segitu aja yang diterangkan, jika ada yang kurang jelas bisa 
ditanyakan. Lewat facebook atau kontak lainnya. Terimakasih sudah 
berkunjung. 
 
<a href="https://app.box.com/s/lpd8bej8gij78956qscnyakj9c404zt6">DOWNLOAD </a> 
 
 
re-post from http://mmlpro.com/23/-membuat-dan-mendesain-progress-bar-sendiri.html 
</div>

Cara membuat dan mendesain progress bar sendiri dengan CSS

Wah gak terasa udah tahun 2015 dan baru update ne gara-gara di kul banyak tugas, (curhat dulu, hehhee). Setelah tugas dan UAS se...

05:40 +

Download Script Website Rumah Sakit Islam Klaten

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO-2NdlT2iKEXKG1VWkiJtHEq6tyrqOXbJZsTlcKS1gnFh1VZoy7hs13ZFIH06p3wtvjlyXpPxqJkvdBf522JMFpnapfKpF3dL0_vO4Sx6b0Mn2_X7eXOfX3ndbnNCE5JA1ROgfprUidM/s1600/1+(1).png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" height="384" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO-2NdlT2iKEXKG1VWkiJtHEq6tyrqOXbJZsTlcKS1gnFh1VZoy7hs13ZFIH06p3wtvjlyXpPxqJkvdBf522JMFpnapfKpF3dL0_vO4Sx6b0Mn2_X7eXOfX3ndbnNCE5JA1ROgfprUidM/s1600/1+(1).png" title="Website Rumah Sakit Islam Klaten" width="640" /></a></div>
<div style="background-color: white; color: #666666; font-family: Roboto,sans-serif; text-align: center;">
 </div>
<div style="background-color: white; color: #666666; font-family: Roboto, sans-serif; font-size: 14px; text-align: center;">
<div style="text-align: left;">
BACA JUGA :<a href="http://solo-devilz.blogspot.com/2015/04/download-script-website-toko-online-vmart.html"> Download Script Website Toko Online</a></div>
 </div>
<div style="background-color: white; color: #666666; font-family: Roboto, sans-serif; font-size: 14px; text-align: center;">
<a class="kr_button large rounded" href="http://rsi.masholeh.web.id/" style="-webkit-box-shadow: rgb(234, 234, 234) 0px 1px 2px, rgb(251, 251, 251) 0px 1px 0px inset; -webkit-transition: all 0.3s ease-out; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(249, 249, 249)), to(rgb(240, 240, 240))); border-bottom-left-radius: 23px; border-bottom-right-radius: 23px; border-color: rgb(222, 222, 222) rgb(216, 216, 216) rgb(211, 211, 211); border-style: solid; border-top-left-radius: 23px; border-top-right-radius: 23px; border-width: 1px; box-shadow: rgb(234, 234, 234) 0px 1px 2px, rgb(251, 251, 251) 0px 1px 0px inset; color: #31b988; cursor: pointer; display: inline-block; font-family: HelveticaNeue, Arial, sans-serif; font-size: 20px; line-height: 1em; outline: none; padding: 12px 22px; text-decoration: none; text-shadow: rgb(255, 255, 255) 0px 1px 0px; transition: all 0.3s ease-out;" target="_blank"> Demo</a></div>
 Alhamdulillah-Website Rumah Sakit Islam Klaten, kali ini saya dapat berbagi script website rumah sakit islam klaten yang sangat sederhana, website ini selain karya saya juga ditunjukkan kepada tugas akhir di salah satu SMK di Solo. 
 
Website ini sudah lumayan untuk dikatakan, karena sudah memiliki security / keamanan yang dibilang agak bagus dengan adanya filter SQL Injection dan dengan dilengkapinya page navigation akan memudahkan untuk merubah isi website dengan sangat mudah. 
 Bagi rekan-rekan yang ingin memiliki script website saya bagikan dengan cuma-cuma alias GRATIS, silahkan download dan gunakan dengan bijak. 
 
 
<div style="background-color: white; color: #666666; font-family: Roboto, sans-serif; font-size: 14px; text-align: center;">
<a class="kr_button large rounded" href="http://masholeh.web.id/blog/download/rsi_new.zip" style="-webkit-box-shadow: rgb(234, 234, 234) 0px 1px 2px, rgb(251, 251, 251) 0px 1px 0px inset; -webkit-transition: all 0.3s ease-out; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(249, 249, 249)), to(rgb(240, 240, 240))); border-bottom-left-radius: 23px; border-bottom-right-radius: 23px; border-color: rgb(222, 222, 222) rgb(216, 216, 216) rgb(211, 211, 211); border-style: solid; border-top-left-radius: 23px; border-top-right-radius: 23px; border-width: 1px; box-shadow: rgb(234, 234, 234) 0px 1px 2px, rgb(251, 251, 251) 0px 1px 0px inset; color: #31b988; cursor: pointer; display: inline-block; font-family: HelveticaNeue, Arial, sans-serif; font-size: 20px; line-height: 1em; outline: none; padding: 12px 22px; text-decoration: none; text-shadow: rgb(255, 255, 255) 0px 1px 0px; transition: all 0.3s ease-out;" target="_blank">Download</a> 
 
 
<div style="text-align: left;">
re-post from http://blog.masholeh.web.id/2014/06/download-script-website-rumah-sakit-islam-klaten.html </div>
</div>
</div>

BACA JUGA : Download Script Website Toko Online Demo Alhamdulillah-Website Rumah Sakit Islam Klaten , kali ini saya dapat berba...

06:59 +

Cara Membuat Navigasi Menu Full Color di Blog

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiw2-sP9hiR4DHt6_i434uSbeIQPcMjhhOklNOB040WdQJnfNT_nfz85HSt4ksiA7fVIypi951bpxLXBACf6ohALmZxAsB8o-s19lMUc0a61-qn80upVgeoIBhZg3qzBpwfxjzrUszFZQ/s1600/Menu+Full+Color.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Membuat Navigasi Menu Full Color di Blog" border="0" height="212" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiw2-sP9hiR4DHt6_i434uSbeIQPcMjhhOklNOB040WdQJnfNT_nfz85HSt4ksiA7fVIypi951bpxLXBACf6ohALmZxAsB8o-s19lMUc0a61-qn80upVgeoIBhZg3qzBpwfxjzrUszFZQ/s1600/Menu+Full+Color.jpg" title="Menu Navigasi Blog" width="640" /></a></div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
 </div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
M-S Blog || Cara Mudah Membuat Navigasi Menu Full Color, sangat menarik jika blog sobat di buat dengan navigasi menu seperti gambar di atas , tentu juga dengan blog sobat yang menarik akan membuat pengunjung betah dan merasa enak di pandang oleh pengunjung blog sobat . Dengan menu yang Full Color dan dapat di setting sesuai keinginan warna yang sobat mau . Sangat mudah memasang Navigasi menu Full Color ini , cuma  menambahkan class yang berisi background untuk setiap warnanya pada link menu . </div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
 </div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
Berikut Tutorial Memasangnya :</div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
 </div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
1. Masuk Blogger</div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
2. Dashboard >Pilih Template > Edit HTML</div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
3. Cari code ]]></b:skin> supaya mudah , Pake CTRL+F aja</div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
4. Masukan Code CSS tepat di atas ]]></b:skin></div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
 </div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
</div>
<div style="border: 1px solid rgb(121, 66, 10); color: #333333; height: 300px; line-height: 17.600000381469727px; overflow: auto; padding: 10px; width: 450px;">
<div style="margin: 0cm 0cm 13.5pt;">
<div class="MsoNormal" style="line-height: normal; margin-bottom: 0cm;">
<div class="MsoNormal">
navmenu { background: #111; border-bottom: 5px solid #0091d6; position: relative; height:35px; margin: 0 auto; text-transform: uppercase; z-index: 1; }<o:p></o:p></div>
<div class="MsoNormal">
ul.navfullcolor { list-style: none; padding: 0; font: 14px Arial; font-weight: bold; width:auto; line-height: 15px; margin: auto; }<o:p></o:p></div>
<div class="MsoNormal">
ul.navfullcolor li { float: left; position: relative; margin: 0px 1px 0px 0px; }<o:p></o:p></div>
<div class="MsoNormal">
ul.navfullcolor li a, ul.navfullcolor li a:link { color: #fff; text-decoration: none; display: block; padding: 10px 26px; transition: all 0.2s ease; }<o:p></o:p></div>
<div class="MsoNormal">
ul.navfullcolor li a:hover { color: #fff; transition: all 1s ease; }<o:p></o:p></div>
<div class="MsoNormal">
ul.navfullcolor li ul { display: none; top: 35px; border-top: 5px solid #FF8000; }<o:p></o:p></div>
<div class="MsoNormal">
ul.navfullcolor li:hover ul { position: absolute; display: block; padding: 0; list-style: none; }<o:p></o:p></div>
<div class="MsoNormal">
ul.navfullcolor li ul li { float: none; background: #282321; border-bottom: 1px solid #191614; border-top: 1px solid #3a3230; width:210px; }<o:p></o:p></div>
<div class="MsoNormal">
ul.navfullcolor li ul li a, ul.navfullcolor li ul li a:link { color: #aaa; display: block; }<o:p></o:p></div>
<div class="MsoNormal">
ul.navfullcolor li ul li a:hover { background: #FF8000; }<o:p></o:p></div>
<div class="MsoNormal">
.green{background-color:#01A451 !important;} .green:hover{background-color:#52e052 !important;}<o:p></o:p></div>
<div class="MsoNormal">
.yellow{background-color:#FBC700 !important;} .yellow:hover{background-color:#FFE500 !important;}<o:p></o:p></div>
<div class="MsoNormal">
.red{background-color:#D52100 !important;} .red:hover{background-color:#ff0000 !important;}<o:p></o:p></div>
<div class="MsoNormal">
.purple{background-color:#660099 !important;} .purple:hover{background-color:#D580FE !important;}<o:p></o:p></div>
<div class="MsoNormal">
.blue{background-color:#0091d6 !important;} .blue:hover{background-color:#80C8FE !important;</div>
</div>
</div>
</div>
 
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
 </div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
5. Selanjutnya letakan HTML ke dalam template,</div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
    Pilih  Tata Letak > Tambah Widget ( di Atas Pos ) pilih > HTML/Javascript. 6. Copy kode berikut ini, lalu paste ke dalam widget HTML/Javascript</div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
 </div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
</div>
<div style="border: 1px solid rgb(121, 66, 10); color: #333333; height: 300px; line-height: 17.600000381469727px; overflow: auto; padding: 10px; width: 450px;">
<div style="margin: 0cm 0cm 13.5pt;">
<div class="MsoNormal" style="line-height: normal; margin-bottom: 0cm;">
<div class="MsoNormal">
</div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<div class='navmenu'><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<ul class='navfullcolor'><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    <li><a expr:href='data:blog.homepageUrl' class='blue'>Home</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    <li><a href='http://ilmuane11.blogspot.com' class='red'>Menu 1</a><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <ul><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 1</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 2</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 3</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 4</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 5</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        </ul><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    </li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    <li><a href='http://ilmuane11.blogspot.com' class='yellow'>Menu 2</a><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <ul><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 1</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 2</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 3</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 4</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        </ul><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    </li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    <li><a href='http://ilmuane11.blogspot.com' class='green'>Menu 3</a><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <ul><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com>Sub Menu 1</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 2</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 3</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        </ul><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    </li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    <li><a href='http://ilmuane11.blogspot.com' class='purple'>Menu 4</a><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <ul><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 1</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        <li><a href='http://ilmuane11.blogspot.com'>Sub Menu 2</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
        </ul><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    </li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    <li><a href='http://ilmuane11.blogspot.com' class='red'>Menu 5</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    <li><a href='http://ilmuane11.blogspot.com' class='yellow'>Menu 6</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
    <li><a href='http://ilmuane11.blogspot.com' class='green'>Menu 7</a></li><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
</ul><o:p></o:p></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
</div></div>
</div>
</div>
</div>
 
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
7. Klik Simpan > Selseai tinggal Review deh . jangan kaget  kalau sangat keren :D</div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
 </div>
<div class="separator" style="clear: both; color: #333333; line-height: 17.600000381469727px;">
Selsai , sekian tutorial blog dari saya , semoga bermanfaat :D</div>
</div>

M-S Blog || Cara Mudah Membuat Navigasi Menu Full Color , sangat menarik jika blog sobat di buat dengan navigasi menu seperti gambar d...

04:39 +

M-S Blog

M-S Blog

M-S Blog

Mengenal Berbagai Function PHP String dan Cara Penggunaannya

Cara membuat polling atau voting dengan PHP

Cara membuat dan mendesain progress bar sendiri dengan CSS

Download Script Website Rumah Sakit Islam Klaten

Cara Membuat Navigasi Menu Full Color di Blog

Popular Posts

Blog Archive