cara menambahkan musik pada blog

cara menambahkan musik pada blog

https://soundcloud.com/
1. Buka tata letak
2. tambahkan gadget>klik HTML java script
3. lalu copy kode di bawah ini> lalu paste pada kolom



<iframe width="100%" height="166" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/29933001&amp;color=0066cc&amp;auto_play=true&amp;hide_related=false&amp;show_artwork=true"></iframe>

4. setelah di copy paste klik simpan dan selesai


terimah kasih semoga bermanfaat

Read More ->>

Cara Membuat Efek Hover Pada Pada Suatu Bagian Template

Assalamualaikum Wr.Wb. Kali ini saya akan share Cara Membuat Efek Hover Pada  Pada Suatu Bagian Template. Ok langsung Ke-TKP aja sob..

1. Loggin ke blogger
2. Klik Template > Edit Template
3. Tekan Ctrl+f , cari kode yang ingin di buat efek hover, misalnya .postright

hover {border:5px solid #f03;background: #181818;-moz-transition: all 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out;

4. Masukkan kode diatas di bagian template yg ingin di buat efek hover misalnya 

.postright {
overflow: hidden;
background: #000;
display: block;
float: left;
width: 678px;
padding: 12px;
border: 1px solid #222;
margin: 7px;
border-radius: 8px;
height: 200px;
position: relative;

5. Selanjutnya tinggal kamu masukkan kode hover {border:5px solid #f03;background: #181818;-moz-transition: all 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out;
di bagian .postright  tapi sebelum tutup kurung }

6. Jadinya akan seperti ini 

.postright {
overflow: hidden;
background: #000;
display: block;
float: left;
width: 678px;
padding: 12px;
border: 1px solid #222;
margin: 7px;
border-radius: 8px;
height: 200px;
position: relative;hover {border:5px solid #f03;background: #181818;-moz-transition: all
 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out;}

Nb:
Kode yang Hijau, anda Bisa ganti dengan bagian yg ingin di Hoverkan
-Atau anda juga bisa menambahkan background,-webkit,border-radius:dan sebagainya.
-Kalo yang lain anda bisa edit sendiri.

Ok sekian dari saya. Semoga bermanfaat sob. Jika tutorial tidak berhasil silahkan berkomentar di artikel ini atau chat saya di sini Muh. Afnur Sandy Lamakarate

Sumber : Pink-result
Penulis : Blogger Indonesia

(/‾▿‾)/ Back Link Please \(‾▿‾\)

URL

Code For Forum

HTML Code

Anda sedang membaca artikel tentang Cara Membuat Efek Hover Pada Pada Suatu Bagian Template dan anda bisa menemukan artikel Cara Membuat Efek Hover Pada Pada Suatu Bagian Template ini dengan url http://www.sandy-shared.com/2013/08/cara-membuat-efek-hover-pada-pada-suatu.html. Anda boleh menyebarluaskan atau mengcopy artikel Cara Membuat Efek Hover Pada Pada Suatu Bagian Template ini jika memang bermanfaat bagi anda atau teman-teman anda,namun jangan lupa untuk mencantumkan link sumbernya.

- See more at: http://www.sandy-shared.com/2013/08/cara-membuat-efek-hover-pada-pada-suatu.html#sthash.ALa0WAFL.dpuf

Read More ->>

Cara Memberi Efek Zoom dan Spin Pada Postingan

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ الرَّحِيم

Hay sob kali ini saya akan share bagaimana Cara Memberi Efek Zoom dan Spin Pada Postingan. nih liat dulu SS-nya : 

Mau kyk itu? Langsung ikuti Stepsnya sob:

1. Loggin ke blogger
2. Pilih Template > Edit Template
3. Tekan Ctrl+f cari kode ]]></b:skin>
4. Masukkan kode dibawah ini tepat di atas kode ]]></b:skin>


