Membuat Garis Di Bawah Judul Postingan

Cara Membuat Garis Di Bawah Judul Postingan

1. Login ke blogger

2. Klik template

3. Sebelum mengutak-atik template silahkan backup dulu template untuk tujuan agar jika kita melakukan kesalahan maka kita bisa mengembalikan templatet tersebut.

4. Jika sudah melakukan backup langkah selanjutnya adalah klik Edit Html kemudian klik Lanjutkan

5. Centang Expand Template Widget

6. Carilah kode /* Post (catatan: tekan tombol ctrl+f untuk memudahkan kita dalam melakukan pencarian kode) 

atau lebih tepatnya cari kode seperti kode di bawah ini :

/* Posts
----------------------------------------------- */
h3.post-title {
  margin: 0;
  font: $(post.title.font);
}

7. Jika sudah silahkan pilih salah satu kode di bawah ini. Kemudian pasang diantara bagian kode di atas 

border-bottom:1px dotted silver;
 border-bottom:1px solid black;
border-bottom : 4px double #cadaef ;

Penjelasan kode :
dotted adalah garis yang putus-putus
solid adalah garis yang tidak putus-putus
double adalah dua garis

Apabila kode garis yang sudah saya berikan sudah dipasang maka hasil akhir kode akan seperti ini :

/* Posts
----------------------------------------------- */
h3.post-title {
  margin: 0;
  font: $(post.title.font);
border-bottom : 4px double #cadaef ;
}

Sebelum menyimpan template, lihat dulu pratinjau.

Read More

Cara Membuat Bingkai Untuk Widget Yang Terdapat Di Area Footer Halaman Blog

Cara Membuat Bingkai Untuk Widget Yang Terdapat Di Area Footer Halaman Blog

1. buka editor template dengan cara mengeklik menu ‘Template’ > ‘Edit HTML’ > 

2. cari kode ]]></b:skin> dan kemudian sisipkan rangkaian kode CSS seperti dalam contoh berikut ini tepat di atasnya.

.footer-outer .widget h2 {
  color: #ffffff;
  text-align: center;
  background: #000000;
  border: 1px solid #ffffff;
  border-radius: 5px;
  padding: 5px;
  margin: 0px;
}

.foot.section .widget-content {
  color: #000000;
  text-align: center;
  background: #ffffff;
  border: 1px solid #000000;
  border-radius: 5px;
  padding: 5px;
  margin: 0px;
  height: 150px;
  overflow: auto;
}

.foot.section .widget.Attribution .widget-content {
  padding: 0px;
  margin: 0px;
  height: auto;
  border: none;
  background: inherit;
}

Read More

Cara membuat banner iklan bergantian otomatis di Blogspot

Untuk memasang banner iklan bergantian otomatis di Blogspot ikuti petunjuk-petunjuknya. Untuk mengetahui petunjuk yang dimaksud kunjungilah link berikut, Cara membuat banner iklan bergantian otomatis di Blogspot,
Kode yang digunakan adalah:

<script language=”JavaScript”><!–
images = new Array(3);

images[0] = “<a href = ‘url target01‘ target=’_blank’><img title=’title01′ src=’url gambar banner01‘></a>”;

images[1] = “<a href = ‘url target02‘
target=’_blank’><img title=’title02′ src=’url gambar banner02‘></a>”;

images[2] = “<a href = ‘url target03‘ target=’_blank’><img title=’title03′ src=’url gambar banner03‘></a>”;

index = Math.floor(Math.random() * images.length);

document.write(images[index]);
//done
// –></script>

Catatan :

#. Untuk saya warnai orange adalah target untuk banner, jika ingin menbahkan, anda buat lagu Image[3] dan seterusnya, karena itu sudah mencapai [2]
#. Untuk yang berwarna merah adalah target/tujuan dari gambar itu akan menuju ke link mana. Anda pasti sudah jelas.
#. Untuk warna biru adalah url gambar yang akan anda pasang.

Read More

Cara Membuat Widget Gallery Foto Gambar Bergerak Berjalan Di Blog

