Sabtu, 29 Oktober 2011

sedihnya hatiku


andai dia tau disini aq merindukannya
andai dia bisa merasakan apa yang kurasa
mungkin batin ini tak kan terluka
karna diriku kian terlupa

namun dia tiada mengerti isi hatiku
bagaikan salju yang menusuk sekujur tubuhku
bekukan hati yang kian terpenjara
sayang ku tak bisa meronta


masa cepatlah berputar
ku ingin beranjak ke masa bahagia
ku tak ingin terus terpaku disini
meratapi kekecewaan hati ini

karya mezzi oktavia

Sabtu, 22 Oktober 2011

hujan

tetes hujan membasahiku
mengingatkanku padamu
lamunan ku melayang jauh
tanpa ku sadari air mataku tlah terjatuh
kapan hujan ini berlalu
dingin ini terus menusukku
hingga ke jantung ku
aku rindu
pelukanmu

ingin ku ulang kembali kisah kita
saat engkau dan aku saling mencinta
izinkan
ku meminta
ku ingin kembali padamu

Karya Mezzi Oktavia

Cara Membuat Slide Recent Post Blogger






tidak usah basa basi langsung aja soalnya lagi sibuk
pertama masuk blogger.
rancangan.
Elemen Laman.
add gadget/tambah gadget.
copy paste code di bawah ini:




<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

<script language='javascript'>

imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 255;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 70;

thumbheight = 70;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = true;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://www.niamblog.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>
setelah itu simpan dan lihat hasilnya.
Jangan lupa ganti url http://www.niamblog.com dengan url blog kamu.


Efek scroll pada widget pengikut dan arsip follower & blog archive


Langkah-langkah yang harus dilakukan untuk menambahkan efek scroll pada widget Blogger, yang tidak bisa diedit dari halaman "elemen laman" adalah: 

Langkah pertama kita harus masuk ke akun kita di Blogger dan buka halaman "tata letak" --> "edit HTML", dan tidak perlu dicentang "expand widget template"

Langkah kedua temukan kode seperti dibawah ini:
]]></b:skin>
Kemudian letakkan kode dibawah, tepat diatas kode diatas:
#BlogArchive1 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

Sehingga akan terlihat seperti dibawah ini:
#BlogArchive1 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

]]></b:skin>

Langkah ketiga adalah temukan barisan kode seperti dibawah ini:
<b:widget id='HTML10' locked='false' title='' type='HTML'/>
<b:widget id='LinkList1' locked='true' title='' type='LinkList'/>
<b:widget id='HTML6' locked='false' title='' type='HTML'/>
<b:widget id='Followers1' locked='false' title='FriendBlog' type='Followers'/>
<b:widget id='HTML9' locked='false' title='' type='HTML'/>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
<b:widget id='HTML12' locked='false' title='' type='HTML'/>
Kemudian cari widget yang ingin anda tambah dengan efek scroll, misalnya saya ingin menambahkan efek tersebut di widget pengikut, yang memiliki kode seperti dibawah ini. Anda dapat mengetahui keberadaan widget yang anda kehendaki, dari kode title=''.
<b:widget id='Followers1' locked='false' title='FriendBlog' type='Followers'/>

Langkah ke empat adalah copy id widget diatas (yang berwarna hijau), dan letakkan di kode yang telah tersedia sebelumnya (di atas ]]></b:skin>). Caranya dengan mengganti kode berwarna merah dengan id widget yang berwarna hijau. Sehingga akan terlihat seperti dibawah ini:
# Followers1 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

]]></b:skin>
Langkah terakhir adalah simpan template anda, dan lihat perubahan di blog anda. Mudah bukan? Sebagai penutup, anda dapat mengganti tinggi efek scroll dengan mengganti ukuran height menjadi sesuai kebutuhan anda. Bagi widget yang anda tidak beri nama, maka title akan kosong, hal ini menuntut kepekaan dan intuisi anda untuk menemukan widget yang ingin anda rubah secara tepat.


Credithttp://musyariaulia.blogspot.com/2011/03/efek-scroll-pada-widget-pengikut-dan.html

Cara Daftar Buat Domain Gratis CO.CC

Daftar Buat Domain Gratis CO.CC

Bagaimana cara Daftar buat Domain Gratis dan bikin account di CO.CC, merubah blogspot (custom domain) dan wordpress.com (domain mapping) ke alamat nama.co.cc
Oleh Multimedia Ponpes Al-Khoirot

DAFTAR ISI

