Showing posts with label Efek Blog. Show all posts
Showing posts with label Efek Blog. Show all posts

Monday, April 23, 2018

√ Cara Menciptakan Efek Salju Pada Blog

Banyak cara untuk memodifikasi tampilan blog semoga lebih menarik, salah satunya yakni menambahkan imbas salju pada blog kita. Meskipun ini agak menambah berat loading blog tapi blog kita menjadi tampak rame dan menarik.

Kalau Anda ingin tau ingin memasang imbas salju pada blog, berikut ikuti langkah-langkah cara menciptakan imbas salju pada blog :

1. Login akun blogger Anda.
2. Pilih Tata Letak ---> Tambah Gadget ---> HTML/JavaScript.
3. Letakkan instruksi berikut pada HTML/JavaScript untuk judulnya dikosongkan saja.
<script type="text/j4vascript" src="http://id-pemula-j4vascript.googlecode.com/files/efek-salju.js" /></script>
<script type="text/j4vascript">
snowStorm.snowColor = '#6bd';
// salju biru muda silakan ganti dengan warna lain
snowStorm.flakesMaxActive = 96;
snowStorm.useTwinkleEffect = true;
</script>
4. Kemudian Simpan.

Nah, kini Anda dapat melihat hasilnya, tampilan blog Anda menjadi lebih rame dan menarik.
Sumber http://id-pemula.blogspot.com

Saturday, April 21, 2018

√ Cara Menciptakan Link Blog Berwarna – Warni

Pada kesempatan kali ini kita akan membahas cara menciptakan link blog menjadi berwarna – warni dikala kursor di arahkan pada link, sehabis sebelumnya kita membahas cara menciptakan imbas salju pada blog.

Fungsi utama dari link berwarna – warni ini yakni hanya untuk memperindah tampilan blog, untuk pemasangan isyarat script ini sendiri tidak akan terlalu menambah berat loading blog Anda. Jika Anda ingin memasangnya berikut ikuti langkah-langkahnya :

1. Login akun blogger Anda.
2. Pilih Template > Edit HTML > centang Expand Template Widget.
3. Jangan lupa backup template semoga gampang mengembalikan jikalau terjadi kesalahan.
4. Cari isyarat </head> (Gunakan F3 atau Ctrl + F).
5. Letakkan isyarat berikut sempurna dibawah </head>
<script src='http://id-pemula-j4vascript.googlecode.com/files/rainbow.js'/>
6. Simpan template.

Nah, itu tadi dengan cara yang pertama, berikut cara yang kedua tanpa Anda harus masuk kedalam script template blog :

1. Login akun blogger Anda.
2. Pilih Tata Letak ---> Tambah Gadget ---> HTML/JavaScript.
3. Letakkan isyarat berikut pada HTML/JavaScript untuk judulnya dikosongkan saja.
<script src='http://id-pemula-j4vascript.googlecode.com/files/rainbow.js'/></script>
4. Kemudian Simpan.

Sekarang sehabis pemasang imbas warna-warni pada link blog, tampilan blog Anda menjadi lebih menarik.
Sumber http://id-pemula.blogspot.com

Saturday, April 14, 2018

√ Cara Menciptakan Pengaruh Bayangan Pada Link Blog

Anda merasa bosan dengan tampilan link pada blog? Atau ingin mengganti tampilan link blog jadi lebih menarik menyerupai posting yang telah kita bahas sebelumnya yaitu cara menciptakan link blog berwarna-warni. Mengubah link blog diharapkan ketelitian dan kesabaran dalam mengedit arahan template alasannya ialah tidak semua template memiliki arahan yang sama.

Pada kesempatan kali ini kami akan membahas cara menciptakan efek bayangan pada link blog. Jika Anda berminat mengubah link blog terdapat efek bayangan silahkan ikuti langkah-langkahnya berikut ini :

1. Login akun blogger Anda.
2. Pilih Template > Edit HTML > letakkan kursor pada area arahan HTML.
3. Cari arahan menyerupai dibawah ini dengan memakai Ctrl + F.
a:hover {
color:#FFFFFF;
text-decoration: underline;
}
4. Kemudian tambahkan arahan text-shadow:3px 3px 3px #000;
a:hover {
color:#FFFFFF;
text-decoration: underline;
text-shadow:3px 3px 3px #000;
}
Keterangan:
3px 3px 3px yaitu ukuran bayangan yang akan ditampilkan.
#000 yaitu arahan warna yang akan ditampilkan.
5. Klik Pratinjau template untuk mengecek hasilnya, lalu klik Simpan template.

