Cara Bikin Menu Bar Dengan Page Laman di Blog
Melanjutkan dari tutorial sebelumnya mengenai Cara membuat Header, kemudian kita lanjutkan dengan pembahasan mengenai Cara Membuat Menu Bar Dengan Page Laman di Blog.
Menu drop down memiliki banyak versi yang disesuaikan dengan template yang digunakan. Namun dengan membuat menu bar dengan menggunakan page laman sendiri, maka menu-menu
tersebut bisa anda sesuaikan dengan kebutuhan. Dan pada versi kali ini kami akan membahas versi laman yang digunakan pada menu.
Page laman merupakan halaman yang digunakan sebagai wadah atau sarana informasi untuk identitas sebuah blog. Seperti halnya, Profil Blog, Contact Blog, Site map dan lain sebagainya yang tidak memerlukan tanggapan dari orang lain atau visitor karean tidak tersedia kolom komentar pada laman page tersebut.
Pada template tertentu untuk dapat memasang menu dengan menggunakan page laman, maka anda hanya perlu memasang template tersebut, maka menu bar akan secara otomatis terpasang. Namun pada kenyataannya, menu-menu tersebut terkadang terlalu banyak atau terlalu sedikit, selain itu, menu-menu tersebut juga tak bisa di drop down. Namun dengan tutorial Cara Membuat menu bar dengan page laman pada blog, maka anda akan dengan mudah mengaturnya. Dan untuk dapat mengubahnya
Berikut ini kami bisikan langkah-langkahnya
- Langkah yang pertama, terlebih dahulu buka browser internet pada komputer dan tunggu sementara halaman browser dimunculkan.
- Selanjutnya silahkan masuk pada dashboard blog anda. Caranya, masuk ke halaman “Blogger.com”, kemudian log in menggunakan akun gmail blog.
- Langkah berikutnya, silahkan tekan tombol anak panah yang terdapat tepat berada disamping kiri tombol Lihat Blog, dengan begitu anda akan melihat beberapa menu ketika tombol tadi ditekan. Silahkan pilih menu “Laman”.
- Dihalaman yang dimunculkan, untuk dapat memebuat menu baru dengan mengguanakan page laman silahkan tekan tombol “Laman Baru”.
- Kemudian silahkan buat menu apa yang ingin anda buat. Jika sudah selesai, sebelum mempublikasikan anda juga bisa terlebih dahulu melakukan review dengan mengklik menu “Pratinjau”.
- Dan jika menurut anda menu yang anda buat telah sesuai, silahkan simpan perubahan dan publikasikan dengan menekan tombol Publikasikan.
- Untuk dapat melihat apakah menu telah dimunculkan di blog silahkan buka halaman depan blog atau muat ulang,
BIKIN GAMBAR GERAK SLIDE SHOW
Cara Membuat Foto dan Gambar Bergerak Slide di Blog
- Salam hangat buat sobat-sobat blog KUCOPAS semua, kemarin saya sudah share artikel tentang Cara Buat Teks Berjalan dan Berkedip di Blog, dan kali ini saya akan share tips dan trik lagi tentang Cara Buat Gallery Foto Bergerak slide di Blog atau Cara membuat foto atau gambar berjalan di blog, bahasa gaulnya ya Script Marquee Bikin Image Lebih Dinamis.
Pada dasarnya membuat image atau foto bergerak slide di blog, Caranya terbilang sangat mudah. Karena kita hanya memberi atau menambahkan script marquee pada image atau foto yang ingin kita tampilkan dalam blog kita. Namun cara penerapannya haruslah benar dan sesuai dengan perintah dari script marquee tersebut. Sobat bisa melihat pada artikel Cara penerapan Script Marquee yang benar.
Maka dari itu, Pada artikel saya kali ini akan menerangkan secara detail tentang bagaimana cara menambahkan script marquee dalam image agar bisa bergerak slide dalam blog dengan sempurna dan tidak ada masalah saat blog kita di kunjungi oleh para visitor dan pelanggan pembaca berita terbaru pada blog kita.
Oke sobat, Kita kembali lagi pada tutorial untuk Cara Membuat Foto Dan Gambar Bergerak Slide Di Blog, silahkan sobat ikuti cara-caranya sebagai berikut:
1. Silahkan >> Login atau Masuk ke blog menggunakan akun sobat.
2. Setelah itu sobat pilih >> menu Tata Letak.
3. Kemudian klik >> Tambah Gadget.
4. Pilih >> HTML/JavaScript.
5. Isi kotak judul dengan judul gallery sobat, contoh My Foto Gallery.
6. Kemudian pada kotak Konten, Silahkan sobat masukkan semua kode Marquee di bawah ini.
<marquee direction="up" onmouseover="this.stop()" scrollamount="5" onmouseout="this.start()"><img src="alamat_gambar_sobat.jpg" width="120" height="70"></marquee>
Catatan:
7. Untuk menyimpan gadget yang baru sobat buat, Ikuti cara berikut ini.
Semoga artikel posting yang saya share ini, yaitu tentang Cara Membuat Gallery Foto Bergerak Di Blog atau Cara Membuat Foto Berjalan Di Blog, bisa sangat bermanfaat untuk sobat KUCOPAS semua
- See more at: http://kuc0pas.blogspot.com/2012/03/cara-buat-foto-dan-gambar-bergerak-di.html#sthash.XuthQWDO.dpuf
CARA BIKIN POPULAR POST DI BLOG
Popular Post atau sering ditulis oleh blogger Indonesia dengan sebutan Tulisan Terpopuler pada dasarnya punya banyak fungsi. Selain berguna untuk menaikan trafik pageview pada blog kita, dengan memasang widget ini, juga akan mempercantik tampilan.
Memasang widget Popular Post secara baik dan unik tentu akan menarik perhatian pengunjung untuk mengklik dan menambah waktu kunjungannya ke blog kita, sehigga bounce rate blog akan semakin kecil, dengan begitu nilai kita akan bertambah dimata search enggine maupun Alexa.
Hanya saja, widget bawaan blogger ini memiliki struktur tampilan yang kurang sedap. Apalagi dengan pengaturan yang rumit jika hendak merubahnya. Hal ini sukses membuat banyak blogger mengurungkan niatnya untuk memasang widget ini di blognya.
Tapi tak usah khawatir, kali ini bloGoooblok ~ akan membahas pemecahan masalah ini dengan mudah. Merubah dan Membuat Popular Post di Blogspot Lebih Ramping tak mesti harus berurusan dengan pengaturan di mode HTML, kita bisa merubahnya tanpa harus pusing dengan susunan script.
Ini contoh tampilan Popular Post yang akan kita buat.
Namun sebelum membuatnya, Anda harus mengaktifkan dulu widget popular post ini di dasboard Anda. Caranya :
Jika telah aktif, kita masuk ke Cara Membuat Popular Post di Blogspot Lebih Ramping, ikuti cara-caranya berikut ini :
Keterangan :
Pada dasarnya membuat image atau foto bergerak slide di blog, Caranya terbilang sangat mudah. Karena kita hanya memberi atau menambahkan script marquee pada image atau foto yang ingin kita tampilkan dalam blog kita. Namun cara penerapannya haruslah benar dan sesuai dengan perintah dari script marquee tersebut. Sobat bisa melihat pada artikel Cara penerapan Script Marquee yang benar.
Maka dari itu, Pada artikel saya kali ini akan menerangkan secara detail tentang bagaimana cara menambahkan script marquee dalam image agar bisa bergerak slide dalam blog dengan sempurna dan tidak ada masalah saat blog kita di kunjungi oleh para visitor dan pelanggan pembaca berita terbaru pada blog kita.
Oke sobat, Kita kembali lagi pada tutorial untuk Cara Membuat Foto Dan Gambar Bergerak Slide Di Blog, silahkan sobat ikuti cara-caranya sebagai berikut:
1. Silahkan >> Login atau Masuk ke blog menggunakan akun sobat.
2. Setelah itu sobat pilih >> menu Tata Letak.
3. Kemudian klik >> Tambah Gadget.
4. Pilih >> HTML/JavaScript.
5. Isi kotak judul dengan judul gallery sobat, contoh My Foto Gallery.
6. Kemudian pada kotak Konten, Silahkan sobat masukkan semua kode Marquee di bawah ini.
<marquee direction="up" onmouseover="this.stop()" scrollamount="5" onmouseout="this.start()"><img src="alamat_gambar_sobat.jpg" width="120" height="70"></marquee>
Catatan:
- Ganti alamat URL gambar "src" yang saya drag berwarna HIJAU pada kode script <img src="alamat_gambar_sobat.jpg" width="120" height="70"> dengan alamat URL gambar image sobat. Kalau belum mempunyai alamat gambar image, Silahkan upload dulu ke FhotoBucket, Picasa, dan lain sebagainya, Kemudian sobat ambil Alamat URL nya dan tempelkan pada tulisan yang saya drag berwarna HIJAU.
- scrollamount="5" adalah Kecepatan Marquee atau image yang berjalan. Silahkan sobat atur nilai kecepatanya, Agar sesuai dengan keinginan sobat.
- Kode "width" dan "height" adalah untuk mengatur ukuran lebar dan tinggi gambar image. Silahkan sobat atur nilainya agar sesuai dengan selera sobat.
- Kode "up" adalah kode arah foto gambar image yang akan bergerak atau berjalan ke atas. Silahkan sobat ganti dengan "down" untuk arah ke bawah, Atau bisa juga diganti kode yang lainya, Agar sesuai dengan keinginan sobat.
- Contoh diatas adalah hanya untuk satu gambar image foto saja. Jika sobat ingin lebih dari satu foto gambar image, Silahkan sobat tambah lagi kode script image tersebut sebanyak gambar image atau foto yang sobat inginkan.
7. Untuk menyimpan gadget yang baru sobat buat, Ikuti cara berikut ini.
- Setelah semua kode marquee sudah sobat masukkan pada kotak Konten HTML/JavaScript, Silahkan sobat klik tombol >> Simpan.
- Selesai dan lihat hasilnya.
Semoga artikel posting yang saya share ini, yaitu tentang Cara Membuat Gallery Foto Bergerak Di Blog atau Cara Membuat Foto Berjalan Di Blog, bisa sangat bermanfaat untuk sobat KUCOPAS semua
CARA BIKIN POPULAR POST DI BLOG
Popular Post atau sering ditulis oleh blogger Indonesia dengan sebutan Tulisan Terpopuler pada dasarnya punya banyak fungsi. Selain berguna untuk menaikan trafik pageview pada blog kita, dengan memasang widget ini, juga akan mempercantik tampilan.
Memasang widget Popular Post secara baik dan unik tentu akan menarik perhatian pengunjung untuk mengklik dan menambah waktu kunjungannya ke blog kita, sehigga bounce rate blog akan semakin kecil, dengan begitu nilai kita akan bertambah dimata search enggine maupun Alexa.
Hanya saja, widget bawaan blogger ini memiliki struktur tampilan yang kurang sedap. Apalagi dengan pengaturan yang rumit jika hendak merubahnya. Hal ini sukses membuat banyak blogger mengurungkan niatnya untuk memasang widget ini di blognya.
Tapi tak usah khawatir, kali ini bloGoooblok ~ akan membahas pemecahan masalah ini dengan mudah. Merubah dan Membuat Popular Post di Blogspot Lebih Ramping tak mesti harus berurusan dengan pengaturan di mode HTML, kita bisa merubahnya tanpa harus pusing dengan susunan script.
Ini contoh tampilan Popular Post yang akan kita buat.
- Masuk ke Tata Letak, lalu pilih Tambahkan Widget dan cari Entri Populer.
- Setalah itu centang thumbnail gambar, lalu Simpan.
Jika telah aktif, kita masuk ke Cara Membuat Popular Post di Blogspot Lebih Ramping, ikuti cara-caranya berikut ini :
- Pertama-tama copy script CSS dibawah ini.
/* Popular Post Widget by bloGoooblok ~
----------------------------------------------------------------- */
.PopularPosts ul,
.PopularPosts li,
.PopularPosts li img,
.PopularPosts li a,
.PopularPosts li a img {
margin:0 0;
padding:0 0;
list-style:none;
border:none;
background:none;
outline:none;
}
.PopularPosts ul {
margin:.5em 0;
list-style:none;
font:normal normal 11px/1.4 'Trebuchet MS', Trebuchet, Verdana, sans-serif;
color:#666666;
}
.PopularPosts ul li img {
display:block;
margin:0 .5em 0 10%;
width:35px;
height:35px;
float:left;
}
.PopularPosts ul li {
background-color:#f3f3f3;
margin:1% .5em -5% 0;
padding:.5em 1.5em .5em .5em;
position:relative;
}
.PopularPosts ul li:before,
.PopularPosts ul li .item-title a {
font-weight;
font-size:120%;
color:inherit;
text-decoration:none;
}
----------------------------------------------------------------- */
.PopularPosts ul,
.PopularPosts li,
.PopularPosts li img,
.PopularPosts li a,
.PopularPosts li a img {
margin:0 0;
padding:0 0;
list-style:none;
border:none;
background:none;
outline:none;
}
.PopularPosts ul {
margin:.5em 0;
list-style:none;
font:normal normal 11px/1.4 'Trebuchet MS', Trebuchet, Verdana, sans-serif;
color:#666666;
}
.PopularPosts ul li img {
display:block;
margin:0 .5em 0 10%;
width:35px;
height:35px;
float:left;
}
.PopularPosts ul li {
background-color:#f3f3f3;
margin:1% .5em -5% 0;
padding:.5em 1.5em .5em .5em;
position:relative;
}
.PopularPosts ul li:before,
.PopularPosts ul li .item-title a {
font-weight;
font-size:120%;
color:inherit;
text-decoration:none;
}
- Lalu login ke akun blogspot Anda. Pada tab disebelah kiri klik Template lalu Sesuaikan.
- Pada tampilan pengaturan pilih Tingkat Lanjut, lalu Tambahkan CSS. Paste script CSS yang diatas kedalam kotak yang disediakan. Jika Anda telah banyak menambah script CSS, paste dibagian paling bawah saja.
- Anda bisa merubah ukuran dan jarak tampilan. Silahkan mengubah script sesuai keinginan. Salah satu contoh script yang bisa Anda rubah adalah background-color:#f3f3f3; pada bagian .PopularPosts ul li {. Rubahlah warga #f3f3f3 dengan yang Anda inginkan, jika ingin tampilannya putih saja ganti dengan kata white atau #fffff.
- Jika telah selesai dengan tampilan yang diinginkan silahkan klik Terapkan ke blog.
PERHATIAN : Hati-hati Mengcopy Tulisan Diatas Tanpa Cantumkan Sumber Asli