Three_Hands Search Engine
-->

Pondok Pesantren Subulus Salam

External links - Jquery Pondok Pesantren Subulus Salam terletak di pinggir jalan Syuhada’ desa Ngunut, Kecamatan Babadan, Kabupaten Ponorogo, Jawa Timur. Dikelilingi oleh pemukiman warga, kebun dan sawah, suasana di pondok tersebut tenang dan damai. Tamu yang mengunjungi Subulus Salam pertama masuk lewat jalan utama akan melihat tulisan Pondok Pesantren Subulus Salam dan menghadap rumah keluarga kyai yang sederhana dan bersahaja.?

Kunjungi Kami di website resmi kami:) www.ppsubulussalam.co.cc Terima Kasih Atas Kunjungannya

SMP Ma'arif-3 Ponorogo

External links - Jquery SMP Ma’arif - 3 Ponorogo sebagai Sekolah Islam Terpadu yang terakreditasi B sebagaimana keputusan Ketua Badan Akreditasi Propinsi Jawa Timur terus berupaya menjadi lembaga pendidikan terbaik yang mampu mengemban amanah untuk meningkatkan kompetensi anak bangsa yang kompetitif. Ayo Gabung Bersama Kami.

Mengapa SMP Ma'arif-3 Ponorogo ? Kunjungi Kami di www.smpmagapo.co.cc :)

Sekilas Tentang Admin Magapo!

External links - Jquery Admin Magapo merupakan wadah bagi siswa untuk belajar dan berkreasi dalam mendisain website dan juga Design Grafis yang berbasis pada Adobe Photoshop, Corel Draw, Flash dan lain-lainnya, di website ini mereka akan dibina dan dipandu dalam menguasai hal-hal tersebut di atasKUNJUNGI KAMI:)

Design Web Admin Magapo!

Thumbnail image that says sleek button using photoshop that links to a Photoshop tutoril. Builder this Website is one teacher of Junior High School Of Ma'arif-3 Ponorogo. Dia selalu aktif meng-update data-data terbaru baik itu yang berkaitan dengan Sekolah maupun ilmu pengetahuan yang berkaitan dengan IT, maupun Agama

anda Tertarik! kunjungi kami:)

Rabu, 27 Januari 2010

Pengaturan dan Kustomasi Judul Sidebar

Pengaturan dan Kustomasi Judul Sidebar : Sepertinya banyak blog yang telah membahas tentang tema ini namun tidak ada salahnya jika Tips dan Trik Blog mempostingnya juga, siapa tahu ada di antara para blogger atau pengunjung yang belum mengetahuinya. Jika tertarik, silakan ikuti tipsnya bersama Tips dan Trik Blog berikut ini.

Kini, memperoleh template gratis yang bagus-bagus di internet adalah hal yang tidak sulit. Bahkan banyak pembuat template membolehkan template buatan-nya digunakan oleh pengguna lain dengan sukarela tanpa menarik bayaran satu sen pun. Dengan demikian para pengguna atau blogger pemula mempunyai banyak pilihan untuk menggunakan template yang “pas” buat dirinya.

Namun demikian, pasti ada bagian-bagian tertentu dari template yang kita gunakan tersebut kurang pas dengan kita. Bisa saja secara keseluruhan, kita sudah merasa cocok dengan suatu template namun mungkin ada bagian tertentu yang masih “mengganjal”, misalkan pada bagian judul sidebar.

Bagi yang mengalami hal demikian, tidak perlu terburu-buru untuk mengganti template yang ada dengan template yang lain (karena bagaimana pun juga untuk mengganti template dibutuhkan energi ekstra), kita dapat melakukan pengaturan dan kustomasi judul sidebar sedemikian rupa sehingga menjadi “pas” dengan selera atau kebutuhan kita.

Untuk melakukan pengaturan dan kustomasi judul sidebar tersebut, kita harus melakukan modifikasi (mengganti/menghapus) terhadap kode css untuk judul sidebar tersebut. Untuk template default blogger, kita dapat menemukan kode css tersebut dengan format seperti di bawah ini.

.sidebar h2 {
………………….
………………….
………………….
}



Titik-titik tersebut merupakan deklarasi untuk tampilan judul sidebar. Kita dapat memodifikasi deklarasi tersebut sedemikian rupa sehingga tampilan judul sidebar sesuai dengan kemauan kita, antara lain :

Warna Font

Jika menginginkan, kita dapat mengkustomasi warna teks untuk judul sidebar sesuai dengan selera kita masing-masing. Deklarasinya seperti di bawah ini.

font-color: #XXXXXX;



Kita dapat mengganti kode warna #XXXXXX dengan kode warna yang lain sesuai selera masing-masing. Untuk melihat kode warna, silakan kunjungi di sini.


Ukuran Font

Kita dapat mengkustomasi ukuran font sesuai keinginan kita. Deklarasinya seperti di bawah ini.

Font-size:100%;



100% pada font-size berarti ukuran font sebesar default font, jika menginginkan kita dapat menggantinya dengan prosentase lain, 75% atau bahkan 120%.
Selain secara prosentase, ukuran font dapat didefinisikan dengan satuan pixel (px), misalnya 12px, 15px, dan seterusnya.

Opsi selengkapnya dapat dipilih di antara di bawah ini.

font-size: 75%;
font-size: 15px;
font-size: xx-small;
font-size: x-small;
font-size: small;
font-size: medium;
font-size: large;
font-size: x-large;
font-size: xx-large;
font-size: smaller;
font-size: larger;



Jenis Font

Kita juga dapat mengkustomasi jenis font agar sesuai dengan keinginan kita, deklarasinya dapat dipilih di antara contoh di bawah ini.

Font-family: verdana;
Font-family: arial;
Font-family: monospace;
Font-family: roman;


Atau dengan menggunakan jenis font yang lainnya.


Ketebalan Font

Kita juga dapat mengatur ketebalan font dengan deklarasi yang dapat dipilih di antara di bawah ini.

font-weight: normal;
font-weight: bold;
font-weight: bolder;
font-weight: lighter;


Font Style

Kita juga dapat mengkustomasi style font dengan deklarasi yang dapat dipilih di antara di bawah ini.

font-style: normal;
font-style: italic;



Perataan Teks

Kita dapat mengkustomasi perataan teks untuk judul sidebar dengan deklarasi yang dapat dipilih di antara di bawah ini.

text-align:left;
text-align:center;
text-align:right;
text-align:justify;


Warna Background

Untuk menambahkan warna background, deklarasinya seperti di bawah ini.

background: #XXXXXX;



Kita dapat mengganti kode warna #XXXXXX dengan kode warna yang lain sesuai selera masing-masing. Untuk melihat kode warna, silakan lihat di sini.

Padding


Padding ini bertujuan untuk memberikan jarak teks dari tepi sehingga teksnya tidak akan bertabrakan dengan bagian luar dari warna background yang kita atur sebelumnya. Deklarasinya seperti di bawah ini.

padding:5px;


Jika dirasa kurang cocok, kita dapat menggantinya dengan angka yang lebih kecil atau bahkan lebih besar lagi.

Text Decoration


Dengan text-decoration ini, kita dapat membuat teks menjadi bergaris bawah, bergaris atas, bergaris tengah, atau bahkan menjadi berkedip. Deklarasi selengkapnya seperti di bawah ini.

text-decoration: none;
text-decoration: underline;
text-decoration: overline;
text-decoration: line-through;
text-decoration: blink;



Text Transform

Dengan text-transform ini, kita dapat membuat teks menjadi huruf capital, huruf kecil, atau huruf besar pada awal kata. Deklarasinya dapat dipilih di antara di bawah ini.

text-transform: uppercase;
text-transform: lowercase;
text-transform: capitalize;


Border Style

Kita pun dapat menambahkan efek border dengan berbagai bentuk, deklarasinya dapat dipilih di antara di bawah ini.

border-style: none;
border-style: hidden;
border-style: dotted;
border-style: dashed;
border-style: solid;
border-style: double;
border-style: groove;
border-style: ridge;
border-style: inset;
border-style: outset;



Border Color

Selain bentuk border, kita pun dapat mengkustomasi warna untuk border. Deklarasinya seperti di bawah ini.

border-color: #XXXXXX;


Kita dapat mengganti kode warna #XXXXXX dengan kode warna lain sesuai selera masing-masing. Untuk mengetahui kode warna, silakan kunjungi di sini.

Nah, dari uraian di atas, kita dapat melakukan modifikasi atau mencoba-coba sendiri untuk mendapatkan tampilan judul sidebar yang sesuai dengan selera masing-masing.

Berikut contoh deklarasi untuk tampilan judul sidebar.

.sidebar h2 {
font-color: #071910;
font-size:120%;
font-family:verdana;
font-weight:bold;
text-align:center;
background:#ACFA58;
padding:5px;
text-decoration:blink;
text-transform:capitalize;
border-style:double;
border-color:#243B0B;
}


Atau kita dapat meringkasnya seperti di bawah ini.

.sidebar h2 {
font:#071910 120% verdana bold;
text-align:center;
text-decoration:blink;
text-transform:capitalize;
background:#ACFA58;
padding:5px;
border : double #243B0B;
}



Contoh hasilnya seperti screenshot di bawah ini.



Selamat Bereksperimen!!

0 komentar:

Posting Komentar | Feed

Posting Komentar



 

. Copyright © 2009 Muhammad Trihan, S.Pd.I Designed by SAER

Custom Search