Nah, sekarang tampilan link pada blog Anda lebih menarik dan tidak menciptakan bosan pengunjung untuk mengkliknya, agar bermanfaat.
Sumber http://id-pemula.blogspot.com

Monday, April 9, 2018

√ Cara Menciptakan Pengaruh Berbintang Pada Link Blog

Mengubah tampilan link pada blog sangat diharapkan jikalau Anda ingin menciptakan blog kesayangan Anda menjadi lebih berwarna dan menarik. Banyak tips dan cara mengubah tampilan link menjadi lebih menarik salah satunya dengan menciptakan efek berbintang pada link blog jikalau terkena kursor.

Berikut ini kita akan membahas cara mengubah link menjadi efek yang berbintang. Ikuti langkah-langkahnya berikut ini :

1. Login akun blogger Anda.
2. Pilih Template > Edit HTML > letakkan kursor pada area aba-aba HTML.
3. Tekan Ctrl + F lalu cari aba-aba berikut ini.
a:hover {
color:#FFFFFF;
text-decoration: underline;
}
4. Setelah ketemu ganti aba-aba yang berwarna merah diatas dengan aba-aba berikut.
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaD3UtuY1owAvfxiZjPz-fO0iCfD_gBtDHZ4-MsnzBuN6O8UmJhFfYtkJ2BEcm_QQe8wSUk7VqZPEd-sS-_ClcmYl0sZIIrzNPUU9se12ZeAOvjiDPEBpQcntoyEIoBHCEo3TQJASopaEE/s1600/link+berbintang.gif);
5. Kodenya akan menjadi ibarat ini.
a:hover {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaD3UtuY1owAvfxiZjPz-fO0iCfD_gBtDHZ4-MsnzBuN6O8UmJhFfYtkJ2BEcm_QQe8wSUk7VqZPEd-sS-_ClcmYl0sZIIrzNPUU9se12ZeAOvjiDPEBpQcntoyEIoBHCEo3TQJASopaEE/s1600/link+berbintang.gif);
}
6. Kemudian Simpan template.

Nah, cukup sederhana cara mengubah tampilan pada link blog. Selamat mencoba dan biar bermanfaat.
Sumber http://id-pemula.blogspot.com

Saturday, March 17, 2018

√ Menciptakan Animasi Sinterklas Di Blog

Sebentar lagi memasuki bulan desember, bagi Anda yang beragama Nasrani akan merayakan hari natal. Perayaan hari natal identik dengan tokoh sinterklas, nah pada kesempatan ini kami akan menunjukkan warta cara menciptakan animasi sinterklas di blog.
Berikut langkah cara menciptakan animasi sinterklas di blog :

1. Login akun blogger Anda.
2. Pilih hidangan tab Template > Edit HTML > letakkan kursor pada area instruksi HTML.
3. Cari instruksi </head> (tekan tombol Ctrl + F untuk melaksanakan pencarian).
4. Letakkan instruksi berikut diatas instruksi </head>
<script type="text/j4vascript" src="http://id-pemula-j4vascript.googlecode.com/files/santa.js" />
5. Kemudian cari instruksi </body>, letakkan instruksi berikut diatas </body>
<marquee scrolldelay='100' style='position:fixed; top:0; right:0; z-index:9999; width:100%;'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw17pBgWJZJWyxKLYBAtOQ_qpDSTy8qWme073GZIXB0T9_fj2iNvXPmd2ZS9bdhqdcqy2XLcDt8CGqqgksfK_4WfMq79tUfTvZjQ1oEJHh-UUDF3O-StC2M4SZJBqKPmYYbxpN44iLyrYn/s1600/Sinterklas.gif' /></marquee>
6. Simpan template.


Semoga sanggup membantu!
Sumber http://id-pemula.blogspot.com

Tuesday, January 16, 2018

√ Cara Menciptakan Efek Bayangan Pada Gambar Posting Blog

