Showing posts with label pemula. Show all posts
Showing posts with label pemula. Show all posts

Membuat Border

8 komentar

Border dapat dibuat pada tulisan dan gambar. Contoh pada tulisan adalah:

Tulisan ber-border. Ukuran border 1px dan jenisnya solid.

Membuatnya tidaklah susah.

Ada 2 cara pembuatan, yaitu tidak menggunakan CSS dan menggunakan CSS. Keduanya sama mudahnya. Saya akan mengulas kedua.

1. Tidak menggunakan CSS.

Keuntungannya adalah, kita dapat membuat border yang kita sukai dan berbeda-beda untuk tiap kotaknya.
Kekurangannya adalah, kita harus mengetik code untuk tiap kotak. Ini memakan waktu dan tenaga.

Cara membuatnya:
Untuk kasus tulisan dalam kotak yang di atas. Codingnya adalah:
<div style="border:1px #ff0000 solid; padding:10px; background-color:#F3F2E8;">Tulisan ber-border. Ukuran border 1px dan jenisnya solid.</div>

border:1px #ff0000 solid;
1px --> ukuran border
#ff0000 --> warna border, terdiri dari 6 digit angka
solid --> tipe border, untuk bergaris putus-putus adalah 'dashed', titik-titik 'dotted'

padding: 10px;
Padding adalah ukuran jarak antara text dan border

background-color:#F3F2E8;
Warna latar belakang. Jika tidak ingin mengubah latar belakang warna, hapus saja.

2. Menggunakan CSS.

Keuntungannya adalah lebih mudah menggunakannya.
Kekurangannya adalah semua kotak sama.

Cara membuatnya:
Perhatikan kembali coding isi tag style yang di atas. Yaitu yang berisi:
border:1px #ff0000 solid; padding:10px; background-color:#F3F2E8;

Copy-lah bagian itu kemudian nanti akan diletakkan (paste) di bagian CSS. Masuklah ke bagian 'Edit HTML' pada layout. Perhatikan seluruh HTML yang ada. Bagian CSS diawali dengan tag coding:
<b:skin><![CDATA[/*

dan diakhiri dengan:
]]></b:skin>

Tepat di atas akhiran CSS ini, buatlah elemen baru CSS dengan mengetik:
.border {

Kemudian hasil copy-an tadi letakkan (paste) setelahnya. Akhiri dengan tanda tutup:
}

Hasilnya adalah:
.border { border:1px #ff0000 solid; padding:10px; background-color:#F3F2E8; }

Langkah terakhir adalah memanggil elemen CSS border ini melalui tag div. Yaitu:
<div class="border">isian</div>

-- Keliatannya ribet tapi tidak loh --

Lihat tutorial lainnya di Azzahrah Design

Read More......

Gambar ber-link, Seperti Kolom Sponsored

6 komentar

Beberapa pertanyaan teman-teman yang masuk adalah tentang kolom 'Sponsored' yang ada di blog ini, yaitu:

New Face Centre Best Computer
Visit Indonesia Year 2008

Bagaimana cara membuatnya?

Pembuatannya tidaklah susah. Dua hal yang harus diketahui adalah:
  1. Harus mempunyai gambar (image) yang sudah di-upload.
  2. Coding yang benar dengan alamat URL link yang dituju, yang valid juga.
Coding untuk banner Visit Indonesia 2008 adalah:
<a href="http://www.my-indonesia.info/"
target="_blank"><img alt="Visit Indonesia Year 2008"
style="border: 1px solid rgb(102, 125, 0);" src="http://i79.photobucket.com/albums/j152/riniaisyah/
visit-indo.gif"/></a>

Penggunaan gadget/widget adalah dengan mencantumkan title 'Sponsored', lalu diisi dengan coding yang telah disebutkan di atas. Banner New Face Center dan Best_Computer adalah promosi dari dua usaha keluarga. Meletakkan banner Visit Indonesia 2008 adalah murni ide sendiri yang sedikit berpromosi negara tercinta.

-- Selamat Mencoba --

Read More......

Blogger Update

4 komentar

Tim blogger membuat perubahan baru, disebut Google Gadgets. Versi yang lama, blogger mengunakan widget, sekarang menggunakan gadgets. Kelebihan gadget ini adalah langsung terintegerasi dengan iGoogle Gadgets pada sidebar kita. Selain itu, kita langsung bisa browsing mencari gadget yang kita inginkan yang terdapat dalam Gadget directory. Ini berarti, ribuan gadget bisa kita cari dan langsung kita tampilkan di blog kesayangan kita. Ribuan gadget siap pakai? Hmm, fantastis...

Gadget yang kita buat mengikuti ukuran sidebar yang telah kita tetapkan.

Bagaimana menggunakannya?


Caranya tidak jauh beda dengan cara yang lama. Masuklah lewat dashboard ke bagian layout. Jika kamu teliti, kamu akan mendapatkan perubahan kecil. Sekarang kamu akan melihat tulisan 'Add a Gedget'. Nah, kliklah link tersebut. Kamu akan masuk ke window baru yang berisi ribuan gadget siap pakai.

Pada menu kiri, akan kita lihat pembagian gadget. Gadget basic yang dulunya ditawarkan blogger masih dapat kita pakai. Blogger juga telah membagi gadget lainnya menjadi beberapa kategori.

Cara memasukkan gadget ke blog adalah cukup dengan klik tanda tambah di sampingnya.

Pencarian gadget dilakukan dengan memasukkan kata kunci ke dalam form pencarian yang terdapat di atas, contohnya : 'Searching Gadget'. Kemudian klik tombol pencarian di sampingnya.

-- Selamat ber-gadget ria --


Lihat tutorial lainnya di Azzahrah Design

Read More......

FAQ

5 komentar

1. Apakah bisa mengubah setingan Classic Template menjadi XML Template dan kebalikannya?
--> Bisa. Langkah-langkah pengubahannya dapat dilihat di halaman Tutorial Pengaturan dan Pengubahan Skin / Template.

2. Mana yang lebih baik, Classic Template atau XML Template?
--> Keduanya sama baiknya. Kelebihan XML Template adalah adanya widget.

3. Bagaimana cara mengganti XML Template dengan yang baru?
--> Ada dua cara. Yang pertama dengan cara meng-copy semua kode HTML template baru ke dalam kolom 'Edit HTML'. Cara kedua adalah dengan cara upload file txt atau xml. Cara kedua ini lebih mudah penggunaannya. Penjelasan lebih lengkap baca di halaman Tutorial Pengaturan dan Pengubahan Skin / Template.

4. Apakah dapat mempertahankan widget yang lama saat mengubah XML Template?
--> Ya bisa. Caranya adalah dengan meng-copy widget lama yang ingin tetap digunakan lalu kemudian memindahkannya ke template yang baru.

5. Apakah mengubah template dapat menghapus semua postingan/artikel yang lama?
--> Tidak akan mengapus data postingan/artikel lama. Penghapusan postingan/artikel harus dilakukan langsung pada postingan/artikel tersebut.

Lihat tutorial lainnya di Azzahrah Design

Read More......
-- -- --

Copyright © 2008 - Free Islamic Blogger Templates - powered by Blogger