1. Cara daftar domain gratis di CO.CC
2. Cara mengatur URL Forwarding/Redirection di CO.CC
3. Cara merubah blogspot.com ke CO.CC
4. Cara merubah wordpress.com ke CO.CC
5. Cara menambah NS (Name Server) 000webhost.com ke CO.CC
5. Cara menambah NS (Name Server) bammz.com ke CO.CC



Saya ingin berlatih punya domain sendiri. Bagaimana cara daftar domain gratis di CO.CC?

Ikuti langkah berikut:

DAFTAR NAMA DOMAIN PILIHAN & BUAT ACCOUNT/AKUN DI CO.CC

1. Daftar dengan mengklik link berikut: co.cc/regist
2. Setelah www. ketik nama yang diinginkan di kotak. Contoh, alkhoirot
3. Klik Check Availability -> klik Continue to registration apabila alamat available (tersedia). Apabila sudah ada yang punya, buat nama lain.
4. Klik Create an Account now (paling bawah) untuk daftar
5. Isi formulir dan kasih tanda tik pada "I accept the Terms of Service" (lihat gambar)
6. Retype password (tulis lagi password) saat tadi daftar isi formulir -> klik Continue
7. Sign-in/log-in/masuk dengan username (email) dan password
8. Sign-in/log-in berhasil -> Selamat! Anda sudah berhasil buat domain dan account di CO.CC. -> klik Set Up (lanjut di bagian kedua)

CARA BUAT SETELAN/SETTINGS DOMAIN DI CO.CC dg URL FORWARDING

Apa itu URL Forwarding?

URL Forwarding adalah mengarahkan/meneruskan/redirect sebuah alamat domain ke alamat situs lain. Contoh, situs alkhoirot.co.cc diarahkan ke http://donlotppa.wordpress.com. Jadi, saat alkhoirot.co.cc diklik, pengunjung akan masuk ke situs donlotppa.wordpress.com

Bagaimana cara buat setting/setelan URL Forwarding di Co.CC?

Ikuti langkah berikut:

1. Setelah Sign-in/Masuk ke CO.CC -> di My Domain (menu kiri) -> klik Select Domain -> pilih domain yang akan diedit -> klik URL Forwarding
2. Kasih tanda tik/klik pada URL Forwarding (sebelah kiri bawah)
3. Isi formulir untuk URL Forwarding
a. Redirect to: isi dengan alamat blog anda di blogspot.com atau wordpress.com
b. Pada Page Title: Isi dengan judul situs.
4. Klik Set Up -> klik OK. Selesai.

CARA MERUBAH BLOGGER BLOGSPOT KE CO.CC (CUSTOM DOMAIN)

A. Setelan/settings di CO.CC

1. Setelah Sign-in/Masuk ke CO.CC -> di My Domain (menu kiri) -> klik Select Domain -> pilih domain yang akan diedit
2. Klik CNAME
3. Pada “Host” isi dengan domain co.cc Anda. Contoh www.alkhoirot.co.cc
4. Pada “TTL” pilih 1D
5. Pada “Type” pilih CNAME
6. Pada “Value” isi dengan: ghs.google.com
7. Klik “Set up.”.
6. Selesai.

B. Setelan/settings di blogger.com

1. Login ke blogger.com Anda.
2. Klik Setelan/Settings
3. Klik Penerbitan/Publishing
4. Klik Domain Ubahsuaian /Custom Domain
5. Klik -> Beralihlah ke setelan lanjut
6. Pada "Domain Anda” -> Isi alamat domain Anda di kotak. Contoh: www.alkhoirot.co.cc (harus pakai www.)
7. Isi verifikasi kata.
8. Klik “Simpan setelan”.
9. Kasih tanda tik pada "Mengarahkan contoh.co.cc ke www.contoh.co.cc
10. Verifikasi kata lagi -> Simpan Setelan. Selesai.

Kalau ada ucapan Selamat! berarti sudah berhasil.

Penting: untuk update blog tetap melalui blogger.com


CARA MERUBAH WORDPRESS.COM KE CO.CC (DOMAIN MAPPING)

Penting: kita harus membayar USD 10 (Rp 100.000) pada Wordpress.com setiap tahun untuk domain mapping ini.

A. Setelan/settings di CO.CC

1. Masuk ke account CO.CC Anda
2. Di My Domain, pilih domain yang akan disetting
2. Klik Name Server (menu kiri)
3. Pada name server 1, isi dengan: NS1.WORDPRESS.COM
4. Pada Name Server 2, isi dengan: NS2.WORDPRESS.COM
5. Klik Set up

B. Setelan/settings di Wordpress.com

1. Masuk/login ke account wordpress.com Anda.
2. Klik Settings atau Pengaturan
3. Klik Domain-domain
4. Tambahkan alamat URL co.cc Anda di kotak yang tersedia. Contoh, www.alkhoirot.co.cc
5. Klik Tambahkan nama domain ke blog.
6. Kalau proses ini ok, maka Anda akan diarahkan (redirect) ke situs lain untuk membayar $10 dolar (minimal) untuk setahun pada wordpress.com dengan kartu kredit atau paypal. Karena ini termasuk program upgrade.
7. Selesai.

Penting: Anda tetap update blog melalui alamat wordpress.com anda sebelumnya.
Contoh, apabila blog sebelumnya adalah http://contoh.wordpress.com, maka login/masuknya melalui http://contoh.wordpress.com/wp-login.php


CARA MENAMBAH NS (NAME SERVER) 000webhost KE DOMAIN CO.CC

1. Masuk ke account CO.CC Anda
2. Di My Domain, pilih domain yang akan disetting
3. Klik Name Server (menu kiri) -> klik Set up (kalau sebelumnya sudah ada NS hosting lain)
4. Pada name server 1, isi dengan: ns01.000webhost.com
5. Pada Name Server 2, isi dengan: ns02.000webhost.com
6. Klik Set up

co.cc ns name server


CARA MENAMBAH NS (NAME SERVER) BAMMZ.COM KE DOMAIN CO.CC

1. Masuk ke account CO.CC Anda
2. Di My Domain, pilih domain yang akan disetting
3. Klik Name Server (menu kiri) -> klik Set up (kalau sebelumnya sudah ada NS hosting lain)
4. Pada name server 1, isi dengan: ns1.bammz.net
5. Pada Name Server 2, isi dengan: ns2.bammz.net
6. Klik Set up


Credithttp://www.alkhoirot.net/2011/10/daftar-buat-domain-gratis-cocc.html

Cara membuat Menu Tab View



Menu Tab View
Cara Membuat Menu Tab View ini adalah sbb. :
  1. Masuk ke Dashboard , Pilih Layout , lalu klik Edit HTML
  2. Backup template dulu dengan  Download Full Template
  3. Kemudian cari kode ini ]]></b:skin>
  4. Untuk memudahkan pencarian , pakai saja Ctrl +F , terus ketik kata yang dicari dikotak yang disediakan, lalu klik next. 
  5. Kemudian masukkan kode berikut ini sebelum kode ]]></b:skin>
    /* Menu Tab View
    ----------------------------------------------- */
    div.TabView div.Tabs {widht:100%;
    padding-top: 0px;
    height: 24px;
    overflow: hidden;
    }
    /* Menu Utama */
    div.TabView div.Tabs a {
    float: left;
    display: block;
    width: 110px; /* ukuran lebar menu */
    text-align: center;
    height: 30px; /* ukuran tinggi menu */
    padding-top: 7px;
    margin-right:4px; /* jarak antarmenu */
    vertical-align: middle;
    border: 1px solid #ccc; /* warna border menu */
    border-bottom-width: 0;
    margin:0px;
    padding: 5px 0;
    font-family:Arial,Helvetica,sans-serif;
    font-size:12px;
    font-weight:bold;; /* besar hurup menu */
    background-color: #4c4c4c; /* warna latar menu */
    color: #FFFFFF; /* warna hurup menu */
    -moz-border-radius-topleft:15px;
    -moz-border-radius-topright:15px;
    -webkit-border-top-left-radius:15px;
    -webkit-border-top-right-radius:15px;
    }
    div.TabView div.Tabs a.Active {
    background-color: #FFFFFF; /* warna background menu aktif */
    color: #000000;
    }
    div.TabView div.Tabs a:hover {
    background-color: #999999; /* warna background menu hover */
    color: #FFFFCC;
    font-weight: bold;
    }
    /* Kotak Utama */
    div.TabView div.Pages {
    clear: both;
    border: 1px solid #CCC; /* warna border kotak utama */
    overflow: hidden;
    background:#FFFFFF; /* background kotak utama */
    }
    div.TabView div.Pages div.Page {
    height: 100%;
    padding: 7px;
    overflow: hidden;
    }
    div.TabView div.Pages div.Page div.Pad {
    padding: 5px 0px;
    font-size: 12px; /* besar hurup kotak utama */
    }
    /* tabview css end */
  6. Perhatikan text-text yang berwarna pink, silahkan disesuaikan ya.
  7. Selanjutnya pasang kode berikut ini sebelum kode </head>
    <script src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/tabview.js' type="text/javascript"/>
  8. Jika sudah tinggal Save Templates
  9. Selesai …  untuk langkah pertama,
  10. Langkah ke dua Silahkan masuk kemenu "Page Elements"
  11. Klik  "Add a Gadget" ,  pilih "HTML/Javascript"  ,
  12. Kemudian copy paste kode dibawah ini :
