Cara Zone

Portal online Tips dan tutorial

Dapatkan tutorial terupdate gratis dengan berlangganan artikel

Wednesday, October 1, 2014

Cara Mempercantik Tampilan Youtube Pada Blog

Cara Mempercantik Tampilan Youtube Pada Blog
Menampilkan video Youtube pada blog tentu sudah tidak asing lagi bagi kita para blogger, hanya dengan mencopy dan paste embed video dari YT ke dalam blog sudah cukup. Namun akan lebih menambah keren dan ciamik jika kita menambahkan skin dengan iframe yang membuat Video yang kita tampilkan di Blog mirip seperti tampilan Video Youtube yang ada di Tablet.

Coba Sobat Lihat dulu Demo Berikut :



Keren Bukan?
Baiklah berikut cara menerapkannya pada blog kita

# Pertama
  • Login ke Akun Blog masing-masing
  • Pilih Blog yang akan Anda pasangkan Skin untuk Video Youtube
  • Klik blognya Cara Mempercantik Tampilan Youtube Pada Blog
  • klik template Cara Memasang Meta Tag Pada blogspot
  • klik edit HTML Cara Mempercantik Tampilan Youtube Pada Blog

#Kedua
Setelah terbuka Silahkan Lihat dan cari kode ini :
]]></b:skin>

Supaya Lebih mudah silahkan copy Code diatas lalu klik ctrl + F pada keyboard lalu pastekan di form search

Setelah ketemu silahkan lanjut ke tahap berikutnya yakni memasang kode Css yakni dengan mengcopy dan pastekan kode-kode berikut tepat diatas ]]></b:skin>

.carazonevp{background:#d3d3cc;border:3px solid #c5cbcc;border-radius:2.5em 2.5em 1em 1em;font-family:'Arial';color:white;font-size:12px;margin-bottom:.5em;padding:1.2em 1em 1em;text-align:justify}.carazonevp iframe{width:100%}.carazonevp object{width:100%}.carazonevp embed{position:absolute;top:0;left:0;width:100%;height:100%}.carazonevp:before{background:#6d6d66;border:1px #ebf6ff;border-radius:50%;content:"";display:inline-block;position:relative;padding:1em;z-index:1;float:right;margin-right:50%;margin-bottom:5px}.carazonevp:after{background:#6d6d66;border:2px #ebf6ff;border-radius:0 0 1em 1em;content:"Jangan Lupa Berlangganan Video tutorial CaraZone";display:block;position:relative;padding:1em}

Silahkan Simpan
Catatan :
Kode warna yang tercetak tebal dan berwarna merah sobat bisa sesuaikan dengan keinginan masing-masing
Jangan Lupa Berlangganan Video tutorial CaraZone , Silahkan Ganti dgn kalimat sesuai selera Anda

Untuk Penerapan Pada Artikel
Gunakan Mode HTML
Silahkan Masukkan Tag Section berikut ini
<div class="carazonevp" style="text-align: center;">
Letakkan salah satu  embed Video Anda disini
</div>

Sebelum dipubikasi silahkan Pratinjau dulu
Selamat sekarang tampilan video Youtube pada blog anda sudah jadi, semoga bermanfaat

Jangan Lupa baca ini :
Cara Mengintegrasikan Youtube Pada Fanpage Facebook
Cara Mudah Meningkatkan View Youtube
Cara Menambahkan Link Sosial Media Di Youtube
Cara Mendapat Backlink dari Youtube

4 comments:
Silahkan komentar
  1. Keren abizz, kalau saya jg sdh bikin frame youtube dengan tampilan 3D, monggo di cek: www.foredi.in

    ReplyDelete
    Replies
    1. Wah keren juga gan, manngstab terimakasih kunjungan dan komentarnya

      Delete

Silahkan Follow atau Like FP Cara Zone
Join Our Newsletter