Kata-Kata Bermakna

Kata-kata dibawah adalah kata-kata dari motivator-motivator yang membuat hidup saya lebih bermakna. Untuk selalu mengingatnya, maka saya membuat postingan ini untuk kata-kata bermakna. Mudah-mudahan berguna untuk diri saya sendiri dan sobat blogger. :)

NB:Akan terus Update.

-Tidak masalah siapa Anda, dari mana Anda berasal. Kemampuan untuk bangkit dan menang berasal dari diri Anda sendiri.

-banyak yang bilang perlahan tapi pasti. kalau bisa cepat dan pasti, kenapa mesti perlahan tapi pasti?

- Bnyk orang yg berlindung dari kalimat 'kita kan orang kecil'.Ingat, orang sukses selalu mencari solusi dari setiap masalah yg menghalanginya.

-Kalau bisa sukses di usia muda, kenapa mesti nunggu tua?

Baca selengkapnya »

Dirgahayu Republik Indonesia ke 68 Tahun

Dirgahayu Republik Indonesia ke 68 Tahun. Happy Independence Day Indonesia. MERDEKA!!!
Dengan penuh semangat membuat posting kali ini karena hari ini, Hari Kemerdekaan Republik Indonesia. Mari sobat blogger dan kawan-kawan, kita bangun negara ini menjadi lebih maju lagi, menjadi Generasi Muda yang penuh semangat, mencerdikkan anak bangsa dan lain-lain.
KSKS BLOG mengucapkan Selamat Hari Kemerdekaan Republik Indonesia ke 68 Tahun, semoga negara menjadi lebih baik lagi dari sebelumnya.

Baca selengkapnya »

Selamat Hari Raya Idul Fitri 1433 H

Sebelum saya mudik, saya dan keluar besar KSKS BLOG ingin mengucapkan Selamat Hari Raya Idul Fitri 1433 H. Minal Aidzin Wal Faidzin, Mohon Maaf Lahir dan Batin. Kenapa saya buat postingan ini sebelum hari raya Idul Fitri? Karena, saya ingin mudik dan di kampung saya tidak ada koneksi internet. Sebab itu saya membuat postingan ini sebelum hari raya.
Buat yang mudik, mudah-mudahan selamat sampai tujuan dan bisa berkumpul dengan keluarga KSKS BLOG dan sobat blogger yang lainnya :) KAMI KELUARGA BESAR KSKS BLOG INGIN MENGUCAPKAN SELAMAT HARI RAYA IDUL FITRI 1433 H. MINAL AIDZIN WAL FAIDZIN, MOHON MAAF LAHIR DAN BATIN :)

Baca selengkapnya »

Cara Membuat Readmore

Sudah kita ketahui Readmore membuat postingan kita di homepage menjadi terlihat singkat, dan simple. Tanpa readmore, pengunjung blog langsung melihat semua isi posting pada homepage.. Supaya pengunjung blog tidak langsung melihat semua isi posting pada homepage, maka kita akan membuat Readmore. Berikut caranya:
1. Cari kode </head>, letakkan kode berikut di atas kode </head>

<!-- Auto read more script -->
<script type='text/javascript'>
var thumbnail_mode = &quot;yes&quot;; //yes-dengan gambar,no-tanpa gambar
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 150;
img_thumb_width = 150;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(thumbnail_mode == "yes") {
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
<!-- Auto read more script -->

2. Cari kode <data:post.body/>  , dan ganti kode <data:post.body/> dengan kode berikut:

<!-- Auto read more Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<div class='jump-link'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>
</b:if>
<!-- Auto read more End -->

NB: KODE <DATA:POST.BODY/> ADA 3, GANTI YANG KE 3.

Semoga bermanfaat :)

Baca selengkapnya »

Cara Membuat Breadcrumbs SEO Friendly di Blog

Breadcrumbs SEO Friendly? Siapa yang tidak tahu Breadcrumbs... Yap, Breadcrumbs membuat blog kita menjadi SEO Friendly dan membuat robot Google akan mudah mencari blog kita dengan menggunakan SEO Friendly... Bagi anda yang ingin membuat Breadcrumbs SEO Friendly, simak berikut ini:

1.Login ke Blogger
2.Pilih Template
3.Klik Edit HTML
4.Cari kode ]]></b:skin>
5.Letakkan kode dibawah ini di atas kode ]]></b:skin>
 

.breadcrumbs{
padding:0px 5px 5px 0;
margin-bottom:20px;
font-size:11px;
color:#5B5B5B;
border-bottom:1px dotted #bbb;
}

7.Cari kode di bawah ini

   <b:includable id='post' var='post'>
  <div class='post'>

8.Letakkan kode dibawah ini diatas kode diatas

 <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag' title='Home'>Home</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url' title='Home'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
 &#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' expr:title='data:label.name' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:loop>
 &#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag' title='Home'>Home</a></span> &#187; <span>Unlabelled</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> &#187; <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType != &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> &#187; <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>

9.Pratinjau untuk melihat hasilnya
10.Jika sudah cocok, Simpan Template

Semoga Bermanfaat :)

Baca selengkapnya »

Cara Mengatur Jarak Sidebar Pada Blog

Tentu saja banyak para sobat blogger mengatur jarak sidebarnya masing-masing, supaya terlihat cantik, simple. dan tidak membingungkan bila sidebar dengan jarak yang dekat. Baik langsung saja ke caranya:

1.Login Blogger
2.Pilih Template > Edit HTML
3.Cari kode ]]></b:skin> (CTRL+F SUPAYA MUDAH DAN CEPAT)
4.Jika sudah ketemu , tambahkan kode berikut di atas kode ]]></b:skin>

.main-inner .widget {
margin: 15px 0px;
} 

