Failure is an Options!

Keep Strugle for what you want to achieve

The Future is in your hand,

Future bright only if you have a plan and action to making happen.

The Maturity and Wisely!

Success people always have positive vibe with maturity of thinking and wisely attitude in living

The time is limited

Never waste your time, Because time is precious like a life and money

Sabtu, 18 Juni 2011

Membuat Read More untuk Blog

Menampilkan Read More di BlogggerCara membuat read more di Blogspot atau blogger sangat mudah, hanya dengan manupulasi CSS display:none yaitu meng-hiden teks yang tidak ingin ditampilkan di home, archive dan halaman label. Sebenarnya teknik ini bisa digunakan untuk menerapkan salah satu teknik Black Hat SEO di blogspot, untuk teknik SEO haram ini tidak akan saya bahas disini, yang berminat silakan explore dan dicoba sendiri. 

Berikut ini langkah-langkah untuk membuat read more blogger :

* Silakan login ke blogger.com, klik link Layout (Tata Letak) kemudian klik link Edit HTML .

* Aktifkan list Expand Template Widget, agar source script template blogger nya terlihat secara keseluruhan. 

* Tepat di atas atau sebelum tag </head> masukkan kode berikut seperti ini: 


<style>
<b:if cond='data:blog.pageType == "item"'>
span.hidenpost {display:inline;}
div.hidenpost {display:inline;}
<b:else/>
span.hidenpost {display:none;}
div.hidenpost {display:none;}
</b:if>
</style>
# Kemudian Cari <data:post.body/> dan tambahkan kode berikut tepat dibawahnya:
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Baca selengkapnya <data:blog.pageTitle/></a>
</b:if>
# Selesai. Sekarang setiap posting letakkan
<span class="hidenpost"> sisa postingan yang akan dihiden, akhiri dengan </span> (ketika memasukkan <span class="hidenpost"> dan </span> posting harus dalam mode Edit HTML bukan Compose ) pastikan juga diantara <span class="hidenpost"> dan </span> tidak boleh ada <span> jika tidak bisa dihindarkan gunakan <div class="hidenpost/fullpost"> dan </div>
demikian juga sebaliknya

Panduan Lengkap dan Tutorial PHP MySQL Indonesia Untuk Pemula

Hai.. Buat teman-teman yang baru mulai belajar PHP, berikut ada panduan lengkap dan tutorial PHP dan MySQL bahasa Indonesia. Di sini kamu akan mengenal apa dan bagaimana PHP, mengenal MySQL, cara membuat tabel dan memanipulasi tabel di MySQL. Cara mengedit, delete, update data di MySQL menggunakan PHP, Belajar fungsi-fungsi yang berguna di PHP, dan sebagainya. Berikut adalah daftar isi dari Panduan Lengkap dan Tutorial PHP MySQL Indonesia Untuk Pemula, untuk versi lengkapnya dan akan selalu ditambah/diupdate bisa langsung ke : http://blog.codingwear.com/panduanphp Pengennya buat PHP Manual Indonesia, tapi untuk tahap awal segini dulu, ntar akan terus diupdate dan ditambah. 


