Cara Menciptakan Widget Social Media Melayang Di Blog

Cara Membuat Widget Social Media Melayang di Blog - Assalamu'alaikum, sahabat blogger? Pada postingan kali ini aku akan kembali membahas tutorial blog perihal Cara Membuat Widget Social Media Melayang di Blog. Berikut ialah teladan preview widgetnya.

Floating Social Media

Nampaknya tidak usah berlama-lama lagi, eksklusif saja kita simak tutorialnya memberikankut ini.

1. Login ke Account Blogger.
2. Masuk ke Dasbor Blog.
3. Pilih Layout → Add Gadget → HTML/JavaScript.
4. Copy Paste (copas) instruksi memberikankut kedalam konten HTML/JavaScript.

<style>
.tutorialblogz-fixedmenu{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-3-MH6DRDTi4YtE8hUC_A5JOKaoKF16urrzc3EQpkbTBr5ZvOHc3Vrn1zwURoCPEWvmWLVkeIWhypJJoye06TM5qaSna-BP8QDdbN5heWsSFnRLRhiiOvZipCHx3SZFNRZ7YVSGUUiBo/s1600/facebook.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:160px; z-index:1000;}
.tutorialblogz-fixedmenu1{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgY9oZJh_5N1lEGhhRdT23g1DsjGNYRt7i-qeHJoPzII6swiQQLpsclt_6105ClyLi9Mw5OTivYCxtUT4fOLTJAlgP3Vo01byU8YCiYooc7En-9gXPNAEH7nD9yD9A47bODS7mAkZyobXE/s1600/facebook-hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:160px; z-index:1100;}
.tutorialblogz-fixedmenu_1{margin:0px 0 0 43px}
.tutorialblogz-fixedmenutw{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhGuoRmdE5ZgoVEOGdU6RdVoaD6Ck5h391JII9DSKShrYg7j3xR0mwGUmJwsE5Y8CWWlR4Oie88XuHtO1tbWzPOG-Cv_CCP9qXlZvnd0V6UCRi0Y4I_7JSQsulEmmERTY6CVWC2WfUVeg/s1600/twitter.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:205px;z-index:1000;}
.tutorialblogz-fixedmenutw1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglJ5b8wFG83EKn-_oE6341sT5rlpkYc5-e7GP7qjN2gqINZltgDy0AiO_4bAqt0UrG9pSANBjde1tCdqxLIDxANTzOs2_pxM8e5l6_t7JK2-XF1-xF6MGK1h-XQxefR4sfmNjzjbvbEdU/s1600/twitter_hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:205px; z-index:1100;}
.tutorialblogz-fixedmenutw_1{margin:0px 0 0 43px}
.tutorialblogz-fixedmenufb{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSwccHQGpKAQcmBEQI3MNZjE9pHWjvXUY-bXG8Wpvns1EQ_y_cHoKm9RRkTyHVRNenf-vfMneZx1ZuWPXExRMaXIDA69pGkH7S0XFxxAi4B8St4me8y6RmfkaE9I-xcvdAjZ3nvZxwqpQ/s1600/Gplus.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:250px; z-index:1000;}
.tutorialblogz-fixedmenufb1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8_9209dfAHb59F7jYyi1RoURKgXrbP5Z5wWOGNcshQJ-_g4ksWaGe0GWq5Kgy-eCXDsWDlX6XTDQYrlWwN0di4O-TbiWUKC-h-lHl5V-jVXXzd-oufY5qANT5El68IjV_O9TZ-mYrV2Y/s1600/Gplus_hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:250px; z-index:1100;}
.tutorialblogz-fixedmenufb_1{margin:0px 0 0 43px}
.tutorialblogz-fixedmenurss{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiO4TSO2jVZdl6CslTcsWXXQvkrB-FlsPHXHrZvFwc14YXHovTNrQpzo9jvj89ObppDGRrEryDjXDoGXaNde0IPnJTNMqBtTQRmInNDwVM9VPhTwHKbg6GcRsv6SsYMwYeSvK6lwm6XM68/s1600/rss.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:295px; z-index:1000;}
.tutorialblogz-fixedmenurss1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJtEBVAZ75vc5_7l0ryWviW3nOh82FHdINLgJv0cYWOaCLJc4hPqUsCbAQVaKswe-_DNQmpUL2K_Itsp5HZ2JBKQ-jDVU7ySqFw2vBUw4Idv7KX1otTDhhr1P7roYdN_XXIaozbYVmFCY/s1600/RSS-hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:295px; z-index:1100;}
.tutorialblogz-fixedmenurss_1{margin:0px 0 0 43px}
</style>
<div class='tutorialblogz-fixedmenu' onmouseout='this.className=&apos;tutorialblogz-fixedmenu&apos;' onmouseover='this.className=&apos;tutorialblogz-fixedmenu1&apos;'><div class='tutorialblogz-fixedmenu_1'>
<a href='https://www.facebook.com/TutorialBlogz' sebuah incaran='_blank'><img alt='Like us on Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqUJ8b5J-6iHHiwiNrlmJcUsAFSEkjvLWHDtEbfB8_kmTjlSRueu0qrG8KNoRdFo0NwWAG1hwtWxaOXKTXC1MTCffLp6e0xEUNxvvAhHRo5sPK7XWDwgOh8kwvE8TcygSU5RSckZc5T4o/s1600/facebook-hover1.png' title='Like us on Facebook'/></a><br/>
</div></div><div class='tutorialblogz-fixedmenutw' onmouseout='this.className=&apos;tutorialblogz-fixedmenutw&apos;' onmouseover='this.className=&apos;tutorialblogz-fixedmenutw1&apos;'><div class='tutorialblogz-fixedmenutw_1'>
<a href='https://twitter.com/TutorialBlogz' sebuah incaran='_blank'><img alt='Follow us on Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm31u5pzl7RgtWir47xzflF49CqHQHHtWenO1_ZQF1y9PiiCxLuByRm_G5_KOXPnqrqJRjmk0-WL-7oesQYwOgQHQKCXOgW6UqSJvoWXVoTcxf44PogcPpsdyK_j_VwJumujzpzQ54nUE/s1600/twitter_hover1.png' title='Follow us on Twitter'/></a><br/>
</div></div><div class='tutorialblogz-fixedmenufb' onmouseout='this.className=&apos;tutorialblogz-fixedmenufb&apos;' onmouseover='this.className=&apos;tutorialblogz-fixedmenufb1&apos;'><div class='tutorialblogz-fixedmenufb_1'>
<a href='https://plus.google.com/102807084759670981471' sebuah incaran='_blank'><img alt='Recommend us on Google Plus' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwf71UURA6Mt3QmHU8XU1vpmdTYdw8Bcsgpd7eOD6ouffIcO3_TnfYxKcw-1xZCNt-QZhNtb4nduVEsg5qywgVxsuPCUnb0kahwgGzRZNEIUsrqpgX7vW5jVlKixB3tewh5R4DljQI46Q/s1600/Gplus_hover1.png' title='Recommend us on Google Plus'/></a><br/>
</div></div><div class='tutorialblogz-fixedmenurss' onmouseout='this.className=&apos;tutorialblogz-fixedmenurss&apos;' onmouseover='this.className=&apos;tutorialblogz-fixedmenurss1&apos;'><div class='tutorialblogz-fixedmenurss_1'>
<a href='http://feeds.feedburner.com/TutorialBlogz' sebuah incaran='_blank'><img alt='Subscribe me on RSS' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBH8iRzS5I1PuIO588K_hU9H3ay4LjwHNkZw9lvwArsNmw1dddgMQHdCBHMMFxCd-2Gki74P29Hs7XwtZUUrRdLuvohVVI52cRqAmuRqpziqEE14q7IhrgsyXSG9lrZC76BVLsn2Kki1E/s1600/RSS-hover1.png' title='Subscribe me'/></a><br/>
</div></div>

Keterangan :

• TutorialBlogz : Ganti dengan username Facebook Fanpage Anda.
• TutorialBlogz : Ganti dengan username Twitter Anda.
• 102807084759670981471 : Ganti dengan ID Google+ Anda.
• TutorialBlogz : Ganti dengan ID Feedburner Anda.

5. Terakhir, klik Save, dan lihat kesannya pada blog sobat. 

Demikianlah Cara Membuat Widget Social Media Melayang di Blog,
Semoga memberi manfaat !

Baca Juga : 
BAGAS31.com, Tempatnya Download Gratis Software Gratis
Software Point of Sales Online Omega POS Cloud

Advertisement