.post img{-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}.post img:hover{-o-transform:scale(1.2) rotate(360deg) translate(0px);-moz-transform:scale(1.2) rotate(360deg) translate(0px);-webkit-transform:scale(1.2) rotate(360deg) translate(0px);-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}}

5. Pratinjau , dan liat apakah berhasil?, kalau berhasil klik simpan.


 Semoga bermanfaat sob.

Jika Ingin Copas Letakkan Sumbernya Sob!!! 

- See more at: http://www.sandy-shared.com/2013/07/cara-memberi-efek-zoom-dan-spin-pada.html#sthash.X7iphQSq.dpuf

Read More ->>

Cara pasang google translate di blog

Cara pasang google translate di blog

Share on facebookShare on twitterShare on emailShare on printMore Sharing Services5

Sobat dapat menerapkan google translate pada blogsobat, terlebih lagi apabila anda ingin pengunjung berbahasa lain untuk dapat membaca blog sobat, misalnya dalam berbahasa inggris, berikut ini cara pasang google translate di blog sobat:

1. Buka web http://translate.google.com/translate_tools.
2. Pilih dropdown bahasa yang sobat gunakan untuk blogsobat yaitu pada langkah 2 "Pilih bahasa laman web Anda".
3. Untuk pengaturan lainnya sobat bisa mengedit/memilih yang sobat mau pada langkah yang ke 3 "tampilkan setelan opsional".
4. Copy code yang ada di langkah 4 yang nantinya dipasang di blog sobat.
5. Buka Dashboard blog sobat, kemudian klik rancangan > halaman element > add a gadget pada posisi sidebar yang sobat inginkan > pilih HTML/JavaScript dan copy kode tadi > jangan lupa SAVE ya..

 Apabila langkah di atas sobat berhasil mencobanya, maka siapa pun pengunjung blog sobat dapat memanfaatkan fasilitas pen terjemah blog ini. semoga artikel cara pasang google translate di blog bermanfaat bagi sobat semuanya. happy blogging ^_^

Read More ->>

Cara Menambah Kotak Pencarian di Blog

Bagi sobat yang baru bergabung dalam dunia blogging, kalian harus tahu bahwa kotak pencarian dalam blog itu sangat penting. Hal ini untuk mempermudah pengunjung mencari artikel postingan yang ada di dalam blog kita. Seperti mesin pencari Google misal, mesin ini mempermudah kita dalam mencari data yang kita butuhkan. Begitu pula di blog sobat, hal ini akan sangat membantu para pengunjung blog sobat.
Di beberapa template, widget pencarian ini sudah dicantumkan, namun bagi yang belum ada jangan khawatir karena kita bakal belajar cara buatnya.

1. Menggunakan JavaScript
Yup, cara pertama bakal Sunu beberin dengan menggunakan kode javascript. Caranya cukup mudah kok!
Pertama login akun blogmu, terus pilih Tata Letak, terus klik Tambahkan Gadget, PilihHTML/JavaScript.
Lalu masukkan kode berikut:

<form action="http://nama-blogmu.blogspot.com/search"
method="get"> <input class="textinput" name="q" size="30" type="text"/> <input value="search" class="buttonsubmit" name="submit" type="submit"/></form>

Ganti tulisan "nama-blogmu" dengan link sobat, dan "30" dengan panjang lebar yang sobat kehendaki.
Kalau sudah klik Simpan.
Hasilnya akan menjadi seperti ini:

 

2. Menggunakan Widget Penelusuran
Cara ini hampir sama dengan cara pertama, bedanya kita tidak menambah kode script apapun. Kita hanya menambahkan widget ke blog kita.
Pada Tata Letak, kita tambahkan widget Kotak Penelusuran.
Nah terus klik simpan dan atur sesuai kehendak sobat.

Selesai, semoga tutorial ini dapat mempermudah pengunjung blog sobat dalam mencari artikel postingan yang sobat buat.

Read More ->>