kupas-blogger

Membuat Read More

Minggu, 15 November 2009

Read more adalah suatu link yang fungsinya untuk memenggal suatu artikel. Maka artikel tersebut akan terlihat sebagian tetapi jika link tersebut di klik maka artikel tersebut akan terbuka seluruhnya. OK kita langsung praktek aja. Lagi malas cuap-cuap nih.. hehe

Langkah #1

Pilih menu Dasboard kemudian pilih Tata Letak kemudian klik tab Edit HTML

Pertama-tama lebih baik save dulu template sobat blogger, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editing pada template sobat blogger, kita masih punya back up data untuk mengembalikannya seperti semula. Caranya klik tulisan Download Template Lengkap dan save.

Beri tanda centang pada kotak di samping tulisan Expand Template Widget , lihat gambar di bawah

Silahkan anda cari kode <data:post.body/> (kalau tidak menemukan kode tersebut). Coba cari kode <p><data:post.body/></p> .

Setelah itu ganti kode tersebut dengan kode ini

<b:if cond='data:blog.pageType == "item"'>

<style>.fullpost{display:inline;}</style>

<p><data:post.body/></p>

<b:else/>

<style>.fullpost{display:none;}</style>

<p><data:post.body/>

<a expr:href='data:post.url'><strong>Read more...</strong></a></p>

</b:if>

Anda bisa mengganti read more dengan baca selengkapnya atau apapun sesuai keinginan anda :)

Langkah #2

Pilih menu Pengaturan dan pilih Format

Pada layar paling bawah, ada text area kosong disamping tulisan Template Posting. Kemudian isi text area kosong tersebut dengan kode di bawah ini :

Klik tombol Simpan Pengaturan

Pemasangan kode ini di maksudkan agar pada saat posting artikel, kode tersebut langsung muncul tanpa harus menuliskan terlebih dahulu, jadi membantu kita agar tidak harus selalu mengingat kode tersebut.

Cara Posting Artikel

Klik menu Posting

Klik menu Edit HTML, maka secara otomatis tampak kode yang telah kita setting tadi, yakni :

Langkah #2

Cara memenggal artikel:

Ini adalah awal paragraf pertama yang akan muncul di halaman muka blog, paragraf - paragraf lainnya akan muncul apabila pengunjung blog meng klik link untuk membuka keseluruhan artikel.

<div class="fullpost">

Paragrap yang kedua, ketiga dan seterusnya.. harus di tempatkan di sini, jangan di tempatkan sebelum kode readmore, jangan lupa untuk menutup kodenya ya..

</div>

Hasilnya akan terlihat:

Ini adalah awal paragraf pertama yang akan muncul di halaman muka blog, paragraf - paragraf lainnya akan muncul apabila pengunjung blog meng klik link untuk membuka keseluruhan artikel.

Menghilangkan Judul Blog

0 komentar

Judul blog berguna untuk memberi informasi tentang blog kita dan sangat penting dalam search engine.. tapi jika di blogger judul blog tampak di header dan jika kita membuat background header yang kita buat sedemikian unik, bagus dan keren tetapi akan mengganggu pemandangan background header kita... Oleh karna itu, jika sobat blogger pengin menghilangkan judul blog yang ada pada header, seperti ini langkahnya:

Masuk menu Tata Letak kemudian masuk Edit HTML kemudian cari Code di blog sobat blogger yang mirip seperti dibawah

#header h1 {

margin:50;

padding:5px 0 0 10px;

font-size: 100%;

font-weight:bold;

line-height: 1.2em;

letter-spacing:.0em;

font-style:italic;

color:#FFFFFF;

}

nahh seperti halnya menghilangkan tanggal posting kita tambahkan Code Css visibility:hidden; ke dalam Css diatas sehingga kurang lebih menjadi seperti dibawah

#header h1 {

margin:50;

padding:5px 0 0 10px;

font-size: 100%;

font-weight:bold;

line-height: 1.2em;

letter-spacing:.0em;

font-style:italic;

color:#FFFFFF;

visibility:hidden;

}

Jika Sudah Simpan pengaturanya....

Selamat Mencoba...!!! isi komentar nya yaa,,,

read more “Menghilangkan Judul Blog”

Cara Mudah Mengganti Header Blog !!!

0 komentar

Apakah sobat blogger bosan dengan tampilan gambar Header Blog kita dan pengin mengganti dengan desain kita biar lebih personal, begini caranya:

Langkah Pertama buatlah desain Headernya dengan Program pengolah gambar (Corel atau Photoshop). Simpan dalam format JPG atau GIF.

*) Cara Pertama :

1. Sign in di Blogger

2. Klik menu Tata Letak

3. Klik menu Edit HTML

4. Klik tulisan Download Template Lengkap, silahkan save dulu template sobat blogger untuk backup

5. Klik kotak kecil di samping tulisan Expand Template Widget

7. cari kode berikut pada template sobat blogger :

b:section class="'header'" id="'header'" maxwidgets="'1'"

pada kode maxwidgets='1'. Rubah angka 1 menjadi angka 2, sehingga kodenya menjadi seperti ini :

b:section class="'header'" id="'header'" maxwidgets="'2'"

8. Klik tombol SIMPAN TEMPLATE

9. Kemudian masuk menu Elemen Halaman

10. Klik tulisan Edit yang ada pada elemen Header

11. Pilih radio button yang ada di samping tulisan dari komputer sobat blogger

12. Klik tombol Browse...Pilih Header yang telah di buat yang ada pada
komputer sobat blogger

13. Gambar Header sobat blogger akan di tampilkan

14. Klik tombol SIMPAN PERUBAHAN

15. Selesai.

**) Cara Kedua

Kalau kurang puas dengan tampilan di cara pertama, kita akan edit dengan cara yang kedua!

Jika sudah selesai mendesain Headernya, silahkan Upload gambar sobat blogger ! contoh di http://www.imageshack.com/

Caranya

1. Sign in di blogger

2. Klik menu Tata Letak

3. Klik menu Edit HTML

4. Klik tulisan Download Template Lengkap, silahkan save dulu template sobat blogger untuk backup

5. Klik kotak kecil di samping tulisan Expand Template Widget

6. Tunggu beberapa saat sampai proses selesai

7. Tambahkan kode berikut pada style sheet css sobat blogger.Yang warna hitam adalah kode asli dan yang merah adalah kode yang harus di tambahkan (sesuaikan dengan alamat gambar sobat blogger)

/* Header -----------------------------------------------

*/

#header-wrapper {

width:660px;

margin:0 auto 10px;

border:1px solid #ccc;

background:url(http://img518.imageshack.us/img518/5611/headermag15xcopy.gif);

}

}

8. Klik tombol Pratinjau untuk melihat perubahan yang ada

9. Bila sudah OK, klik tombol SIMPAN TEMPLATE

10. Selesai.

Membuat Judul Blog bergerak

0 komentar

Judul Blog yang bergerak adalah salah satu cara untuk mempercantik blog kita untuk menarik para pengunjung blog, kalo ada sobat blogger yang berminat, silahkan ikuti cara berikut:

1. Login ke blogger kemudian ke menu Tata Letak---> Edit HTML

2. Cari kode/script

<title><data:blog.pageTitle/></title>

3. Ganti kode diatas dengan

<b:include data='blog' name='all-head-content'/>

<script language='JavaScript'>

var txt="<data:blog.pageTitle/>";

var kecepatan=100;var segarkan=null;function bergerak() { document.title=txt;

txt=txt.substring(1,txt.length)+txt.charAt(0);

segarkan=setTimeout("bergerak()",kecepatan);}bergerak();

</script>

Catatan

text yang berwarna merah diatas adalah merupakan kecepatan pergerakanya jika kamu tambah angkanya maka pergerakanya akan lambat dan jika mengurangi angka maka pergerakanya akan semakin cepat

read more “Membuat Judul Blog bergerak”

GAMBARAN UMUM TEMPLATE

0 komentar

Template adalah desain-desain halaman web ataupun blog beserta seluruh komponennya (misal : gambar, stylesheet, dsb) baik berupa file statis maupun file dinamis yang berupa program atau aplikasi yang berjalan sebagai aplikasi web. Memilih template yang cantik sangatlah perlu, karena dengan tampilan template yang menarik untuk di lihat maka akan membuat para pengunjung dari blog kita menjadi betah untuk berlama-lama berada di blog kita selain tentunya isi dari blog kita juga sangat menunjang. Oleh karena itu blogger.com menyediakan template untuk mendukung hal tersebut dan template ini bernama Template Minima. Secara umum template minima terdiri dari 3 elemen, yaitu :