<form action="tabview.html" method="get">
<div class="TabView" id="TabView">
<div class="Tabs" style="width: 260px;">
<a>Menu 1</a>
<a>Menu 2</a>
<a>Menu 3</a>

</div>
<div class="Pages" style="width: 256px; height: 270px;">
<div class="Page">
<div class="Pad">
Tab 1.1 <br />
Tab 1.2 <br />
Tab 1.3 <br />

</div></div>
<div class="Page">
<div class="Pad">
Tab 2.1 <br />
Tab 2.2 <br />
Tab 2.3 <br />

</div></div>
<div class="Page">
<div class="Pad">
Tab 3.1 <br />
Tab 3.2 <br />
Tab 3.3 <br />

</div></div>
</div></div>
</form>
<script type="text/javascript">
tabview_initialize('TabView');
</script>
Catatan :

  • Angka warna pink adalah tinggi dan lebar tab view, silahkan disesuaikan
  • Kode yang berwarna Biru Adalah text  Menu utama
  • Kode yang berwarna merah adalah isi dari tab view tsb.
  • Saya juga pernah posting Membuat Dropdown Navigation Menu atau Tutorial Blog lainnya . 

Credithttp://saungweb.blogspot.com/2010/04/tampil-cantik-dengan-menu-tab-view.html

Cara Membuat Scroll pada Label, Arsip Blog Ataupun Widgets Lainnya

1.Sign in seperti biasa di blogger
2.Ke Tata letak---> terus ke Edit Html
3.Cari Kode:

<b:widget id='Profile1' locked='false' title='Mengenai Saya' type='Profile'/>
<b:widget id='HTML6' locked='false' title='Jam' type='HTML'/>
<b:widget id='BlogArchive1' locked='false' title='Arsip Blog' type='BlogArchive'/>
<b:widget id='Label1' locked='false' title='Kategori' type='Label'/>
<b:widget id='Followers1' locked='false' title='Pengikut' type='Followers'/>
<b:widget id='HTML7' locked='false' title='Statistik Blog Ini' type='HTML'/>
<b:widget id='HTML1' locked='false' title='Kotak Chatting' type='HTML'/>


4.Lha trus cari nama widgets yang akan anda beri scroll.
Misalkan anda pengin mengasih scrollnya untuk Arsip Blog, maka kodenya kira2 seperti ini

<b:widget id='BlogArchive1' locked='false' title='Arsip Blog' type='BlogArchive'/>

Nah kode id yang nanti di pakai untuk Arsip blog ini adalah BlogArchive1

5. Kemudian Pastekan Kode dibawah ini di atas kode ]]></b:skin>

#BlogArchive1 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

Kemudian simpan Templete.
Nah kalo berhasil nggak akan Error, dan Arsip Blog kita akan terscrollkan.

Cara ini bisa juga untuk membuat scroll pada label, Seperti contoh script diatas (script no 3) yang mengambarkan id Label yaitu Label1, maka kita tinggal mengganti kata BlogArchive1 pada script nomer 5 dengan Kata Label1.
Sedang Untuk tinggi scroll bisa diatur sesuai selera yang kalo yang diatas itu tulisan 200px ea...



Credit http://www.artikelkomputer.net/2011/02/membuat-scroll-pada-label-arsip-blog.html

Cara Menambahkan Scroll di Blogroll


Sebelum Anda menambahkan scroll, terlebih dahulu pasang Widget Blogroll dengan cara :

  1. Login ke draft.blogger.com
  2. Klik Design
  3. Add a Gadget
  4. Pilih Link List
Sedangkan cara menambahkan scroll di blogroll :
  1. Login ke draft.blogger.com
  2. Klik Design
  3. Klik Edit HTML
  4. Centang Expand Widget Templates
  5. Cari kode yang mirip dengan kode berikut :
    <b:widget id='LinkList1' locked='false' title='Blogroll' type='LinkList'>  
<b:widget id='LinkList2' locked='false' title='Blogroll' type='LinkList'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>

Tambahkan kode <div style='width:100%; height:100px; overflow: auto;'> diatas kode <ul> dan kode </div> dibawah kode </ul>, sehingga menjadi seperti dibawah ini