NOTE: SESUAIKAN DENGAN SELERA ANDA

5.Klik Pratinjau untuk melihat hasilnya
6.Jika sudah cocok Simpan Template
7.Selesai

Semoga bermanfaat :)

Baca selengkapnya »

Cara Membuat Readmore Pada Blog

Siapa yang tidak tahu ReadMore? Oke, mungkin sedikit sobat blogger itu tidak tahu tentang ReadMore. ReadMore adalah penggalan sebuah artikel/posting, yang mempersingkat kalimat/ isi posting di halaman homepage, contohnya 'ReadMore' 'Baca Selengkapnya' dll.
Banyak yang tidak mengerti cara pemakaian ReadMore atau cara memasang ReadMore pada Blog. Baik langsung saja kita simak berikut ini:

1.Login akun Blogger
2.Klik Template yang ada di Dashboard
3.Pilih Edit HTML
4.Cari kode </head>
5.Jika sudah ketemu, copy kode di bawah ini dan letakkan di atas kode </head>

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>   
<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, (for blogspot)
by: http://ksks-blog.blogspot.com/
********************************************/
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

6.Save Template
7.Kemudian cari kode seperti ini

<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'>...</b:widget>

atau cari kode seperti gambar di bawah ini:

 8.Kalau sudah ketemu klik tanda panah kecil yang berwarna hitam disamping kode tersebut,maka setelah di klik akan muncul seperti gambar di bawah ini

(KLIK GAMBAR INI SUPAYA JELAS CARANYA)

9.Klik tanda panah kecil yang berwarna hitam di samping kode <b:includable id='post' var='post'>...</b:includable> (LIHAT GAMBAR SUPAYA JELAS)
10.Jika sudah di klik, cari kode <data:post.body/> di bawah kode <b:includable id='post' var='post'>...</b:includable>
11.Jika sudah ketemu, ganti kode <data:post.body/> dengan kode di bawah ini

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

NB: -KODE <data:post.body/> ADA 2, GANTI KODE YANG KEDUA

13.Save template


Semoga bermanfaat.  

Baca selengkapnya »

Modifikasi Widget Statistik Blog

Selamat Pagi sobat Blogger :) Di pagi hari ini dengan cuaca yang sedikit mendung, udara sejuk dan di temani dengan secangkir kopi yang hangat, saya siap untuk ngeposting tentang 'Modifikasi Widget Statistik Blog'.
Memodifikasi Widget Statistik Blog sangat enak untuk di lihat bagi para pengunjung yang datang ke blog kita. Makanya perlu kita memodifikasi wiget statistik blog.
Berikut caranya:
1.Login akun Blogger
2.Pada dashboard pilih Tata Letak > Tambahkan Gadget > pilih Statistik Blog (TIDAK USAH DI GANTI NAMA ATAU DI RUBAH MODEL WIDGETNYA, LANGSUNG SAJA KLIK SIMPAN LALU KLIK SIMPAN SETELAN)
3.Masuk ke Template > Edit HTML
4.Letakkan kode berikut di atas kode ]]></b:skin>

#Stats1 ul {
margin: 10px 0;
border: 0;
pandding: 0;
}

#Stats1 li {
border-left: 4px solid #333;
margin: 0;
border: 0;
background-color: #eee;
background-image: url(http://1h3.ggpht.com/-JypPIDhQgEY/UIfUN_w0jkI/AAAAAAAABOM/s_O3VHyQS1w/s194/sprites-stats.png);
background-repeat: no-repeat;
padding: 10px 10px 10px 80px;
list-style-type: none;
}

#Stats1 h4 {
margin: 0;
font-size: 22px;
line-height: 1.2em;
color: #333;
text-shadow: none;
}

#Stats1 span {
font-size: 13px;
color: #333;
text-shadow: none;
}

#totalComments {
background-position: 0 -68px;
}

#totalCount {
backrgound-position: 0 -136px;
}

5.Kemudian cari kode seperti ini

<b:widget id='Stats1' locked='false' title='Total tayangan laman' type='Stats'/>

6.Ganti kode diatas dengan kode dibawah ini

<b:widget id='Stats1' locked='false' title='Statistik' type='Stats'>
  <b:includable id='main'>
    <div class='widget-content'>
      <ul>
        <li>
          <h4 id='Stats1_totalPosts'>&amp;hellip;</h4>
          <span>Posts</span>
        </li>
        <li id='totalComments'>
          <h4 id='Stats1_totalComments'>&amp;hellip;</h4>
          <span>Comments</span>
        </li>
        <li id='totalCount'>
          <h4 expr:id='data:widget.instanceId + &quot;_totalCount&quot;'>&amp;hellip;</h4>
          <span>Pageviews</span>
        </li>
      </ul>
      <script type='text/javascript'>
//<![CDATA[
function totalPosts(json){document.getElementById('Stats1_totalPosts').innerHTML=json.feed.openSearch$totalResults.$t};function totalComments(json){document.getElementById('Stats1_totalComments').innerHTML=json.feed.openSearch$totalResults.$t};document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalPosts\"><\/script><script type=\"text/javascript\" src=\"/feeds/comments/default?alt=json-in-script&max-results=0&callback=totalComments\"><\/script>');
//]]>
      </script>
    </div>
  </b:includable>
</b:widget>

5.Simpan Template

Semoga bermanfaat.

Baca selengkapnya »

Cara Membuat Komentar Slide Panel Pada Blog

Mungkin sudah banyak yang tahu tentang 'Komentar Slide Panel' ini. Namun saya disini menjelaskan supaya lebih simple melihat komentar pada blog. 'Komentar Slide Panel' ini akan mempercantik sebuah blog dan terlihat simple. Baik langsung ke cara membuatnya:

1.Login Blogger
2.Template > Edit HTML
3.Cari kode ]]></b:skin>
4.Copy dan letakkan kode di bawah ini di atas kode ]]></b:skin>

a.openpanel {
  display:block;
  clear:both;
  width:auto;
  padding:0px 0px;
  text-align:center;
  font-weight:bold;
  line-height:32px;
  background-color:#39f;
  color:white;
  text-decoration:none;
  margin:0px 0px;
  -webkit-box-shadow:0px 1px 1px rgba(0,0,0,0.2);
  -moz-box-shadow:0px 1px 1px rgba(0,0,0,0.2);
  box-shadow:0px 1px 1px rgba(0,0,0,0.2);
  position:relative;
}

a.openpanel em {
  width:0px;
  height:0px;
  display:block;
  position:absolute;
  top:15px;
  right:15px;
  border:6px solid transparent;
  border-top-color:white;
}

a.openpanel.active {background-color:#900;}

a.openpanel.active em {
  top:6px;
  border-color:transparent transparent white transparent;
}

div.paneline {
  height:0px;
  border-bottom:4px solid #39b;
}

div.hompiPanel {
  padding:10px 20px 20px;
  -webkit-box-shadow:inset 0px 1px 7px rgba(0,0,0,0.2);
  -moz-box-shadow:inset 0px 1px 7px rgba(0,0,0,0.2);
  box-shadow:inset 0px 1px 7px rgba(0,0,0,0.2);
  margin:0px 0px !important;
}

5. Cari kode </head>
6.Copy dan letakkan kode di bawah ini di atas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
//<![CDATA[
var panelSelector       = '#comments',
    openPanelText       = "Poskan Komentar",
    closePanelText      = "Tutup Komentar",
    slideDownPanelSpeed = 600,
    slideUpPanelSpeed   = 400;
//]]>
</script>
<script src='http://reader-download.googlecode.com/svn/trunk/blogger-slide-panel-comments.js' type='text/javascript'></script>

7. Simpan Template

Semoga bermanfaat....

Baca selengkapnya »

Cara Membuat Tombol Back To Top Pada Blog

Back to top. Siapa yang tidak tahu Back To Top? Sudah tidak di ragukan lagi Back To Top itu. Tombol Back To Top tombol yang sangat berguna buat kita yang senang blogging. Kegunaannya untuk otomatis untuk scroll ke atas. Jadi, kita tidak usah repot-repot lagi untuk mengscroll sendiri. Back ToTop ini sangat perlu untuk blog, apa lagi bila blognya sering di kunjungin sobat blogger.
Baik, kita langsung menuju cara pembuatannya:

1.Login ke Blogger
2.Pilih Template
3.Masuk ke Edit HTML
4.Cari kode </body> , CTRL+F supaya lebih mudah dan cepat
5.Copy kode di bawah ini dan letakkan di atas kode </body>. (JIKA KODE DIBAWAH INI SUDAH ADA DI TEMPLATE SOBAT BLOGGER SEBAIKNYA TIDAK USAH DI PASANG KODE DI BAWAH INI)

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

6.Copy kode dibawah ini dan letakkan di atas kode </body> 

 <script src='http://bloggerpeer.googlecode.com/files/backtotop.js' type='text/javascript'/>
<a href='#' style='display:scroll;posisition:fixed;bottom:5px;right:5px;' title='Back to Top'><img onclick='MGJS.goTop();return false;' src='http://1.bp.blogspot.com/-FjrYiE6C8ZY/TqJMQWu2osI/AAAAAAAAADI/GFdFWFPIO6o/s1600//back-to-top.gif'/></a>

NB: KODE LINK YANG BERWARNA MERAH BISA DI GANTI SESUAI ANDA.

7. Simpan Template

Semoga bermanfaat...

Baca selengkapnya »

Cara Menghilangkan Tulisan Langgan Entri (Atom)

Terkadang tulisan 'Langgan: Entri (Atom)' atau tulisan 'Subscribe to: Post (Atom)' mengganggu untuk menampilkan blog yang cantik,simple.
Siapa sih yang tidak mau blognya yang cantik? Blog cantik pasti para pengunjung blog akan tertarik melihat blog kita dan berulang-ulang kali akan mengunjungi blog kita yang cantik.
Sebagian sobat blogger banyak yang ingin menghilangkan tulisan 'Langgan: Entri (Atom)' supaya tidak mengganggu untuk menjadi tampilan menarik dan di sukai pengunjung.
Berikut caranya:

TUTORIAL 1

1.Login Blogger
2.Masuk ke Template
3.Klik Edit HTML
4.Cari kode dibawah ini, CTRL+F supaya cepat

<b:include data='feedLinks' name='feedLinksBody'/>

5.Jika sudah ketemu hapus kode di atas.
6.Simpan Template

TUTORIAL 2

1.Login Blogger
2.Masuk ke Template
3.Klik Edit HTML
4.Cari kode dibawah ini, CTRL+F supaya cepat

<div class='feed-links'>
  <data:feedLinksMsg/>
  <b:loop values='data:links' var='f'>
     <a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
  </b:loop>
  </div>

5.Jika sudah ketemu hapus kode di atas.
6.Simpan Template.

TUTORIAL 3

1.Login Blogger
2.Masuk ke Template
3.Klik Edit HTML
4.Cari kode dibawah ini, CTRL+F supaya cepat.

]]></b:skin>

5.Simpan kode dibawah ini diatas kode ]]></b:skin>

.feed-links {display: none;}

6.Simpan Template.


NB: -Pilih salah satu tutorial di atas.

Semoga bermanfaat.
 

Baca selengkapnya »

Cara Menyembunyikan Sidebar Di Homepage

