Saturday, December 7, 2013
Browse Manual »
Wiring »
baru
»
blogger
»
floating
»
horizontal
»
share
»
sosial
»
untuk
»
Floating Share Sosial Horizontal Baru Untuk Blogger
Artikel terkait :
Untuk menerapkan widget Floating Horizontal ke blogger Anda, ikuti langkah-langkah berikut ini :
Catatan :
Floating Share Sosial Horizontal Baru Untuk Blogger
Tidak sengaja saat jalan-jalan ke halaman orang lain nemu widget yang keren, namanya Widget Floating Share Sosial Horizontal Baru Untuk Blogger yang tentunya dengan jQuery yang baru juga. Untuk fungsinya sama seperti Floating Share yang kita ketahui tapi berbeda dari tampilannya. Untuk floating yang lama barnya vertikal nah kalo floating baru barnya horizontal. Dan di lengkapi dengan 3 media sosial seperti Facebook, Twitter dan Google Plus. Mungkin ketiga media online utama itu masih kurang karena banyak sekali media sosial yang ada, tapi kalau di perhatikan scriptnya kita bisa untuk menambah tombol media sosial yang lain.
Artikel terkait :
- Cara Membuat Tombol Share Media Sosial di Blogger
- Tombol Share Sosial Floating Bar di Blogger
- Tombol Share Sosial Media Floating atau Melayang di Blogger
Untuk menerapkan widget Floating Horizontal ke blogger Anda, ikuti langkah-langkah berikut ini :
- Login ke Blogger Anda - klik Template
- Pilih Edit HTML - dan cari tag </head> gunakan Ctrl+f untuk mencari
- Setelah menemukan tag di atas, tambahkan kode berikut sebelum tag </head>
<script type="text/javascript" src="https://widcraft.googlecode.com/svn/jquery.js"></script>
- Next, cari kode berikut gunakan Ctrl+f untuk mencari :
<data:post.body/>
- kemudian tambahkan kode berikut tepat dibawahnya :
<b:if cond=data:blog.pageType == "item"><div id=md-active-share-comment-marker></div></b:if>
- Nah, langkah selanjutnya menambahkan widget share-nya, cari kode </body> kemudian tambahkan kode di bawah ini tepat sebelum tag </body> :
<b:if cond=data:blog.pageType == "item"><script src=https://widcraft.googlecode.com/svn/FloatingSocialSharingWidget.js type=text/javascript/><div id=md-share-window style=width: 100%; display: block; position: fixed; top: -450px; left: 0px; background-color: rgba(235, 88, 60, 0.8); z-index: 100; padding: 0 0 10px 0;><div style=width: 800px; margin: 20px auto;><span id=twitter style=float:left; margin: 0 5px; padding: 3px 0 0 0;><a class=twitter-share-button data-count=vertical href=http://twitter.com/share>Tweet</a><script src=http://platform.twitter.com/widgets.js type=text/javascript/></span><span id=md-plusone style=float:left; padding-top: 4px; margin: 0 5px;><script src=https://apis.google.com/js/plusone.js type=text/javascript/><g:plusone size=tall/></span><span id=md-fblike style=float: left; margin: 0 5px; padding: 4px 0 0; width: 50px; overflow: hidden;><div id=fb-root/><script src=http://connect.facebook.net/en_US/all.js#xfbml=1/><fb:like font= href= layout=box_count send=false show_faces=false width=50></fb:like></span><div style=display:block; margin: 0 5px; padding: 5px 0px 0px; color: #FFFFFF>Are you Awesome? Legend has it that Awesome people can and will share this post!<br/><span style=color: #FFFFFF; font-size: 18px;><data:blog.pageName/></span></div></div></div></b:if>
- Langkah terkahir Simpan Template - dan lihat hasilnya
Catatan :
Untuk peletakan tag <data:post.body/> yang akan di salin bila salah tata letak maka widget tidak akan tampil. jadi perhatikan <b:if cond=data:blog.pageType == "item">, lihat kata kuncinya "item" letakan pada baris tag tersebut.
Dan jika Anda masih tetap gagal dalam menambahkan, Anda bisa sharing dengan saya.
Nah, Anda telah mengikuti langkah-langkah Membuat Floating Share Sosial Horizontal Baru Untuk Blogger. Dan akhir kata semoga posting ini menambah cantik tampilan blogger Anda. Salam !
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment