Cara Membuat Halaman Statis (Static Page) pada Blogspot

B

ertambah lagi fitur menarik dari Blogspot. Para blogger yang blognya bernaung di Blogspot kini sudah bisa membuat halaman statis (static page) pada Blogspot. Jika dulu saya pernah mengatakan bahwa pada Blogspot belum bisa dibuat halaman khusus yang terpisah, tetapi hanya halaman-halaman posting yang berurutan, namun sekarang kemampuan itu telah dibuat oleh Blogspot. Halaman khusus yang terpisah dari kumpulan posting (tulisan) inilah yang lazim disebut sebagai Halaman Statis (static page).

Berikut ini langkah membuat halaman statis pada Blogspot:

1. Login ke dasbor Blogspot Anda, kemudian klik link menu Posting.
2. Selanjutnya klik submenu Edit Laman yang merupakan menu untuk membuat static page pada Blogspot.
   
   
3. Anda akan diarahkan pada pembuatan halaman baru. Cara mengisi halaman yang akan Anda buat mirip dengan membuat posting. Klik tombol Tayangkan Laman jika sudah selesai.
4. Jika baru pertama kali membuat halaman statis ini, Anda akan diminta memilih lokasi dimana Anda akan menampilkan link halaman yang baru saja Anda buat. Link ini akan berfungsi sebagai menu pada blogspot Anda yang jika diklik akan menuju halaman tersebut.
5. Ada 3 pilihan lokasi dari link menu halaman yang Anda buat:
   
   • Bilah Samping Blog : jika Anda ingin menampilkan menu halaman statis Anda pada sidebar blogspot. Ini akan menjadi menu vertikal pada Blogspot Anda.
   • Tab Blog : jika Anda ingin menampilkannya di bagian atas blog Anda. Ini akan menjadi menu horizontal pada Blogspot Anda.
   • Tidak Ada Gadget : jika Anda ingin menampilkannya secara manual seperti ketika membuat menu horizontal pada Blogspot baik menggunakan CSS maupun membuat menu dengan Javascript yang pernah kita pelajari sebelumnya.
   Jika Anda memilih opsi pertama atau kedua, maka secara otomatis sebuah gadget baru yang bernama Gadget Pages akan bertambah pada blog Anda. Anda bisa melihatnya melalui menu Tata Letak kemudian pilih submenu Elemen Halaman.
   
   
    Anda bisa mengedit Gadget Pages ini jika ingin mengatur halaman apa saja yang ingin ditampilkan pada Blog Anda. Hmm, menarik bukan?
   
6. Anda juga bisa menambahkan secara manual Gadget Pages ini (jika tidak memilih pilihan pertama atau kedua pada langkah 5 di atas). Caranya seperti biasa, yaitu:
   
   • Pada dasbor Anda, pilih link menu Tata Letak, kemudian pilih subtab menu Elemen Halaman.
   • Klik link Tambah Gadget pada bagian blog yang ingin Anda tempatkan gadget pages ini.
     
     
   • Maka akan muncul window penambahan gadget baru. Silahkan cari dan pilih Gadget Pages.
     
     

Saya rasa, Anda sudah bisa membuat halaman contact  pada Blogspot pada halaman statis menggunakan fitur ini dan bukan lagi membuatnya pada halaman posting.

Namun,masih ada beberapa kekurangan dari fitur ini. Mungkin karena masih baru dan bisa dikatakan jauh ketinggalan dari pada sistem yang dibuat oleh Wordpress. Beberapa kekurangannya adalah kita belum bisa membuatt dropdown menu pada Blogspot menggunakan fitur ini. Selain itu, kita hanya bisa menambahkan 1 (satu) saja gadget pages nya. Artinya, kita tidak belum bisa membuat menu vertikal dan horizontal sekaligus menggunakan fitur ini.

Meskipun demikian, perkembangannya masih layak untuk kita tunggu. Selamat mencoba :D

Read More

Cara Memasang Musik Pada Blog

N

geblog sambil dengerin musik memang mengasikkan. Oleh karena itu, musik bisa juga dijadikan alat untuk menarik minat pengunjung berlama-lama nongkrong diblog kita. Kali ini saya akan memberikan tutorial website mengenai cara memasang musik pada blog kita. Sehingga blog kita terlihat lebih mewah dan lebih keren. Caranya? Ikuti saja langkah berikut:

1. Buka situs http://www.musik-live.net. Tujuannya adalah untuk mendapatkan kode musik yang akan kita pasang pada blog. Disana tersedia banyak lagu yang bisa Anda pilih. Klik salah satu daftar lagu.
   
   
2. Kemudian akan muncul halaman yang berisi beberapa link kode yang bertuliskan "Play & Embed Code". Anda bisa memilih salah satunya.
   
   
3. Kemudian Anda akan masuk ke halaman kode lagu yang telah terpilih. Di sebelah kiri halaman Anda bisa mendengar lagu yang Anda pilih melalui music player pada situs tersebut. Sedangkan dibagian tengah, Anda akan melihat kolom "Embed code" yang berisi kode dari lagu yang kita pilih. Kode tersebutlah yang akan kita masukkan ke dalam blog kita. Untuk mengkopi kode, silahkan klik tombol "copy" yang ada di sebelah kanan kolom tersebut.
   
   
4. Sekarang login ke blog Anda di blogspot. Pada bagian dasbor, klik link menu "Rancangan". Kemudian, klik link "Tambah Gadget" pada bagian dimana Anda ingin menempatkan musik tersebut pada blog Anda.
5. Akan muncul window "Tambahkan Gadget". Silahkan Anda cari dan pilih gadget "HTML/Javascript".
   
   
6. Copy paste kode yang Anda dapat pada langkah 3 ke dalam kolom kode gadget "HTML/Javascript" tersebut. Setelah itu klik "Simpan".

Selamat mencoba.

Read More

Mengatasi Masalah Posisi Gambar di Posting pada Wordpress

B

eberapa template Wordpress terkadang dibuat tidak maksimal apalagi kalau template gratis. Salah satu masalah yang sering terjadi dan kebetulan sering pula saya hadapi adalah posisi image atau gambar pada posting yang tidak sesuai dengan pengaturan yang kita buat. Misalnya kita mengatur posisi gambar berada di sebelah kiri text (biasanya disebut left align), namun tampilan pada blog justru tidak berada di sebelah kiri text. Contohnya seperti gambar berikut:

Gambar 1. Pengaturan image aligment di posting (left align)

Gambar 2. Tampilan gambar (image) dengan left align

Namun, tampilan pada blog justru seperti gambar berikut:

Gambar 3. Tampilan posting pada blog

Penyebab posisi gambar yang tidak sesuai dengan pengaturan adalah karena struktur CSS untuk pengaturan image alignment yang kurang lengkap. Berikut langkah-langkah mengatasi masalah posisi gambar yang tidak sesuai tersebut:

1. Silahkan login pada Wordpress CMS Anda untuk masuk ke dashboard.
2. Klik menu Editor pada bagian Appearance yang ada di sebelah kiri.
3. Silahkan edit file CSS Anda (biasanya bernama style.css)
4. Tambahkan kode CSS berikut pada file CSS Anda dengan meng-copy paste.
   .aligncenter,
div.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.wp-caption {
    border: 1px solid #ddd;
    text-align: center;
    background-color: #f3f3f3;
    padding-top: 4px;
    margin: 10px;
    -moz-border-radius: 3px;
    -khtml-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}
.wp-caption img {
    margin: 0;
    padding: 0;
    border: 0 none;
}
.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    padding: 0 4px 5px;
    margin: 0;
}
p img {
    padding: 0;
    max-width: 100%;
    }

img.centered {
    display: block;
    margin-left: auto;
    margin-right: auto;
    }
img.alignright {
    padding: 4px;
    margin: 0 0 2px 7px;
    display: inline;
    }
img.alignleft {
    padding: 4px;
    margin: 0 7px 2px 0;
    display: inline;
    }
.alignright {
    float: right;
    }

.alignleft {
    float: left
    }
5. Klik tombol Update File untuk menyimpan perubahan.
   

Maka tampilannya akan menjadi:

Read More