Selamat malam sobat blogger :)
Menyembunyikan sidebar,footer, dll di homepage atau di halaman posting tentu saja akan berguna untuk menampilkan blog menjadi cantik, simple. minimalistic.
Banyak yang bertanya-tanya bagaimana menyembunyikan sidebar,footer, dll di homepage atau di halaman posting, khususnya yang bertanya adalah sobat blogger begitu pula saya sendiri. Dulu saya bingung untuk menyembunyikan sidebar,footer, dll di homepgae atau di halaman posting... Dan saya menemukan caranya untuk menyembunyikannya...
Simak berikut ini:

1.Login ke blogger. kalau belum punya silahkan kesini
2.Masuk ke Template dan pilih Edit HTML
3.Cari kode sidebar,footer,widget yang ingin anda sembunyikan. Saya beri contoh disini Sidebar

4.Tambahkan kode dibawah ini, dan taruh diatas kode <div id='sidebar'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>

5.Tambahkan kode dibawah ini, dan taruh di bawah kode </div>

</b:if>

6.Sehingga hasilnya akan seperti ini

7.Simpan Template.


Begitu saja cara untuk Menyembunyikan Sidebar,Footer, Dll Di Homepage.
Tunggu tutorial-tutorial berikutnya dari KSKS-BLOG .
Semoga bermanfaat :)

Baca selengkapnya »

Tempat Meletakkan Menu Navigasi Blogger

Pagi sobat Blogger :)
Pagi-pagi yang sejuk di temani secangkir kopi dan perasaan campur aduk karena tadi pagi telah melihat pertandingan Final konfederensi 2013 antara Brazil vs Spanyol yang di menangkan oleh Brazil :(

Oke langsung saja ya :)

• Untuk meletakkan Navigasi di bawah header dan di atas header, cari kode di bawah ini:

<div id='header-wrapper'>
    <b:section class='header' id='header' maxwidgets='1'>
        <b:widget id='Header1' locked='true' title='KSKS-BLOG (Header)' type='Header'/>
    </b:section>
</div>

Disini kamu BUKAN melihat kode <div id='header-wrapper'> dan jangan terfokus pada ID atau CLASS, tetapi fokuslah melihat judul blog kamu atau melihat kode title='KSKS-BLOG (Header)'. Dari situ padangan matamu ke arah atas dan bawah sampai menemukan kode yang di atas yaitu <div dan kode yang di bawah yaitu </div> 

Untuk meletakkan Menu Navigasi di atas header, letakkan kode menu navigasi yang sudah kamu salin di atas kode <div id='header-wrapper'>. Sedangkan untuk meletakkan Menu Navigai di bawah header, letakkan kode menu navigasi yang sudah kamu salin di bawah kode </div>.

• Meletakkan Navigasi di atas wilayah posting, cari kode di bawah ini:

<div id='main-wrapper'>
    <b:section class='main' id='main' showaddelement='no'>
        <b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'/>
    </b:section>
</div>

Letakkan kode yang sudah kamu salin di bawah kode <div id='main-wrapper'>. 

• Sekarang coba klik pratinjau. Jika sudah puas simpan template kamu, lalu masuk ke tahap penyesuaian dan pemahaman lebih lanjut.

PENYESUIAN DAN PEMAHAMAN LEBIH LANJUT.

• Setiap unit meu di definisikan sebagai:

<li><a href='#'>Nama Menu'</a></li>
kamu bisa dengab mudah melihat nama menu yang akan tampil nantinya dengan melihat teks di dalam wilayah kekuasaan <a href='#'>teks. . .?</a>

• Oleh karena itu:

(Sebagai contoh) untuk membuat menu Beranda, gantilah simbol # dengan URL homepage blog kamu, lalu gantilah Nama Menu menjadi Beranda sehingga menjadi seperti ini:
<li><a href='ksks-blog.blogspot.com'>Beranda</a></li>

Semoga bermanfaat :)

Baca selengkapnya »

Cerita Singkat KSKS-BLOG Membuat Template Blog Sendiri

Setelah sudah lama tidak ngeposting dan akhirnya rank yang tadinya paling bawah menjadi lebih paling bawah :d hehe...
Malam-malam begini waktu yang nganggur akhirnya di gunakan untuk ngeposting blog sambil ditemani cemilan+kopi :d

Oke lanjut ke Cerita KSKS-BLOG Membuat Template Blog Sendiri :)

Mungkin banyak sahabat-sahabat saya yang bertanya tentang template blog saya ini...
Banyak yang tanya "Mengapa kok template blog KSKS-BLOG menjadi berubah tampilan bagus sekali?". Saya rasa tampilan blog saya cukup sederhana dan masih di titik terendah tidak seperti blog-blog yang lainnya.
Saya bukan ahli IT, Blogger dll yang bisa membuat template sendiri seperti ahli IT, Blogger yang lainnya. Template blog saya ini hanya meniru dari template blog yang lain. Mungkin sebelumnya saya meminta maaf yang telah meniru blog-blog kalian :) saya hanya seorang yang bukan ahli Blogger, maka dari situ saya suka meniru template-template blog yang lain. Pada saat saya membuka Template > Edit HTML saya mulai terkejut karena saya tidak tahu apa ini dan tidak mengerti cara memodifikasinya. Karena saya belum mengerti apa-apa tentang blog dari situ saya mulai mencari template blog download-tan yang dari google. Dan saya mulai membaca-baca tentang blog di blog orang lain. Hasil dari membaca-baca itu saya mulai sedikit mengerti cara memodifikasinya. Saya perlahan-perlahan membaca tentang blog dan akhirnya menjadi bukit. Dan sekarang saya sudah mulai mengerti tentang blog, tetapi masih pemula :) Ya mungkin Blog saya ini bisa bermanfaat untuk yang lain :) Berkat blog-blog yang lain saya bisa menjadi seperti ini :) Terima Kasih untuk blog-blog yang lain yang sudah membuat saya mulai leluasa di dunia Blogger:) Keep Posting :)