Daftar Isi :

  1. Pengenalan PHP

    1. Apa Itu PHP?
    2. Instalasi PHP
    3. Sintaks PHP
    4. Variabel di PHP
    5. Operator di PHP
    6. Kondisional di PHP
    7. Looping (Pengulangan) di PHP
       
  2. Pengenalan MySQL

    1. Apa Itu MySQL
    2. Koneksi ke MySQL Melalui PHP
    3. Cara Membuat Database di MySQL
    4. Cara Membuat Tabel
       
  3. Manipulasi Tabel MySQL

    1. Cara Insert ke Tabel MySQL
    2. Cara Menampilkan Rows Tabel MySQL
    3. Cara Delete Rows Tabel MySQL
    4. Cara Update Tabel MySQL
    5. mysql_num_rows - Menghitung jumlah baris dari query yang dihasilkan
       
  4. Fungsi String

    1. addslashes — Memberi garis miring pada tanda kutip
    2. chr — Menghasilkan karakter yang spesifik berdasarkan kode ascii
    3. count_chars — Menghitung frekuensi munculnya karakter di suatu string
    4. explode — Membagi string menjadi array
    5. htmlspecialchars — Konversi karakter khusus ke HTML entities
    6. implode — Menggabungkan element array ke suatu string
    7. md5 — Menghasilkan enkripsi md5
    8. nl2br — Memasukan HTML
      di setiap baris baru
    9. number_format — Format angka dengan dengan menggroupkan ribuan
    10. ord — Menghasilkan nilai ASCII suatu karakter
    11. parse_str — Mengubah string menjadi variabel
    12. print — Mencetak string, sama dengan echo
    13. str_pad — Menempatkan string ditempat yang panjangnya ditentukan
    14. str_repeat — Mengulang string
    15. str_replace — Mengganti string yang dicari dengan string pengganti
    16. str_shuffle — Mengacak string
    17. str_split — Mengubah string ke array
    18. str_word_count — Menghitung jumlah kata dalam string
    19. strip_tags — Menghilangkan tag HTML dan PHP
    20. stripslashes — Menghilangkan garis miring tanda kutip di string
    21. strlen — Mendapatkan panjang string
    22. strrev — Membalikkan string
    23. substr_replace — Mengganti teks pada bagian tertentu string
    24. substr — Menghasilkan bagian dari string
       
  5. Autentikasi dengan Session

    1. Pendahuluan
    2. Cara Membuat atau Register Session
    3. Cara Mengecek Session Telah Teregister
    4. Cara Un-Register Session (Log Out)
    5. Contoh Sederhana Session
       
  6. Fungsi Tanggal dan Waktu (Date/Time)

    1. date - Format tanggal dan waktu lokal
    2. getdate — Mendapatkan informasi tanggal/waktu
    3. mktime — Mendapatkan timestamp Unix untuk suatu tanggal
    4. strtotime — Mengubah string tanggal/waktu (bahasa inggris) ke timestamp Unix.
    5. time — Menghasilkan timestamp Unix saat ini
    6. Contoh : Mencari selisih hari antara 2 tanggal
       
  7. Upload File

    1. Upload Dengan Metode POST
    2. Multiple Upload File
Selengkapnya di http://blog.codingwear.com/panduanphp 

Membuat Aplikasi Chatting Dengan PHP & Ajax

Sekarang mari kita membuat aplikasi chatting dengan menggunakan php ajax dan mysql sebagai database. Di sini kita memanfaatkan ajax untuk komunikasi client (browser) ke server. Ajax setiap detik akan melakukan request ke server (tanpa harus refresh). Di sini kita bisa memanfaat fungsi setTimeout() pada javascript. Fungsi setTimeout() berguna untuk me-set timer setiap berapa per milisecond javascript mengeksekusi suatu fungsi, 
 
contoh : setTimeout("ambilPesan()",1000);