1. Elemen Header
2. Elemen Outer, untuk elemen Outer di bagi menjadi :

Elemen main, elemen main ini adalah elemen tempat kita menyimpan posting, jadi
apabila kita memposting sebuah artikel maka akan masuk dan di tampilkan pada
elemen ini

Elemen Sidebar, elemen sidebar ini adalah merupakan elemen untuk menyimpan
berbagai blog tools ataupun aksesori yang kita inginkan untuk mempercantik blog.

3. Elemen Footer

Jadi, jika ingin mengotak-atik template minima harus memperhatikan kode CSS (cascading style sheets) yang ada dalam 3 elemen ini.
Oleh karena itu ada baiknya sobat blogger belajar mengenai pemrograman CSS terlebih dahulu sehingga akan mudah di mengerti, tapi untuk yang malas belajar pemrograman CSS akan saya permudah seperti ini:

#header {
------------
-------------
-------------
-------------
}

#outer-wrapper {
------------
-------------
-------------
-------------
}

#main-wrapper {
------------
-------------
-------------
-------------
}

#sidebar-wrapper {
------------
-------------
-------------
-------------
}

#footer
{
------------
-------------
-------------
-------------
}

Perhatikan Code CSS yang berwarna merah saja karena yang lainnya adalah definisinya.

Nah sekarang kita lanjut ke cara otak-atik CSSnya biar tampilannya oke punya.

Ganti garis putus-putus dari code CSS diatas dengan definisi dibawah ini

margin:5px;

padding:5px;

border:1px dotted #000000;

font-size:140%;

untuk menentukan besarnya huruf , bisa sobat blogger ubah sesuai selera sobat blogger misalnya sobat blogger ubah menjadi 100% atau 150% dan juga satuanya bisa sobat blogger ganti dengan px (pixels) misalnya 14px.

font-weight:bold;

Untuk menentukan ketebalan huruf, Bold adalah jika sobat blogger ingin hurufnya tebal apabila sobat blogger ingin merubah hurufnya biasa ganti bold dengan normal, dan apabila sobat blogger ingin mengganti hurufnya menjadi miring sobat blogger ganti saja dengan code italic.

text-align:right;

Untuk menempatkan posisi text jika sobat blogger isi dengan right maka text akan berada di kanan dan apabila sobat blogger isikan left text akan berada di kiri dan juga center maka textnya akan berada di tengah.

color:#FFFFFF;

Untuk memberi warna huruf, #FFFFFF adalah code warna untuk warna putih carilah code warna yang sesuai dengan keinginan sobat blogger di http://colorschemer.com/online.

Background:#000000;

untuk memberi warna background. silahkan ganti code warna sesuai keinginan sobat blogger
di http://colorschemer.com/online untuk mencari code warna.

text-transform:uppercase;

uppercase untuk menampilkan hurufnya dengan huruf besar semua meski dalam pengaturan sobat blogger menuliskan huruf kecil. jika sobat blogger ingin mengubah dengan huruf kecil semua ganti dengan lowercase dan jika ingin huruf depanya saja yang besar maka ganti dengan capitalize.

Nah jika di blog sobat blogger pasti CSSnya sudah ada definisinya tinggal mengedit dan menambahi yang kurang-kurang saja.

Mengupload gambar dalam postingan

Jumat, 13 November 2009

0 komentar

Agar posting artikel pada blog lebih menarik untuk dilihat, maka sebaiknya kita menyisipkan gambar di antara poting-an kita tersebut, di samping untuk lebih memperjelas apa yang kita sampaikan. Misalkan kita sedang menerangkan sesuatu, maka dengan adanya gambar akan lebih memperjelas maksud dari topik yang sedang kita jelaskan kepada para pembaca artikel kita. Bagi sobat blogger-sobat blogger yang masih bingung bagaimana caranya untuk memasukan gambar atau istilah bloggernya yaitu upload gambar, maka akan saya ulas langkah-langkahnya :

1. Pada kotak posting, klik toolbar yang bergambar seperti ini

2. Akan muncul gambar seperti dibawah ini:

3. Beri tanda cek pada radio button pada pilihan Pilih tata letak, bila sobat blogger menginginkan posisi gambar bisa di tempatkan di mana saja, pilih pada radio button Tak Satupun, bila posisi gambar di sebelah kiri pilih Kiri, bila ingin di tengah pilih Tengah, bila ingin di kanan pilih Kanan. Beri tanda cek pada Ukuran Gambar, bila ingin gambar yang di upload hasilnya kecil pilih Kecil, bila ingin sedang pilih Menengah, bila ingin besar pilih Besar.

4. Beri tanda cek list di samping tulisan Gunakan tata letak ini setiap saat? bila sobat blogger menginginkan setiap upload gambar settingnya seperti semula

5. Tekan tombol Browse, lalu masukan gambar dari komputer sobat blogger yang ingin di upload.

6. Klik Tambahkan gambar lainnya bila gambar yang ingin di upload lebih dari satu gambar

7. Klik tombol UNGGAH GAMBAR, tunggu beberapa saat sampai proses upload selesai

8. Klik Tombol SELESAI untuk mengakhiri proses upload

Setelah proses upload sobat blogger selesai, untuk melihat gambar tadi, klik tombol Compose. Nah disini sobat blogger bisa melihat gambar yang sobat blogger upload tadi sekaligus dapat mengatur kembali ukuran dari gambar ini, caranyayaitu klik gambar tersebut sampai gambar anak panah mouse sobat blogger berubah menjadi gambar panah empat penjuru. Arahkan mouse pada garis samping gambar sampai gambar mouse berubah menjadi panah dua arah, tekan tombol mouse lalu tahan dan gerakan kearah kiri atau kanan untuk merubah lebar gambar, bila susah sesuai dengan yang sobat blogger inginkan lepas tombol yang sobat blogger tahan tadi. Untuk mengatur tinggi gambar, arahkan mouse pada tepi bawah atau atas gambar sampai gambar mouse berubah menjadi anak gambar panah dua arah, tekan mouse lalu tahan kemudian gerakan mouse keatas atau kebawah untuk mengatur tinggi gambar, lepaskan mouse bila ukuran gambar sudah sesuai dengan yang sobat blogger inginkan.

Happy Blogging :)

Memulai posting di Blog

0 komentar

Untuk memulai penulisan sebuah blog atau istilah di dunia blogger sering disebut posting, ada beberapa langkah yang harus sobat blogger ikuti:

1. Login ke situs blogger milik sobat blogger. Kemudian setelah login, dari menu Dashboard, sobat blogger dapat mengklik tab posting. Tampilannya seperti gambar di bawah ini (dibuka melalui browser Mozilla firefox) :

2. Tulislah judul artikel sobat blogger pada kotak teks Judul, serta isi artikel pada kotak Tulis.

3. Di dalam menu posting ada beberapa toolbar yang bisa sobat blogger gunakan. Jika sobat blogger sudah terbiasa menggunakan microsoft Word ataupun microsoft Excel tentu barangkali tidak akan mengalami kesulitan ketika memposting suatu artikel, tapi mungkin tidak ada salahnya bila saya bahas sekilas tentang ini, barangkali ada di antara teman kita yang masih bingung.

→ Untuk merubah jenis huruf yang di gunakan

→ Untuk merubah ukuran huruf (heading)

→ Untuk Menebalkan huruf

→ Untuk memiringkan huruf

→ Untuk merubah warna hurup

→ Untuk membuat link

→ Untuk membuat artikel menjadi rata kiri

→ Untuk membuat tulisan menjadi di tengah

→ Untuk membuat artikel menjadi rata kanan

→ Untuk membuat artikel menjadi rata kiri dan rata kanan

→ Untuk membuat sub bahasan oleh angka

→ Untuk membuat sub bahasan oleh bullet

→ Untuk mengecek spelling

→ Untuk memasukan gambar(upload gambar)

→ Untuk membuat artikel dalam kode HTML

→ Untuk membuat artikel dalam mode Compose (biasa)

→ Untuk me review (melihat) artikel

Cara penggunaan toolbar di atas adalah blok (beri tanda) terlebih dahulu tulisan yang akan di edit, kemudian tekan tombol toolbar yang di inginkan.

4. Setelah sobat blogger selesai meposting artikel sobat blogger kemudian simpan dengan cara klik tombol " SIMPAN SEKARANG "

5. Setelah itu, untuk mem publish artikel sobat blogger di blog sobat blogger caranya: klik tab edit entri kemudian centang artikel sobat blogger kemudian klik tombol " PUBLIKASIKAN YANG DIPILIH "