<b:widget id='LinkList2' locked='false' title='Blogroll' type='LinkList'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<div style='width:100%; height:100px; overflow: auto;'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
</div>
</div>
</b:includable>
</b:widget> 
width:100% dan height:100px dapat dirubah sesuai kebutuhan agar sesuai dengan template blog Anda


Credit http://kangamphi.blogspot.com/2011/05/menambahkan-scroll-di-blogroll.html

Jumat, 21 Oktober 2011

Tutorial : Create Cute Menu Tab with Icon Like Me



kay.senang saje nak buat :)
ikot step masing-2.

1.Dashboard > Design > Add A Gadget (mesti pilih gadget bahagian header)
2.Pilih Html Java/Script ,
3.Copy code bawah ;
<img src="Url Icon" /><a href="Link Page 1" target="_blank"><img style="width: 100px; height: 60px;" src="Url Gambar untuk Link Page 1" border="0" /></a><img src="Url Icon" /><a href="Link Page 2" target="_blank"><img style="width: 100px; height: 60px;" src="Url Gambar untuk Link Page 2" border="0" /></a><img src="Url Icon" /><a href="Link Page 3" target="_blank"><img style="width: 100px; height: 60px;" src="Url Gambar untuk Link Page 3" border="0" /></a><img src="Url Icon" />

p/s : 
warna merah ; url icon comel.boleh ambil di babydoll.nu
warna purple ; link page korang.boleh tengok kat tutorial ini
warna oren ; url gambar link page korang.korang create lah kat photoscape or photoshope cs




4.Save :)

 

Credit http://eyka4rever.blogspot.com/2011/10/tutorial-create-cute-menu-tab-with-icon.html

Kamis, 20 Oktober 2011

14 Lagu OST Misteri Ilahi


  1. download Apa salah dan dosaku mp3
  2. download Nasib wanita malam mp3
  3. download Takdir mp3
  4. download Apakah kau tau mp3
  5. download Ampunilah Dosaku. mp3
  6. download Hanya Minuman. Mp3
  7. download Masa Muda. Mp3
  8. download Hai kasihku. Mp3
  9. download Demi cinta. Mp3
  10. download Semoga direstui. Mp3
  11. download Apa yang tlah terjadi. Mp3
  12. download Andai Masih bersama. Mp3
  13. download Semua tau. Mp3
  14. download Bulan diranting cemara. Mp3



Credit : http://asmanadi.blogspot.com/2009/12/14-lagu-ost-misteri-ilahi.html

Rabu, 19 Oktober 2011

Cara Menambahkan Recent Posts + Comment Dengan Javascript


Cara Menambahkan Recent Posts + Comment Dengan Javascript
Cara Menambahkan Recent Posts + Comment Dengan Javascript - Biasanya kebanyakan dari sobat blogger membuat recent posts dan recent comment pasti menggunakan fasilitas dari gadget blogger. Cara itu memang mudah dan simple, tapi sobat tidak akan bisa membuat lebih dari 5 dengan menggunakan fasilitas blogger, makanya dengan javascript ini dimudahkan untuk membuat recent posts + recent comment ini.

Selain itu, kamu juga bisa menambahkan recent posts / recent comment ini pada tabview widget kamu seperti pada kotak tabview di samping di Blog Deny ini.

Dibanding cara pertama (menggunakan Gadget Blogger), cara kedua ini memiliki kelebihan dimana jumlah judul posting atau komentar dapat diatur sekehendak kita (bisa lebih dari 5). Untuk menggunakannya kamu bisa mengikuti langkah-langkah berikut:
  • Login ke akun blogger kamu
  • Masuk ke tab rancangan, elemen laman
  • Setelah masuk ke Elemen Halaman, klik Tambah Gadget.
  • Setelah itu pilih HTML/JavaScript untuk ditambahkan, seperti nampak pada gambar berikut:
    html
  • Kemudian masukkan script berikut dan ubah NamaBlogKamu dengan nama blog kamu sendiri:

Kode untuk Recent Posts:
<script style="text/javascript" src="http://my-project-tabview-tab.googlecode.com/files/recents-posts.js"></script>
<script style="text/javascript">
var numposts = 10;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://NamaBlogKamu.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script>
Keterangan variabel:
- numposts = 10; artinya 10 posting yang ditampilkan (maksimal 25 posting)
- showpostdate = false; artinya tanggal posting tidak ditampilkan (kalo mau ditampilkan false-nya ganti dengan true).
- showpostsummary = false; artinya ringkasan posting tidak ditampilkan.
- numchars = 100; artinya banyaknya karakter (huruf) untuk ringkasan posting yang ditampilkan adalah 100 huruf.
- standardstyling = true; artinya menggunakan type standard.