Kode di atas berarti, eksekusi fungsi ambilPesan() setiap 1000 milisecond. Mari kita lihat konsep untuk membuat aplikasi chatting: 1. Kita buat objek ajax yang nantiya bertugas melakukan komunikasi ke server 2. User memasukkan nama, yang nantinya kita simpan dalam suatu variabel 3. Ketika user selesai mengetik pesan, masukkan ke dalam database melalui ajax 4. User, baik kita sendiri atau orang lain, setiap 1 detik akan mengecek ke server, apakah ada pesan baru, jika ada tampilkan. Sekarang mari kita mulai membuat kode-kodenya Berikut adah struktur tabel drzchat di database :
--
-- Table structure for table `drzchat`
--
CREATE TABLE `drzchat` (
  `nomor` int(3) NOT NULL auto_increment,
  `nama` varchar(20) NOT NULL,
  `pesan` varchar(200) NOT NULL,
  `waktu` varchar(10) NOT NULL,
  PRIMARY KEY  (`nomor`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

Pertama-tama mari kita buat halaman untuk chat di browser. drzchat.html
<html>
<head>
<title>
DRZ Chat 1.0
</title>
<script>
var ajaxku = buatAjax();
var tnama = 0;
var pesanakhir = 0;
var timer;
function taruhNama(){
    if(tnama==0){
        document.getElementById("nama").disabled = "true";
        tnama = 1;
    }else{
        document.getElementById("nama").disabled = "";
        tnama = 0;
    }
    ambilPesan();
}
function buatAjax(){
    if(window.XMLHttpRequest){
        return new XMLHttpRequest();
    }else if(window.ActiveXObject){
        return new ActiveXObject("Microsoft.XMLHTTP");
    }
}

function ambilPesan(){
    namaku = document.getElementById("nama").value
    if(ajaxku.readyState == 4 || ajaxku.readyState == 0){
        ajaxku.open("GET","ambilchat.php?akhir="+pesanakhir+"&nama="+namaku+"&sid="+Math.random(),true);
        ajaxku.onreadystatechange = aturAmbilPesan;
        ajaxku.send(null);
    }
}

function aturAmbilPesan(){
    if(ajaxku.readyState == 4){
        var chat_div = document.getElementById("div_chat");
        var data = eval("("+ajaxku.responseText+")");
        for(i=0;i<data.messages.pesan.length;i++){
            chat_div.innerHTML += "<font color=red>"+data.messages.pesan[i].nama+"</font> ";
            chat_div.innerHTML += "<font size=1>("+data.messages.pesan[i].waktu+")</font> ";
            chat_div.innerHTML += " : "+data.messages.pesan[i].teks+"<br>";
            chat_div.scrollTop = chat_div.scrollHeight;
            pesanakhir = data.messages.pesan[i].id;
        }
    }
    timer = setTimeout("ambilPesan()",1000);
}

function kirimPesan(){
    pesannya = document.getElementById("pesan").value
    namaku = document.getElementById("nama").value
    if(pesannya != "" && document.getElementById("nama").value !=""){
        ajaxku.open("GET","ambilchat.php?akhir="+pesanakhir+"&nama="+namaku+"&pesan="+pesannya+"&sid="+Math.random(),true);
        ajaxku.onreadystatechange = aturAmbilPesan;
        ajaxku.send(null);
        document.getElementById("pesan").value = "";
    }else{
        alert("Nama atau pesan masih kosong");
    }
}

function aturKirimPesan(){
    clearInterval(timer);
    ambilPesan();
}
function blockSubmit() {
    kirimPesan();
    return false;
}
</script>
</head>
<body>
Nama : <input type=text name=nama id=nama>
<input type=button value=login id=tmbl_login onclick=taruhNama()><p>
<div id="div_chat" style="height: 300px; width: 500px; overflow: auto; background-color: lightyellow; border: 1px solid #555555;">

</div>
<form onSubmit="return blockSubmit();">
Pesan : <input type=text name=pesan id=pesan size=50>
<input type=button value="kirim" onclick="kirimPesan()">
</form>
</body>
</html>


Pada kode drzchat.html di atas, setelah user mengisi nama, lalu klik tombol login, maka kita menjalankan fungsi taruhNama(), yang berguna untuk mengunci nama yang sudah diketik sebagai user name di chatting. Setelah itu kita manjalankan fungsi ambilPesan(), yang berfungsi melakukan request ke server apakah ada pesan yang terbaru dari database. Jika ada pesan terbaru maka kita ambil dan taruh di browser dengan menggunakan fungsi aturAmbilPesan(). Apabila kita sudah mengetik pesan, javascript akan menjalankan fungsi kirimPesan(). Untuk mengerti apa itu readyState, onreadystatechange silahkan download tutorial pengenalan ajax di sini. Pada kode di atas objek ajax melakukan request atau komunikasi dengan file php server, yaitu file ambilchat.php. 
Berikut kodenya : 

<?php
mysql_connect("localhost","root","");
mysql_select_db("test");

$nama = $_GET['nama'];
$pesan = $_GET['pesan'];
$waktu = date("H:i");
$akhir = $_GET['akhir'];

$json = '{"messages": {';
if($akhir==0){
    $nomor = mysql_query("select nomor from drzchat order by nomor desc limit 1");
    $n = mysql_fetch_array($nomor);
    $no = $n['nomor'] + 1;
    $json .= '"pesan":[ {';
    $json .= '"id":"'.$no.'",
              "nama":"Admin",
              "teks":"Selamat datang di chatting room",
              "waktu":"'.$waktu.'"
              }]';
    $masuk = mysql_query("insert into drzchat values(null,'Admin','$nama bergabung dalam chat','$waktu')");
}else{
    if($pesan){
        $masuk = mysql_query("insert into drzchat values(null,'$nama','$pesan','$waktu')");

    }
    $query = mysql_query("select * from drzchat where nomor > $akhir");
    $json .= '"pesan":[ ';
    while($x = mysql_fetch_array($query)){
        $json .= '{';
        $json .= '"id":"'.$x['nomor'].'",
                  "nama":"'.htmlspecialchars($x['nama']).'",
                  "teks":"'.htmlspecialchars($x['pesan']).'",
                  "waktu":"'.$x['waktu'].'"
                  },';
    }
    $json = substr($json,0,strlen($json)-1);
    $json .= ']';
}

