Menggunakan Syntax Highlighter pada blogspot

Sebenarnya sudah cukup banyak tutorial, tips dan trik mengenai penggunaan
Syntax Highlighter atau mencoba untuk menampilkan source code pemograman
pada sebuah posting atau blog...nah cara yang saya gunakan untuk menampilkan
Syntax Highlighter ini adalah sebagai berikut

1. kamu harus masuk terlebih dahulu ke blogspot kamu
2. kemudian kamu pilih dan klik Design 
3. kemudian kamu pilih dan klik Edit HTML
4. kemudian cari tulisan Expand Widget Templates dan beri tanda centang
5. kemudian pada box dibawah nya kamu cari tulisan ]]></b:skin> 
6. jika sudah ketemu copy dan paste lah code di bawah ini, diatas tulisan ]]></b:skin>
Spoiler klik -->:

/**
* 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 .
*/
/************************************
* 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;
}

7. jika sudah masih pada box kamu cari tulisan </head>
8. jika sudah ketemu copy dan paste lah code di bawah ini, diatas tulisan </head>
Spoiler klik -->:

9. selanjutnya masih pada box kamu cari tulisan </body>
10. jika sudah ketemu copy dan paste lah code di bawah ini, diatas tulisan </body>
Spoiler klik -->:

kemudian Save template selesai....settingan sederhananya kurang lebih seperti itu, dan untuk menggunakan nya kita hanya tinggal mengetikkan code di bawah ini

Spoiler klik -->:

source code nya

kemudian masukkan source code nya yang di ingin kan ...jadi kamu mengetikan manual pada setiap posting kamu yang ingin menggunakan Syntax Highlighter ini....oiya jika di perhatikan disini saya menggunakan brush: php; nah kawan bisa saja menggantinya dengan brush: css;, brush: js;, brush: cpp; dan lain-lain sesuai dengan kebutuhan dan modul yang tersedia pada Syntax Highlighter-nya.

Ok mudah-mudahan bermanfaat



Source Guru Ku dan Buku Ku