Jika ternyata tidak muncul bullets pada setiap judul Recent Posts kamu (karena setiap template selalu berbeda), maka tambahkan perintah <ul> pada script terakhir dan ditutup dengan </ul> (lihat contoh pada script Recent Comments yang kedua).

Kode untuk Recent Comments:
<script style="text/javascript" src="http://my-project-tabview-tab.googlecode.com/files/recentc-comments.js"></script>
<script style="text/javascript">
var numcomments = 10;
var showcommentdate = true;
var showposttitle = true;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://NamaBlogKamu.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>
Keterangan variabel:
var numcomments = 10; artinya 10 komentar yang ditampilkan.
var showcommentdate = true; artinya tanggal komentar ditampilkan.
var showposttitle = true; artinya menampilkan judul posting yang dikomentari.
var numchars = 100; artinya banyaknya karakter (huruf) komentar yang ditampilkan adalah 100 huruf.

Jika Recent Comments kamu ingin menggunakan bullets, seperti pada Recent Comments pada blog ini, gunakan script berikut:
<script style="text/javascript" src="http://my-project-tabview-tab.googlecode.com/files/recentc-commentsbullet.js"></script>
<script style="text/javascript">
var numcomments = 10;
var showcommentdate = true;
var showposttitle = true;
var numchars = 100;
var standardstyling = true;
</script>
<ul>
<script src="http://NamaBlogKamu.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>
</ul>
Setelah memasukkan kode script dan melakukan editing variabel yang disesuaikan dengan keinginan kamu. Lakukan Preview (Pratinjau) untuk melihat hasilnya. Jika sudah OK, simpan hasil kerjaan kamu. Sekian dulu postingan saya mengenai membuat recent posts + recent comment, semoga bagi kamu yang ingin membuat recent comment bisa terbantu dengan postingan ini.

Nah, selesai dah. Selamat mencoba.....




Credit : http://daw-xp.blogspot.com/2011/03/cara-menambahkan-recent-posts-comment.html

Cara Membuat Tabview Di Blogger

  
Kali ini JIPRAK dot COM akan sedikit membahas tentang trik blogger, yaitu Cara Membuat Tabview Di Blogger. Sebenarnya sudah banyak blog-blog lain yang membahas tentang Cara Membuat Tabview ini, tapi tetep aja dehh Bang Jiprak ingin berbagi, daripada nganggur.

Buat bikin tabview ini gampang kok caranya ( yaiyalah orang tinggal Copas kode dari JIPRAK dot COM ). Tabview ini sebenarnya cukup penting buat Tampilan Blog, Karena tabview ini bisa mengirit tampilan side bar, juga membuat blog kita terkesan lebih rapi.

Okayy.. to the point aja, berikut Step By Step Cara Membuat Tabview Di Blogger :

1. Login ke akun blogger anda, masuk ke mode EDIT HTML
2. Pada kotak HTML, cari kode ]]></b:skin>
3. Lalu Copy Kode dibawah diatas kode ]]></b:skin> tadi