Baca selengkapnya »

Cara Menambakan Emoticon Pada Posting Blog

Setelah mendapatkan kejutan yang menarik pagi hari tadi, dan saya juga senang karena Raksasa Jerman  Bayer Munchen berhasil mempermalukan Barcelona dengan skor 3-0 tanpa balas dengan begitu Agregat menjadi 7-0  ...
Ok masuk pada pembahasan utama, disini saya akan share cara memunculkan emoticon pada halaman posting sehingga postingan menjadi lebih hidup dan menarik tentunya..   Ini merupakan tutorial lanjutan dari "Menambahkan Emoticon Pada Komentar" sebenarnya mudah saja, jika anda sudah menambahkan emoticon pada komentar blogspot dengan tutorial lanjutan tersebut tidak perlu lagi menambahlan javascript emoticon untuk posting blog, kita hanya tinggal menambahkan kode css ".post-body" saja pada javascript untuk memunculkan emoticonya agar emoticon juga tampil pada postingan.
Kurang lebih seperti ini: 

<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function () {emoticonx({
emoRange:"#comments p, .post-body, div.emoWrap",
putEmoAbove:"iframe#comment-editor",
topText:"Klik untuk melihat code!",
emoMessage:"Untuk memasukkan emoticon setidaknya ada satu spasi sebelum kode emoticon."
})
});
//]]>
</script>

 Tambahkan tanda koma ( , ) diakhir .post-body sehingga menjadi seperti ini .post-body,

Kemudian tambahkan kode css berikut ini dibawah kode ]]></b:skin>

<style>

.emo.delayLoad { display:inline; text-align:left; margin:0; box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none; border:none; background-color:transparent; width:auto; height:auto; border-radius:none; -moz-border-radius:none; -webkit-border-radius:none }

</style> 

 Tutorial diatas untuk anda yang sudah menerapkan Emoticon pada komentar dengan mengikuti tutorial "Menambahkan Emoticon Pada Komentar Blogspot" dari blog ini ataupun dari MKR-Site.

Tutorial 2

Bagi anda yang hanya ingin menambahkan emoticon pada postingan saja, ikuti langkah-langkah berikut ini:
1. Letakkan kode jquery berikut ini diatas kode </head> 

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>

Itu merupakan kode jQuery, jika pada template anda sudah terdapat kode jquery maka tidak usah ditambahkan lagi, atau anda juga bisa mengganti jQuery yang ada pada template anda untuk jaga-jaga kalau nanti emoticonya tidak bisa muncul.  
Ingat !! saya tidak bosan-bosanya untuk mengingatkan bahwa pada setiap template hanya boleh terdapat satu jQuery-min dan satu jQuery-UI-min.

2. Letakkan kode CSS berikut ini dibawah kode ]]></b:skin>

<style>

.emo.delayLoad { display:inline; text-align:left; margin:0; padding:1px; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; border:none; background-color:transparent; border-radius:none; -moz-border-radius:none; -webkit-border-radius:none }

</style> 

 3. Letakkan kode berikut ini diatas kode </body>

<script type='text/javascript'>

//<![CDATA[

// kode js untuk menampilkan emoticon

jQuery(document).ready(function () {emoticonx({

emoRange:".post-body, div.emoWrap",

})

});

//]]> 

</script>

<script src='https://boyz.googlecode.com/svn/JS/emoticonnya.js' type='text/javascript'/>

 Simpel kan?? hanya saja saya tidak menggunakan hosting untuk java scriptnya karena itu bisa terhapus kapan saja, saya lebih memilihnya untuk menguraikan saja kodenya dan meletakkannya didalam template jadi lebih aman..

Semoga bermanfaat :)

Baca selengkapnya »

Cara Menambahkan Emoticon Pada Komentar Blogspot

Menambahkan Emoticon pada komentar bertujuan agar komentator bisa mengekxpresikan diri dengan emoticon yang ada agar suasana pada saat berkomentar menjadi lebih hidup. Kode Emoticon dari MKR-Site dan saya beri sedikit tambahan CSS agar lebih menarik;
Berikut cara memasang Emoticon pada komentar Blogspot:
1. Login Akun Blogger anda
2. Pada Dashboard pilih Template » Edit HTML
3. Cari kode </body> kemudian letakkan kode berikut ini diatasnya!

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<script type='text/javascript'>

//<![CDATA[

jQuery(document).ready(function () {emoticonx({

emoRange:"#comments p, div.emoWrap",

putEmoAbove:"iframe#comment-editor",

topText:"Klik untuk melihat code!",

emoMessage:"Untuk memasukkan emoticon setidaknya ada satu spasi sebelum kode emoticon."

})

});

//]]>

</script>

<script src='https://boyz.googlecode.com/svn/JS/emoticonnya.js' type='text/javascript'/>

</b:if>

 4. Untuk lebih menarik tambahkan kode CSS berikut ini dan letakkan diatas kode ]]></b:skin>

.emoWrap {

  position:relative;

  padding:10px;

  margin-bottom:7px;

  background:#fff;

/* IE10 Consumer Preview */ 

background-image: -ms-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);

/* Mozilla Firefox */ 

background-image: -moz-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);

/* Opera */ 

background-image: -o-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);

/* Webkit (Safari/Chrome 10) */ 

background-image: -webkit-gradient(linear, right top, left top, color-stop(0, #FFFFFF), color-stop(1, #FFF9F2));

/* Webkit (Chrome 11+) */ 

background-image: -webkit-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);

/* W3C Markup, IE10 Release Preview */ 

background-image: linear-gradient(to left, #FFFFFF 0%, #FFF9F2 100%);

  border:3px solid #860000;

  -moz-border-radius:5px;

  -webkit-border-radius:5px;

  border-radius:5px;

  box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);

  -moz-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);

  -webkit-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);

  box-shadow:0 2px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);

  font-weight:normal;

  color:#333;

}