Cara Membuat Gallery Photo gambar bergerak berjalan di blog default (Biasa)

Cara Membuat Widget Gallery Foto Gambar Bergerak Berjalan Di Blog. Agar isi postingan lebih bervariatif dan bahkan bisa terlihat lebih hidup, maka pada gambar-gambar tertentu yang ada dalam blog dibuat dinamis. 
Langkah-langkahnya seperti berikut:

1. Silahkan sobat >> Masuk/Login ke Blogger.com menggunakan akun sobat.
2. Pada Dasbor tampilan blogger baru, pilih Menu >> Tata Letak >> Tambah Gadget >> HTML/JavaScript.
3. Beri judul pada Widget, Contoh "My Foto Gallery". Kemudian letakkan semua kode di bawah ini pada kotak HTML/JavaScript.

Scriptnya seperti ini

<marquee direction="up" onmouseover="this.stop()" scrollamount="3" onmouseout="this.start()"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWid49MRe_yGpDg2BuMetkLc3jxL4p6znKTx2ceGD7QiG-IbVeDc9b6FSAV0IcSpsApnzJqNgst4D26WZBan_WTapym0mdpCXXoMm-QX4RwADrTF4eZq5dz6oX70VitXI6XKTEYPLOrkpP/s1600/Foto024.jpg" width="120" height="120" /><br /> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEwaFTO214QhbMxZlhqEvB-_XiF-1rt2l9u9mLikShrtAMDJlaxgSNlPx-wDALiOrzWUrDQ0pdPERgsLJ_kK24tawp0_QQcA_buYi6U9bC7Id7xo6c8IUYabPeNcVFbFBdrB60b-heA9Ug/s1600/Foto010.jpg" width="120" height="120" /><br /> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEwaFTO214QhbMxZlhqEvB-_XiF-1rt2l9u9mLikShrtAMDJlaxgSNlPx-wDALiOrzWUrDQ0pdPERgsLJ_kK24tawp0_QQcA_buYi6U9bC7Id7xo6c8IUYabPeNcVFbFBdrB60b-heA9Ug/s1600/Foto010.jpg" width="120" height="120" /></marquee>

Hasilnya bisa dilihat pada SideBar pada saat mode Lihat Blog atau Pratinjau.

Keterangan:

• Warna Merah adalah Alamat URL gambar atau foto image. Silahkan sobat ganti dengan alamat URL gambar atau foto image sobat.

• Warna Biru, width="120" dan height="120" adalah ukuran Lebar dan Tinggi image gambar atau foto. Silahkan sobat atur nilainya sesuai dengan keinginan sobat agar sesuai dengan widget blog sobat.

• <marquee direction="up" adalah arah bergerak berjalan ke atas. Silahkan sobat ganti up jadi down jika ingin arah berjalan bergerak ke bawah.

Cara Membuat Gallery Photo gambar bergerak berjalan di blog dengan Url Link tujuan bila di klik. 
Cara yang berikut ini adalah cara yang mudah dilakukan oleh para blogger mania, sebab cara ini hanya menambahkan beberapa kode saja. Namun agar sobat tidak kesulitan dalam menambahkan kode, disini akan saya kasih contoh penerapan kode yang benar. Berikut kode yang menggunakan alamat url link tujuan bila image gambar foto di klik 