/* tab model 2 JIPRAK dot COM */
div.Tabateonsoft div.TFs
{height: 30px; overflow: hidden;}
div.Tabateonsoft div.TFs a
{float: left; display: block; text-align: center; text-decoration: none; font: normal 12px arial; padding:3px 5px 3px 3px; margin:0 5px 0 0;letter-spacing:-0.07em;
background:#f0f0f0;
color: #333;
border-top:1px solid #CCCCCC;
border-right:1px solid #999999;
border-bottom:1px solid #999999;
border-left:1px solid #cccccc;
-moz-border-radius-bottomright: 10px; -moz-border-radius-topright: 10px;
}
div.Tabateonsoft div.TFs a:hover
{ background: #E8E8E8;
border-top:1px solid #999999;
border-right:1px solid #cccccc;
border-bottom:1px solid #cccccc;
border-left:1px solid #999999;}
div.Tabateonsoft div.TFs a.Active
{ background: #E8E8E8;
color: #000000;
border-top:1px solid #999999;
border-right:1px solid #cccccc;
border-bottom:1px solid #cccccc;
border-left:1px solid #999999; font-weight:bold;}
div.Tabateonsoft div.Pages
{ clear: both; overflow: hidden; height:240px; border:1px solid #EFF0F1; padding:0;background: #ffffff; -moz-border-radius:5px;}
div.Tabateonsoft div.Pages div.Page
{height: 100%;padding: 0px; overflow: hidden; }
div.Tabateonsoft div.Pages div.Page div.floor
{ font-size:11px;padding: 3px 5px; text-align:left;}
4. Kalau sudah, lanjutkan, cari kode <head> , don copy kode berikut tepat dibawah kode <head> tersebut
<script src='http://jiprak.googlecode.com/files/Tabview.js' type='text/javascript'/> 
5. Save template. Langkah pengeditan HTML sudah selesai, sekarang tinggal tambahkan widget Tabview, seperti biasa, di Elemen Halaman, klik Tambahkan Widget, Pilih menu HTML/Javascript. Tambahkan kode berikut :
<form action="tabateonsoft.html" method="get">
<div class="Tabateonsoft" id="Tabateonsoft">
<div class="TFs">
<a>tab1</a>
<a>tab2</a>
<a>tab3</a>
<a>tab4</a>
</div>
<div class="Pages">
<div class="Page"><!-- Tab -->
<div class="floor">
Disini letakkan kode untuk tab 1 anda
</div>
</div><!-- end Tab -->
<div class="Page"><!-- Tab -->
Disini letakkan kode untuk tab 2 anda
</div><!-- end Tab -->
<div class="Page"><!-- Tab -->
<div class="floor">
Disini letakkan kode untuk tab 3 anda
</div>
</div><!-- end Tab -->
<div class="Page"><!-- Tab -->
<div class="floor">
Disini letakkan kode untuk tab 4 anda
</div>
</div><!-- end Tab -->
</div>
</div>
</form>
<script type="text/javascript">tabateonsoft_name('Tabateonsoft');</script>
 6. Setelah itu, tinggal anda tambahkan kode yang ingin anda pasang di tabview,


Credithttp://www.jiprak.com/2011/06/cara-membuat-tabview-di-blogger.html

Sabtu, 15 Oktober 2011

Freebies Font Comel


Download < Stroke Dimension
Download < Blockography
Download < Vanilla
Download < Rebekah's Birthday
Download < SacchiAlphabet
Download < Chick
Download > Cutie Pop
Download > Cheri Liney
Download > Kinkee
Download > Chewy Stewy
Download > UdamojiAL
Download > Lemons Can Fly
Download > SDKwang Soo B
Download > Thursdoo
Download > Porky's

Download > The Only Exception
Download > Typo Garden Demo
Download > Jellyka - le Grand Saut
Download > Jellyka Saint-Andrew's Queen
Download > LT Chickenhawk
Download > Kittyspoon
Download > Crushed Out Girl
Download > BubblesStandard



Jumat, 14 Oktober 2011

Cara membuat Vertical Menu Tab



1) Dashboard > Design > Add a Gadget > HTML/JavaScript

2) Paste this code in the box :
<style type="text/css">
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.sidebarmenu ul{
width:250;
text align:center;
list-style-type: none;
font: normal 13px Century gothic;
}
.sidebarmenu ul li{
position: relative;
}
/* Top level menu links style */
.sidebarmenu ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: white;
text-align:center;
text-decoration: none;
padding: 0px;
}
.sidebarmenu ul li a:link, .sidebarmenu ul li a:visited, .sidebarmenu ul li a:active{
background-color: #C6C6C6; /*background of tabs (default state)*/}
.sidebarmenu ul li a:visited{
color: white;}
.sidebarmenu ul li a:hover{
background-color: #000000;}
/* Holly Hack for IE \*/
* html .sidebarmenu ul li { float: left; height: 1%; }
* html .sidebarmenu ul li a { height: 1%; }
/* End */
</style>
<script type="text/javascript">
//Nested Side Bar Menu (Mar 20th, 09)
//By Dynamic Drive: http://www.dynamicdrive.com/style/
var menuids=["sidebarmenu1"] //Enter id(s) of each Side Bar Menu's main UL, separated by commas
function initsidebarmenu(){
for (var i=0; i<menuids.length; i++){
var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
for (var t=0; t<ultags.length; t++){
ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle"
if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu
ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item
else //else if this is a sub level submenu (ul)
ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it
ultags[t].parentNode.onmouseover=function(){
this.getElementsByTagName("ul")[0].style.display="block"
}
ultags[t].parentNode.onmouseout=function(){
this.getElementsByTagName("ul")[0].style.display="none"
}
}
for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars
ultags[t].style.visibility="visible"
ultags[t].style.display="none"
}
}
}
if (window.addEventListener)
window.addEventListener("load", initsidebarmenu, false)
else if (window.attachEvent)
window.attachEvent("onload", initsidebarmenu)
</script>
<div class="sidebarmenu">
<ul id="sidebarmenu1">
<li><a href="LINK">TEXT</a></li>
<li><a href="LINK">TEXT</a></li>
<li><a href="LINK">TEXT</a></li>
<li><a href="LINK">TEXT</a></li>
</ul>
</div></center></center>

3) Save !
Teka-teki ♥