.emoWrap:after {

  content:"";

  position:absolute;

  bottom:-10px;

  left:10px;

  border-top:10px solid #860000;

  border-right:20px solid transparent;

  width:0;

  height:0;

  line-height:0;

}

 5. Simpan Template

Pembaharuan tutorial 22 Maret 2013
» Jika di klik emoticonnya dan kodenya tidak muncul.. ganti jQuery pada template anda dengan jQuery dibawah ini:

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>

  Letakkan jQuery tersebut diatas kode </head> 
NB: Tidak boleh lebih dari satu kode jQuery pada template.  

Update Artikel, 11 April 2013
// Cara menambahkan/mengganti emoticon yang sudah ada..
Syarat: Harus pasang emoticon terlebih dahulu dengan mengikuti cara diatas.

1. Ganti kode <script src='https://boyz.googlecode.com/svn/JS/emoticonnya.js' type='text/javascript'/>
dengan kode yang sudah di uraikan seperti ini

<script type='text/javascript'>

//<![CDATA[

window.emoticonx = (function () {

    var b = function  {

        var j = m || {}, l = j.emoRange || "#comments p, div.emoWrap",

            k = j.putEmoAbove || "iframe#comment-editor",

            h = j.topText || "Klik untuk melihat kode!",

            a = j.emoMessage || "Untuk memasukkan emoticon setidaknya ada satu spasi sebelum kode emoticon.";

        $(k).before('<div style="text-align:center" class="emoWrap"> :)            :&gt;)                      <br/><b>' + h + "</b><br/>" + a + "</div>");

        var i = function (c, d, e) {

            $(l).each(function () {

                $(this).html($(this).html().replace(/<br>:/g, "<br> :").replace(/<br>;/g, "<br> ;").replace(/<br>=/g, "<br> =").replace(/<br>\^/g, "<br> ^").replace(c, " <img style='max-height:24px' src='" + d + "' class='emo delayLoad' alt='" + e + "' />"))

            })

        };

        i(/\s:\)\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZmkKBeCyhLRC0y4nAeLmjLK4Sl1rW8znLz7ixait47sMAiYlxWU2zVevtYf_wnBL1bZLvn5HRdTc_EismWRdw4Kq-I8QA64llHwyxfbBDxv0f2YajrGIF2QF4LUN9cMC9_xhRL4RunDU/s36/03.gif", ":))");

        i(/\s;\(\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaQ9grsPp1E3opG6jX_EJL2dFtf-uHEsbXXwl_y9DsV9ULyMcpmu1V_59GmDjILo4_WtJg9e6bbxcgT97JCTg68u3egsyL9HV6uoVEf0YGBPYn7GXEQ7cQgzQOh4vYxfr9rBkyntbqwT4/s47/06.gif", ";((");

        i(/\s:\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikbqJmid0kz8y60BqDvrIq0VgHrGWwU1qk8bpkZsJwiCHgMOypm_m5lKRvR-CPHVv6zVgYSEdqn8MvQMB2wgd6Hw6dvBU2tZsQBVXiiYZZ8n2o9Mp_BqGYEOHH6s8CVjbfI_2j1FjqDUI/s36/01.gif", ":)");

        i(/\s:-\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_T_PSL0zhTY6bEEXR251KGeplAdvYnymNevXOis5j_bnjH2b5QqbNlbEcqmN8VTbSfqPav83agK_n9GhBFuLIG9h8bXwFQEYh3firZPxXQEO_eGkPXGTHMJpxqORhdULeAA9NKBwN7FU/s36/02.gif", ":-)");

        i(/\s=\)\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnseLjmj7I0tBo1VjeiZTMR4zItU3vmY9wVH0FOViDUSx6b7qFGwh7tAxdOTISKGT8nh1Cc41daq3VngAgUOEahHyso64_FVRZf5_zsVBMEp4-jo_R35xRSmLXU7rslqmI2OxVcibLTak/s36/03a.gif", "=))");

        i(/\s;\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6gdc6tQdnATDPa1AgLXI4LlsBGCgL1C0J4LAOxrwN1JrE97By6WRXnwUxCAC4qG69ImJT8BhOUWxldIq1dbhrz-RqqPjzrkKWPipm5JT6SGLgPsw2fnHd9jiOXPp3JC4amWL4Hwy8oWw/s36/04.gif", ";(");

        i(/\s;-\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis5j8WEiYh8yusSQBdlswi2pIqMZuOwotg9wYui8kiolrdOh-jLKSOc0vcr0YEG4QY7UkgYYLjD8ZpOccd2skP4MLD1cmwejahJwiVS1ARQPyKnZp_LQkkkSL3W0oqREKHWCmZclMlUj4/s36/05.gif", ";-(");

        i(/\s:d/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCox1Fhh1YLPNzQ0LMcKohDEB45hqinR2pApnqeDhyphenhyphenhbjOcy_ZmLe08veGfxCkoB2ih5md9OTzRQ9cac_JP2_PmlekFyrwjiOgvGuBpsxUSIY9pfp0h04nvySe52Cr2rX_ERqNHr0Hpbg/s36/7.gif", ":d");

        i(/\s:-d/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzIqf5lxG7SiT8u5SYz3okYf2XitUVrygj0pdFWWbE51DKU8LwtEu1b5cc6eOHhLfV1E7JbURAfaeU5v5mojgw0CpXzzncXSvT6yEbzFRMmf-Li4NxAExciySuQ9jkcd1kvoyyavbahug/s36/8.gif", ":-d");

        i(/\s@-\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIByqQbCiJBekkwk5JIsh3S8eEry8igH1b5PUK8n2sDhboHC2lt5Ju3_r1pLczq0dtMXICWUfRVv3Zua6rc529FTMe3jiFPds2N4mAG5Ga1ToD6B3AKNE2_9RgHBQxqJVN2tEaVS9sFxY/s36/09.gif", "@-)");

        i(/\s:p/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikXjS5-FWsGg0NaY4OQ5j5xLa6AHw-yzPvhW-8mcShIQJr9IE4BBRL4Og4qWxqDT2AyT8FkNT6x_zdCm2zYTiItYRqsbundM0TRuxdr07JQaSOoziwXRsQuG0MqLEfGgDyJ3xEeQc2exQ/s36/10.gif", ":p");

        i(/\s:o/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgviDFsHEpKMX1pXVPEYAGkSaNi3A2m1H1vMlL7VKMheCLZcKlJGH_Ss8NnHwFxuBP7YrSFx0nvplmABIRoi4uUHJM5-SOPIKyfMz0SKrsvUD16Pq5cjpg09ttffhxeAEXXp8YEDYWOqbE/s36/11.gif", ":o");

        i(/\s:&gt;\)+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi84J78J-rCjk_2KZRIZlWLWjaVW6JrkpSmBtZt49bS95t9ZDxKW6JFRu-VeNeBD2hqwF4LM7GB4ZufdYb5Pn4M62fQR2brQCMck_00bNRiyY1si8LmvBwGxsCcAEYgUpnTXBLmsqU4wtQ/s36/12.gif", ":&gt;)");

        i(/\s\(o\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_vA7A5EZfhmi1r0NtTJWNXTXw_F25PJQmwENi_DZx0dxA6nXpB3tEV9Rb8i_4oV1mCy7NqLqn21ANeycpX8SxThvehOC9I9K79CNS6hx4TPJuij_v8ug43lOlfP6yz9ZTvE6T449J78Y/s36/13.gif", "(o)");

        i(/\s\[-\(+/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhteRTXZL80Xt41Ctw-M0tvWlkz7sPEjGlCmEC9-64AU-SGZS91Re1koQ5jLq_H-bsxPgVT7lHeP4p0B3LwHHuMGB2o0V7PYd1t8Ml00qVtkf3uJWbMYnxwTAqXbTRSkas-OdliCVXf7x4/s36/14.gif", "[-(");

        i(/\s:-\?/g, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg21lFgo93txKko9jAvOrSX_hCDsQRVYxQq102x8nZc3IZt7mXjaijvuK57LVa_1pL4vS-ERuwUqm0u5P1u0Sa1RpnjpEoWLuGx8ADc3Se5rxmbYffMifLESwox-EYehd3peaiBumPyS-c/s36/15.gif", ":-?");

        i(/\s\(p\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAbfjxK1m1xEyPvKrfExrL6pqH92kGZ61m3weFdAYDNfxkUaJZwavRSFQcV9Gg74v5cNLygEvNDEcQg0Leacx8vM4vznT-dVBR-uRa2dyHJyd38zndXrbWtg_5PsYwrFHkZmZ1ZdZnVB4/s36/16.gif", "(p)");

        i(/\s:-s/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEift5rsstJeJkVfDKem2RblW1CtONqQ8RkViIhsnbBDmtIuspTboAZGfB7vNRPP1xsNAWou7mYV8QTMwGybYqipowEvJrrSX9CAN8_U-Y76oB3N0KtVb1VEOIVnDY141aziX2wHaf_hOI8/s36/17.gif", ":-s");

        i(/\s\(m\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMCem2TGjUGpPd6-FgzIx_fWUtC2zYVXyaHdskthAX73QmeR2jX8InQmz7jX4nKvrlZVNokwmuqJFGIGHu-AjrxsOOAn8eFu2IjvXH01CHSxqddM1YxUVoqnwjQ-BUbZbuvsUTmo44LEE/s36/18.gif", "(m)");

        i(/\s8-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzKJe8dtPXNGBs5-R732DIH7dI0iNFdzOnlRVplvbGaZcwi-DvHU6J__UMtiJ5CL83dwgxqJ_9QNkuUZ8Vz42rzEAb5Kepb9d3zcQW34r6rOWRWLOK4VYRBspKBekt1go32X_gRaoR0fA/s36/19.gif", "8-)");

        i(/\s:-t/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_Gv-AD4IWbdMmdqoAs8tAYuZz618jQ7DYp1W0VipUvEGvAAUNQ5hPVi7nki5BMwqsoxUfqMFTvFDCiUJHN11MdRmLSkqpNNs2AXIkOr-yavi48si07T_UTfZ0CE9072MRK3C7jLJpc1U/s36/20.gif", ":-t");

        i(/\s:-b/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3bOMEHE9kzovTVlOr9LulCpnivG5FgthDzpMqAqYxCEFrhJhIWrsS_pOfl80UHl295pAWakbDPO5iATfUfvtfVdrHd8HqJ56My3TqxYfPDzbMn_u5G2887lpuvC8-bSprT3orSG4nA34/s36/21.gif", ":-b");

        i(/\sb-\(+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1KgDyWvg_jJewSb7I4dx3_lv7UYMvf0x9UfktFxff9C718wu49d8yLE03CXnD3NLYJ8C7ILhWnp99tsOqE18r9tHdiejBoPPA9UERUObbuNOtYennNimFpg3Dd5bSOX8VHxruftmUSCU/s35/22.gif", "b-(");

        i(/\s:-#/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcxdER_ojh_tmcj8FkEZ8neWamllhUw8BMu7en60VP6gsvyvYKQd1KNO2fmXo1iRK87XN6EbYEcKgAHsRjP9GO3R23Bb8lVNYimKvDtnWQGuhizJEM9yQQnVEBf8u0KfSThWRgTC2271U/s36/23.gif", ":-#");

        i(/\s=p~/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWkSBTQiae_s-2m2fTNRl0T7vrdjEp7HsgJzq6YVMvZT25kgBcgsshnWe8MWJ9BxGv8oUu-KMDa0vBj1KmgJbX4ydSc5zz2RHZs7RTyZo6lJPzACMgS4zlnStSeGYXLsCDGKzAM_injWU/s36/24.gif", "=p~");

        i(/\s\$-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiB4ymDeFwjMXDero-KVsmlaP-iRy1YFo5Dq9N7AciL18PaZ64wYSIBvTJ4NmvBvM_3hhCyb3g02Rwy-Lzv1QL4lV_a1cii3RKwv6XiOSXV_7pFL7DRRBwE2Z1JKz-7e6hgzfarnH2z2ek/s36/25.gif", "$-)");

        i(/\s\(b\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3WJLsRp04b9lgkqUaZeVOQ2daAammu-gw2JvXlW0apsFbvI16MzUZftsqjIdqjoTeYzS_fpKymQEvPxGbPMob-9-K9KjFuxoFhYKS-uDu-HZDcVUdYAGG_tX4NjHbbvsb4DCMsIhlpTw/s36/26.gif", "(b)");

        i(/\s\(f\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhko95gLqpICyqMYnWblC-liR2zIZeC4Lpbj2Z7TlipfZf0PBEuaxuE-sGxTCRzbo6WBD8pvKQaQR9jIgwfyv_Rn3fpOtVeo4zP_JzLeB6YJWoCnJCYc37VHIy1HJae9QIQ_-ia7CiIeks/s36/27.gif'", "(f)");

        i(/\sx-\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5B2xsFA67GeY6ush4oGxJeUx9DMA_Y4RGF66Kr0-IeBqYZuAXiet-xeXfLsFsP7Rc_OMT1Cj01cNGsBFSKd66avbYhTJhYhTAH1xjNFsC9kIWuh8RIsqDmWjCvsbXlXx6ManTI9SP7tY/s36/28.gif", "x-)");

        i(/\s\(k\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilrX1Vkx24ZOQUsYYHXayd0i7GluItMzOQx2ph_P_lkpAPDpVlnMA12NFpfc3avvKlr42U7lvURECaNUWiGog4m8ChuLvJtX0-5kdhhUEGlKyq54viCvaDiTr9NxER6Sc36pYjEOdi18s/s36/29.gif", "(k)");

        i(/\s\(h\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjACJZ7PrqPmR38kve88CESnT6ShFdXSnTpumWYYz-N86emihunDVtSE7KooYcz94BFgemIhY-cp0vyAz5KaZ9mxiHbyETJL1tz5rkLhSESlN-t6WsgLwhld8Kd2Vfbi6VSS1nYYX-6MZc/s36/30.gif", "(h)");

        i(/\s\(c\)+/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_zBipJczxQNgB7gSE1NnITrjNGmcfAJuA0sEDRZY9Q3b-sF5oEInzRPSEttNjIOLrWbUwhWd381VzuQ-WSXDOsgd4jQZ6wRMkM_jw4DLyukC9zjVi4ae_GHNKKPrajp22aiLM3HeFwEY/s36/31.gif", "(c)");

        i(/\scheer/ig, "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1nhpakyNzH7_Q48kxKQt7vGS_BqCcd9VpwkrBmBECYdFhgURc9Q5y_ksJTFGJvygZy8FOm-XXmPP5-nV4zdNA5XNOssQHXv4lQs1sPf0ufKu-50bahJfxBA1nwhQetxwZ8Tn1vRZEzGA/s36/32.gif", "cheer");

        $("div.emoWrap").one("click", function () {

            if (a) {

                alert(a)

            }

        });

        $(".emo").css("cursor", "pointer").live("click", function  {

            $(".emoKey").remove();

            $(this).after('<input class="emoKey" type="text" size="' + this.alt.length + '" value=" ' + this.alt + '" />');

            $(".emoKey").trigger("select");

            c.stopPropagation()

        });

        $(".emoKey").live("click", function () {

            $(this).focus().select()

        })

    };

    return function (a) {

        b(a)

    }

})();

//]]>

</script>

 2. Kode yang berwarna MERAH itu merupakan simbol untuk emoticon. Jika ingin ditambahkan beri jarak atau satu spasi dibelakang simbol yang ada. Contoh seperti ini

:)            :>)                      (12) (13) 

 angka (12) dan (13) merupakan simbol untuk emoticon baru.
3. Lihat kode yang berwarna BIRU, itu merupakan kode emoticon. jika ingin menambahkan emoticonya lihat contoh seperti ini

        i(/\scheer/ig,  "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1nhpakyNzH7_Q48kxKQt7vGS_BqCcd9VpwkrBmBECYdFhgURc9Q5y_ksJTFGJvygZy8FOm-XXmPP5-nV4zdNA5XNOssQHXv4lQs1sPf0ufKu-50bahJfxBA1nwhQetxwZ8Tn1vRZEzGA/s36/32.gif",  "cheer");

        i(/\s\(12\)+/ig, "URL EMOTICON ANDA", "(12)");

        i(/\s\(13\)+/ig, "URL EMOTICON ANDA", "(13)");

 (12) dan (13) itu merupakan simbol untuk memunculkan emoticonya dan ganti URL EMOTICON ANDA dengan  URL gambar emoticon anda.

Silahkan anda sesuaikan sendiri, Semoga Bermanfaat..:)

Baca selengkapnya »