$json .= '}}';
echo $json;
?>


File ambilchat.php mempunya fungsi utama memasukkan pesan ke database dan sekaligus mengecek apakah ada pesan terbaru dengan cara melakukan query "select * from drzchat where nomor > $akhir". Variabel $akhir kita dapat dari variabel yang dikirim oleh objek ajax, yang sebenarnya juga berasal field nomor pada tabel drzchat. Format data yang dikirim oleh server menggunakan format JSON, JSON (JavaScript Object Notation) adalah format pertukaran data yang ringan, mudah dibaca dan ditulis oleh manusia, serta mudah diterjemahkan dan dibuat (generate) oleh komputer. Format ini dibuat berdasarkan bagian dari Bahasa Pemprograman JavaScript, Standar ECMA-262 Edisi ke-3 - Desember 1999. JSON merupakan format teks yang tidak bergantung pada bahasa pemprograman apapun karena menggunakan gaya bahasa yang umum digunakan oleh programmer keluarga C termasuk C, C++, C#, Java, JavaScript, Perl, Python dll. Oleh karena sifat-sifat tersebut, menjadikan JSON ideal sebagai bahasa pertukaran-data. Beberapa orang lebih suka JSON, karena paling mudah untuk mem-parse-nya, hanya menempatkan sebuah eval dan selesai sudah Silakan Download Turorial JSON di sini

Download Source Code

Pengertian CSS dan Cara Penerapan CSS pada HTML

Pada artikel saya kali ini saya akan menjelaskan sedikit tentang pertanyaan rekan pixar ataupun yang lainnya tentang CSS. Apa yang dimaksud dengan CSS?! CSS adalah singkatan dari Cascading Style Sheet, digunakan untuk mengatur style atau tampilan dari dokumen HTML. Menurut wikipedia, CSS adalah suatu bahasa stylesheet yang digunakan untuk mengatur tampilan suatu website, baik tata letak, jenis huruf, warna, dan semua yang berhubungan dengan tampilan atau gaya suatu web.
Mengapa harus memakai CSS?!
Penggunaan CSS merupakan standar untuk web-web modern (Web 2.0). Sebagian pembaca mungkin sudah tau bahwa implementasi CSS, Table Less dan Semantik tapi tidak Divitis (maniak div) merupakan standarisasi web yang baik. Saya sendiri sebetulnya tidak peduli apakah CSS adalah Standar Web ataupun Bukan, menurut saya kita memang harus melakukan implementasi CSS untuk setiap perancangan website kita karena dengan CSS kita tidak akan melakukan hal-hal yang terus diulangi dalam menerapkan suatu gaya pada tag HTML yang kita buat, cukup satu kode untuk semua mark up yang sama.
Lalu bagaimana teknik implementasi CSS pada tag HTML yang kita buat?!
Ada dua cara yang bisa diterapkan untuk menggunakan CSS pada web. Cara yang pertama adalah dengan membuat CSS langsung didalam satu file HTML kita (internal / inline style sheet). Cara yang kedua adalah dengan cara memanggil CSS tersebut dari file CSS tersendiri (external style sheet). selanjutnya mari kita langsung praktek silahkan buka dreamweaver anda atau text editor, dsb :

1. Internal Style Sheet

Cara membuat internal Style Sheet adalah dengan menambahkan tag sehingga kode HTML menjadi sebagai berikut
?













<html>
<head>
<title>Belajar CSStitle>
<style type="text/css">
<style>
<head>
<body>
</body>
</html>

Ok, sekarang anda paham kan dimana kita harus menerapkan CSS dengan cara internal Style Sheet.. Tapi saya tau anda tidak puas kalau saya hanya menerangkan dimana saya harus meletakan CSS nya. kurang seru tanpa praktek membuat web CSS, betul tidak?! Ha... karena itu mari kita mulai membuat website dengan teknik CSS. berikut gambar proyek web table less dengan penerapan CSS kita kali ini