Merah : Lebar menu tab
Ungu : Warna background sebelum hover
Pink : Warna background semasa hover
Hijau : URL yang kamu nak link-kan
Biru : Ayat kamu

Credit http://sesucikejora.blogspot.com/2011/10/tutorial-vertical-menu-tab.html

freebies Link Hover


:86: Design ↪ Edit HTML

:86: Tekan CTRL + F dan cari kod a:hover {

:86: Paste kan kode ni di bawah a:hover {

background:url(URL gambar); background-repeat: repeat;

:86: Gantikan URL gambar tu dengan salah satu gambar ni :

http://dl6.glitter-graphics.net/pub/814/814656vwca6ek7p6.gif
http://dl6.glitter-graphics.net/pub/814/814656vwca6ek7p6.gif

http://dl10.glitter-graphics.net/pub/124/124750rx6sc1mkfz.gif
http://dl10.glitter-graphics.net/pub/124/124750rx6sc1mkfz.gif

http://dl2.glitter-graphics.net/pub/702/702442jd36r8s7ma.gif
http://dl2.glitter-graphics.net/pub/702/702442jd36r8s7ma.gif

http://dl9.glitter-graphics.net/pub/2231/2231939mkrmjjcimx.gif
http://dl9.glitter-graphics.net/pub/2231/2231939mkrmjjcimx.gif
http://dl6.glitter-graphics.net/pub/2116/2116076lx76nmttn6.gif
http://dl6.glitter-graphics.net/pub/2116/2116076lx76nmttn6.gif
http://dl8.glitter-graphics.net/pub/1484/1484248avdo5gytjd.gif
http://dl8.glitter-graphics.net/pub/1484/1484248avdo5gytjd.gif
:86: Save n siap! 
Credit http://sesucikejora.blogspot.com/2011/04/tutorial-link-hover.html

cara cantikkan comment box


1  )
tengok image atas nih , korang boleh tick yang mna pon tak apa . cmmnt box tu akan menjadi jgak . tp kalau tick yang Pop-up window , tak akan nmpk . sbab Pop-up window nak kasi ringkas & cepat . okeh .

2) Dashboard>Design>Edit html>Tick Expand Widget Templates

3) cari kod dibawah :

]]></b:skin>

4) copy code di bawah dan paste di ATAS code ]]></b:skin>


#comments-block{
margin:0;
padding:0;
}
#comments-block .comment-author{
background:#848484 !important;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;

padding:5px;
font-size:15px;
font-weight:bold;
border:1px solid #848484;
}
#comments-block .comment-body{
margin: 0;
font-size: 17px;
border-left: 1px solid #848484;
border-right: 1px solid #848484;
margin-top: -5px; /*position*/
padding: 5px;
}
#comments-block .comment-footer{
margin:0;
font-size: 10px;
font-weight: normal;
margin-bottom: 20px;
border-left: 1px solid #848484;
border-right: 1px solid #848484;
border-bottom: 1px solid #848484;
-moz-border-radius-
bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
margin-top: -12px; /*position*/
padding: 5px;
}
#comments-block .deleted-comment{
font-style:italic;
color:gray;
}
#comments-block .comment-author a{
color: #ffffff !important;
}
#comments-block .comment-footer a, .comment-body a{
color: #848484 !important;
}


5) tulisan merah tu , korang boleh tukar ikot warna kesukaan sndri .


Credit http://nurhafizahpija.blogspot.com/2011/03/tutorial-cantikkan-comment-box.html

Kamis, 13 Oktober 2011

Freebies : Background flower

Photobucket
http://i1108.photobucket.com/albums/h420/sweetcandy4858/nurhafizah/backgroundblue-7.png

Photobucket
http://i1108.photobucket.com/albums/h420/sweetcandy4858/nurhafizah/backgroundgray-7.png

Photobucket
http://i1108.photobucket.com/albums/h420/sweetcandy4858/nurhafizah/backgroundgreen-7.png

Photobucket
http://i1108.photobucket.com/albums/h420/sweetcandy4858/nurhafizah/backgroundorange-7.png

Photobucket
http://i1108.photobucket.com/albums/h420/sweetcandy4858/nurhafizah/backgroundpink-7.png

Photobucket
http://i1108.photobucket.com/albums/h420/sweetcandy4858/nurhafizah/backgroundpurple-7.png

Related Posts Plugin for WordPress, Blogger...