Pada artikel sebelumnya pernah kita tuliskan cara menciptakan imbas bayangan pada link blog supaya terkesan lebih menarik. Selain sanggup menciptakan imbas bayangan pada link blog kita juga sanggup meperindah gambar pada postingan yakni dengan menambahkan imbas bayangan menyerupai halnya imbas banyangan pada link blog.


Cara menciptakan imbas bayangan pada image atau gambar posting blog sangat mudah, Anda tinggal menambahkan beberapa arahan imbas bayangan pada tema blog. Sebagai catatan imbas bayangan jangan terlalu tebal supaya tetap terkesan elegan pada gambar posting blog. Kalau Anda tertarik eksklusif saja berikut langkah cara menciptakan imbas bayangan pada image atau gambar posting blog :

1. Login akun blogger Anda.
2. Pilih sajian tab Tema >> klik Edit HTML
3. Kemudian cari arahan .post-body img (Gunakan Ctrl+F untuk mempermudah pencarian).
4. Tambahkan arahan imbas bayangan berikut pada bab .post-body img
box-shadow:1px 2px 5px rgba(0,0,0,.1) #000;
5. Contoh kodenya akan menyerupai dibawah ini :
.post-body img,.post-body .tr-caption-container,.Profile img,.Image img,.BlogList .item-thumbnail img{background:#fff;border:1px solid #eee;-moz-box-shadow:1px 1px 5px rgba(0,0,0,.1);-webkit-box-shadow:1px 1px 5px rgba(0,0,0,.1);box-shadow:1px 2px 5px rgba(0,0,0,.1) #000;padding:5px;}
Keterangan :
Nilai 1px : nilai imbas bayangan kekanan, semakin tinggi nilainya semakin besar dan kekanan imbas bayangannya.
Nilai 2px : nilai imbas bayangan kebawah, semakin tinggi nilainya semakin besar dan kebawah imbas bayangannya.
Nilai 5px : imbas blur pada bayangan, semakin tinggi nilainya semakin tidak terang atau blur bayangannya dan semakin kecil nilainya semakin terang imbas blur-nya.
Nilai #000 : arahan warna dari bayangan, sanggup Anda ganti sesuai dengan keinginan.
6. Kalau sudah Simpan tema.

Nah, itu tadi cara menciptakan imbas bayangan pada gambar posting blog, warna dan tampilan bayangan sanggup Anda ganti sesuai dengan impian dengan tetap memperhatikan kesan elegan pada gambar atau image blog. Semoga berhasil dan bermanfaat!

Sumber http://id-pemula.blogspot.com

Thursday, January 11, 2018

√ Cara Menciptakan Efek Transparan Pada Gambar Posting Blog

Gambar pada posting blog sanggup kita edit atau modifikasi untuk menambah kesan menarik pada gambar dan posting blog. Salah satunya yaitu membuat imbas bayangan pada gambar yang sudah pernah kami tuliskan pada posting sebelumnya. Pada kesempatan ini kami akan memperlihatkan imbas kembali pada gambar posting dengan memperlihatkan imbas transparan dikala kursor diarahkan ke gambar tersebut.


Gambar transparan ini berfungsi dikala kursor diarahkan ke gambar saja dan berlaku untuk gambar posting saja. Langsung saja berikut langkah cara menciptakan imbas transparan pada gambar posting blog :

1. Login akun blogger Anda.
2. Pilih sajian tab Tema >> Klik Edit HTML.
3. Kemudian cari aba-aba .post-body img (Gunakan Ctrl+F untuk mempermudah pencarian).
4. Tambahkan aba-aba berikut sempurna diatas aba-aba .post-body img
.post-body img:hover {
-moz-opacity:0.5;
-khtml-opacity:0.5;
opacity:0.5;
}
Keterangan :
Ganti nilai 0.5 untuk tebal atau tidaknya imbas transparan pada gambar.
5. Kalau sudah Simpan tema.

Nah, itu tadi cara menciptakan imbas transparan pada gambar posting blog. Kalau Anda tertarik sanggup diterapkan pada blog untuk memperlihatkan imbas transparan dan menciptakan blog menjadi lebih variatif serta tidak membosankan. Semoga bermanfaat!

Sumber http://id-pemula.blogspot.com