Bagaimana cara membuatnya ?!
Pertama-tama kita buat tag html sebagai berikut :
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<html>
<head>
<title>CSS Pertamakutitle>
<style type="text/css">
  
style>
head>
<body>
  
<ul class="navbar">
    <li><a href="index.html">Homea>
    li><li><a href="about.html">Abouta>
    li><li><a href="gallery.html">Gallerya>
    li><li><a href="links.html">Linksa>
li>ul>
   
<h1>CSS Pertamakuh1>
<p>Selamat datang di Web CSS kup>
<p>Halo ini website CSS ku, mungkin tidak ada gambar
  disini tapi setidaknya ini punya gayap>
<p>Harusnya ada lebih gaya markup disini tapi saya tidak
  tahu bagaimana membuatnya,
  apakah ada yang bisa memberitahu?!p>
   
<p>hubungi saya kalo ada yang bisa karena
saya sedang mati gayap>
<address>Made 12 Juni 2009 by myself.address>
body>
html>
Tag HTML tersebut akan menghasilkan document website yang dapat dilihat pada gambar sebagai berikut

Uek, jelek bukan hasilnya, maka dari itu sekarang mari kita tambahkan gaya untuk tag HTML tersebut dan menambahkan mark up CSS pada tag HTML, ganti tulisan dengan markup sebagai berikut
?
1
2
3
4
5
6
body {
    padding-left: 11em;
    font-family: Georgia, "Times New Roman", Times, serif;
    color: white;
    background-color: #555555
}
Kegunaan dari tag diatas adalah untuk memberi jarak lapisan (padding), warna dan jenis font yang kita gunakan serta warna latar dari web ( body HTML ). Untuk Warna anda bisa dengan langsung menambahkan jenis warna seperti black, white, purple, yellow, red, dsb, atau jika warnanya unik anda bisa menambahkan kode warna seperti #8c1f1f ( untuk merah tua ). Kode warna ini bisa anda dapatkan dari photoshop. Ok sebelum melanjutkan bila belum mengetahui kegunaan masing-masing properti CSS seperti padding, color, background dsb, silahkan baca postingan saya mengenai dasar CSS di link ini Pengertian dan Tutorial Dasar CSS untuk Pemula dan link ini Penjelasan menggunakan Styling CSS untuk Model Persegi Kolom - Box Model : Border, Padding, Margin, Outline
Sekarang kita mark up CSS untuk tag HTML ul. bila anda perhatikan tag UL mengandung class :

Jumat, 10 Juni 2011

Membuat Syntax Highlighter vers3.0

Hi kawan Blogger apa kabar? saat ini saya ingin berbagi pengetahuan lagi tentang membuat apa ya? !!! cz soalnya saya sendiri kemarin-kemarin nyari sendiri apa keywoardnya di google susah juga ketemunya soale ga tau namanya!! tapi Alhamdullilah setelah saya temukan saya sekarang tau namanya yaitu "membuat tampilan hightlighter untuk blog" itulah keywordnya! OK langsung aja je TKP (*Tempat kita praktek :p) Untuk membuatnya silahkan login dulu ke Blogger kalian dan kemudian ikuti tahap selanjutnya dibawah ini:
1. Pilih Rancangan --> EDIT HTML (centang expand template widget)
2. Simpan CSS berikut Diatas kode  
]]></b:skin>