<marquee direction="up" onmouseover="this.stop()" scrollamount="3" onmouseout="this.start()"><a href="http://kuc0pas.blogspot.com/2012/12/cara-membuat-widget-gallery-foto-gambar-bergerak-berjalan-di-blog.html" target="blank" title="Cara membuat Galeri foto Gambar bergerak"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhko7Gww4aZgJ2eDHWuNUpsiVUyooSmn_NjMA6bFi1wLsVO7cI35Hlqo__1GDxGJ7ONwaRgACqeON5UxqhYcgsQpQze_1qiJaq_PmUdv89n8UbaGwHkQj1Fe4uDX3zA5osv25_5aY162YM/s1600/PINK1.jpg" width="270" height="270" /></a><br /> <a href="http://kuc0pas.blogspot.com/2012/12/cara-membuat-widget-gallery-foto-gambar-bergerak-berjalan-di-blog.html" target="blank" title="Cara membuat Galeri foto Gambar bergerak"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxCZaBW0ARa7rrraS3WxGbiF60BQtxxo4ExloNXql9Hr3qkRe22q-VWguK91JTUMBMzF6hhvK3_s32A39UmM10Zvc0t7SZ-XYsJaOI7k83PKJHsJWVnUA_VFA300TMbie2LtsmK-ZHlUA/s1600/HT3.jpg" width="270" height="270" /></a><br /> <a href="http://kuc0pas.blogspot.com/2012/12/cara-membuat-widget-gallery-foto-gambar-bergerak-berjalan-di-blog.html" target="blank" title="Cara membuat Galeri foto Gambar bergerak"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhN7uwSUCQprvIArBNt9QcgbjRIjG0nLGl6r5ewPIcYrnYBgXePkCbB3KF30y1BksYnw-tOfADvoS02eRhkmEV0VI7e86aHnxazkaes4r8PshbYtquDx1DM4HieMPe_XyhYb-zec_Cj-jQ/s1600/sonal_chauhan.jpg" width="270" height="270" /></a></marquee> 


Keterangan:

• Warna Hijau adalah Alamat Url tujuan bila image gambar foto di klik. Silahkan di ganti dengan alamat url tujuan sobat.

• Warna Orange adalah Title teks yang keluar jika Mouse pointer menyentuh gambar image foto pada gallery. Silahkan sobat ganti dengan title teks sesuai keinginan sobat.

• Kode yang saya berikan di atas adalah contoh untuk tiga gambar image foto saja. Sobat bisa menambahkan kode image-nya sesuai dengan keinginan sobat.

Demikian tutorial blog tentang Cara Membuat Widget Gallery Foto Gambar Bergerak Berjalan Di Blog secara manual. Jika ada pertanyaan mengenai trik tutorial ini, silahkan sobat bertanya pada form kotak komentar yang tersedia. Senang bisa berbagi dan membantu sobat KUCOPAS semua. Semoga bisa sangat bermanfaat.

ARTIKEL TERKAIT
Cara Membuat Widget Gallery Foto Gambar Bergerak Berjalan Di Blog

Read More

Membuat TeksArea

TULISAN ATAU GAMBAR

Read More

Membuat Tampilan Blog Lebih Menarik

CARA-CARA MENGOPTIMALKAN BLOG

Ada beberapa langkah yang harus ditempuh untuk optimalkan blog. Misalnya klik CARA MEMBUAT TULISAN ATAU TEKS BERJALAN PADA BLOG. Di tempat yang berbeda bisa juga dengan mengklik CARA MEMBUAT TEKS BERJALAN DI HEADER BLOG. Bisa juga menggunakan Script HTML Marquee, yaitu coba klik di sini Cara Membuat Teks Berjalan dengan Menggunakan ScriptHTML Marquee. Dengan cara yang hampir sama bisa klik di tempat ini membuat teksberjalan (marquee). 

Apabila teknik tersebut di atas bisa diterapkan dalam blog yang sedang dirancang, bukan tidak mungkin blog tersebut memiliki daya tarik tambahan, 
Masih banyak lagi teknik yang bisa digunakan untuk memaksimalkan tampilan blog, seperti misalnya:

 

ARTIKEL PENTING
CaraMemasang Label Pada Menu Navigasi Blog
Cara Membuat Link, Tautan Antar Halaman di Blogspot
Cara Menghilangkan Gambar Kunci dan Obeng pada Blog
101 Cara Memperindah Blog
Cara Membuat Entri Populer Dengan Efek Slide Pada Blog
Cara Membuat Teks Berjalan Serta Jenis-Jenisnya (Marquee)
Cara Membuat Widget Artikel Populer
Cara Membuat Daftar Artikel Terbaru Di Blog
Cara BackUp Template Blog dan Mengembalikannya
Cara Membuat Artikel Terkait Di Bawah Postingsn Blog
Membuat Bingkai Untuk Sebuah Tulisan atau Gambar

Read More