PASANG JAM PADA BLOG

Pada beberapa blog yang saya kunjungi selama pembuatan blog.Saya mengamati ada hal yang unik dari blog tersebut yaitu jam-jam analog dan digital yang beraneka ragam bentuk dan warna. Saya jadi tertarik untuk memasukannya ke dalam blog sebagai penghias.Berikut cara memasangnya :

1. Masuk dulu ke Website penyedia software jam yang tersedia.Contoh ClockLink.

WWW.Clocklink.Com Disini kita bisa memilih tampilan dan lokasi waktu yang kita inginkan.

2. Cukup klik tombol Go to Clock Gallery yang terdapat di bawah gambar jam yang terdapat di sebelah kanan website untuk memulai penyetingan.

3. Setelah di klik kita akan di bawah ke halaman persetujuan EULA( End User License Agreement) Cukup klik Accept untuk lanjutkan.

4. Di halaman selanjutnya kita bisa memilih tema jam yang kita inginkan mulai dari jam Analog, animasi, digital, logo, sport atau wallpapers.

5. Setelah memilih tema jam yang kita inginkan klik tombol View HTML Tag yang terdapat pada tema jam yang kita pilih

6. Di halaman ini kita akan di sajikan beberapa setingan, untuk menentukan zona waktu yang akan kita gunakan

7. Pilih Seting menurut kota saja karna akan lebih mudah.

8. Pilih Negara lalu pilih kota tempat kita berada

9. Kita juga bisa pilih ukuran tampilan jam yang kita inginkan (tergantung dari setingan yang terdapat dari web)

10. Di bawah setingan tersebut terdapat 2 code di dalam text box kita tinggal meng kopi salah satu kode tersebut untuk kita gunakan dalam blog kita.

11. Setelah mendapat kode kita Login ke dalam blog kita

21. Pada dasbor blog kita masuk ke dalam Tab Tata Letak,seperti yang di tampilkan pada gambar di atas.

22. Klik Tab Elemen laman

23. Pada Tab Elemen laman,klik tambah gadget

24. Pilih tambahkan box HTML\Java Script

25. Masukan kode yang kita dapatkan dari ClockLink pada kotak yang besar,jangan lupa pasang judulnya ya.

26. Klik Simpan

Membuat Tab View dengan JQuerry

Baru dapat dari blog orang2 pinter:
Diposkan oleh Uc1n

Cara Membuat Navigasi Stylish di Blog adalah sebagai berikut :

- Login keBlogger dengan account anda.
- Pergi ke "Tata Letak" kemudian "Edit HTML".
- Centang "Expand Template Widget".
- Sebelumnya pastikan blog anda telah tertanam didalamnya JQuery versi 1.3.2, jika belum silahkan copy JQuery versi 1.3.2 dibawah ini dan letakkan dibawah :



- Kemudian letakkan code CSS berikut diatas ]]> :

/* pageTabs */

.pageTabs {width: 300px; height:150px; margin:5px font-size:11px;}

ul.tabs {

margin-left: 5px;

padding: 0;

float: left;

list-style: none;

height: 32px;

border-bottom: 1px solid #999;

border-left: 1px solid #999;

width: 100%;

}

ul.tabs li {

float: left;

margin: 0;

padding: 0;

height: 31px;

line-height: 31px;

border: 1px solid #999;

border-left: none;

margin-bottom: -1px;

background: #e0e0e0;

overflow: hidden;

position: relative;

}

ul.tabs li a {

text-decoration: none;

color: #000;

display: block;

font-size: 1.2em;

padding: 0 20px;

border: 1px solid #fff;

outline: none;

}

ul.tabs li a:hover {

background: #ccc;

}

html ul.tabs li.active, html ul.tabs li.active a:hover {

background: #fff;

border-bottom: 1px solid #fff;

}

.tab_container {

margin-left: 5px;

border: 1px solid #999;

border-top: none;

clear: both;

float: left;

width: 100%;

background: #fff;

-moz-border-radius-bottomright: 5px;

-khtml-border-radius-bottomright: 5px;

-webkit-border-bottom-right-radius: 5px;

-moz-border-radius-bottomleft: 5px;

-khtml-border-radius-bottomleft: 5px;

-webkit-border-bottom-left-radius: 5px;

}

.tab_content {

padding: 20px;

font-size: 1.2em;

}

.tab_content h2 {

font-weight: normal;

padding-bottom: 5px;

border-bottom: 1px dashed #ddd;

font-size: 1.8em;

}

.tab_content h3 a{

line-height: 2em;

color: #254588;

}

.tab_content img {

float: left;

margin: 5px 10px 10px 0;

border: 1px solid #ddd;

padding: 5px;

}

.tab_content p{

padding-bottom:10px;

}

- Simpan Template.

- Pergi ke "Elemen Laman".
- Tambah Gadget dan pilih "HTML/JavaScript".
- Copy paste code berikut kedalamnya :

TAB1

TAB2

TAB3

TAB4

Isi Content Anda Utk Tab 1 scrip

div id="tab2" class="tab_content">Isi Content Anda Utk Tab 2 scrip

Isi Content Anda Utk Tab 3 scrip

si Content Anda Utk Tab 4 scrip

- Simpan.

# Nilai 1500 pada fadeIn(1500) pada script diatas adalah kecepatan tampilnya konten tab view.
by : http://www.hapiamesir.org/