/**
* SyntaxHighlighter
* http://alexgorbatchev.com/
*
* SyntaxHighlighter is donationware. If you are using it, please donate.
* http://alexgorbatchev.com/wiki/SyntaxHighlighter:Donate
*
* @version
* 2.1.364 (October 15 2009)
*
* @copyright
* Copyright (C) 2004-2009 Alex Gorbatchev.
*
* @license
* This file is part of SyntaxHighlighter.
*
* SyntaxHighlighter is free software: you can redistribute it and/or modify
* it under the terms of the GNU Lesser General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* SyntaxHighlighter is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with SyntaxHighlighter. If not, see <http://www.gnu.org/copyleft/lesser.html>.
*/
/************************************
* Default Syntax Highlighter theme.
*
* Interface elements.
************************************/
.syntaxhighlighter
{
background-color: #fff !important;
}
/* Highlighed line number */
.syntaxhighlighter .line.highlighted .number
{
color: black !important;
}
/* Highlighed line */
.syntaxhighlighter .line.highlighted.alt1,
.syntaxhighlighter .line.highlighted.alt2
{
background-color: red !important;
}
/* Gutter line numbers */
.syntaxhighlighter .line .number
{
color: #f7f5f5 !important;
background-color: #c0bfbf !important;
}
/* Add border to the lines */
.syntaxhighlighter .line .content
{
color: #000 !important;
}
.syntaxhighlighter.printing .line .content
{
border: 0 !important;
}
/* First line */
.syntaxhighlighter .line.alt1
{
background-color: #f5f5f5 !important;
border-top: white solid 5px !important;
}
/* Second line */
.syntaxhighlighter .line.alt2
{
background-color: #f5f5f5 !important;
border-top: white solid 5px !important;
}
.syntaxhighlighter .toolbar
{
background-color: #c0bfbf !important;
}
.syntaxhighlighter .toolbar a
{
color: #a0a0a0 !important;
}
.syntaxhighlighter .toolbar a:hover
{
color: red !important;
}
/************************************
* Actual syntax highlighter colors.
************************************/
.syntaxhighlighter .plain,
.syntaxhighlighter .plain a
{
color: #000 !important;
}
.syntaxhighlighter .comments,
.syntaxhighlighter .comments a
{
color: #008200 !important;
}
.syntaxhighlighter .string,
.syntaxhighlighter .string a
{
color: #0404ab !important;
}
.syntaxhighlighter .keyword
{
color: #cf0202 !important;
font-weight: bold !important;
}
.syntaxhighlighter .preprocessor
{
color: black !important;
}
.syntaxhighlighter .variable
{
color: #a70 !important;
}
.syntaxhighlighter .value
{
color: #d4af02 !important;
}
.syntaxhighlighter .functions
{
color: #ff1493 !important;
}
.syntaxhighlighter .constants
{
color: #2a8506 !important;
}
.syntaxhighlighter .script
{
background-color: yellow !important;
}
.syntaxhighlighter .color1,
.syntaxhighlighter .color1 a
{
color: #d301d1!important;
}
.syntaxhighlighter .color2,
.syntaxhighlighter .color2 a
{
color: #ff1493 !important;
}
.syntaxhighlighter .color3,
.syntaxhighlighter .color3 a
{
color: red !important;
}
3. Sekarang simpan script berikut diatas kode </head>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shCore.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shLegacy.js' type='text/javascript'></script>

<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushBash.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushCpp.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushCSharp.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushCss.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushDelphi.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushDiff.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushGroovy.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushJava.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushJScript.js' type='text/javascript'></script>

<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPerl.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPhp.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPlain.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPython.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushRuby.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushScala.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushSql.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushVb.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushXml.js' type='text/javascript'></script>

<link href='http://alexgorbatchev.com/pub/sh/2.1.364/styles/shCore.css' rel='stylesheet' type='text/css'/>


4. Sekarang lanjut ke bagian paling bawah dan cari kode </body>
5. Simpan kode berikut diatas kode </body> tadi

<script type='text/javascript'>
SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/2.1.364/scripts/clipboard.swf';
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.all();
</script>
6. Simpan Template kalian! Selesai deh hadoh.. lumayan sulit jga ya!! :)

Untuk pemanggilannya pada postingan, kalian silahkan menggunakan kode berikut :

1. untuk menyimpan css
<pre class="brush: css;">
SIMPAN CSS YANG AKAN DIPASANG DISINI
</pre>

2. Untuk menyimpan Js
<pre class="brush: js;">
SIMPAN Script Js YANG AKAN DIPASANG DISINI
</pre>


Catatan :
Lakukan langkah No.1, 2 pada tahap pemasangan setiap kalian membuat postingan dan ingin menampilkan kode-kode pada postingan kalian.


Selesai dech..... Semoga bermanfaat ya ...

Yang Punya Syntax Highlighter : Alex Gorbatchev | http://alexgorbatchev.com/SyntaxHighlighter/

 
<head>Mantap GAN ya PUyeng Sirah hehe!</head>
HeuU!!^^