Membuat Menu Ikon Mengapung

Setelah hampir satu minggu tidak posting, akhirnya hari ini dapat menulis lagi sebuah artikel yang sebenarnya untuk materi ini sudah banyak diulas oleh para sobat blogger.  Dengan harapan agar nantinya artikel ini dapat berguna dan bermanfaat bagi para sobat blogger lain yang bisa jadi belum mengetahui tentang cara membuat menu dengan ikon mengapung. Atau paling tidak artikel ini dapat berguna dan bermanfaat bagi diri saya sendiri sebagai sebuah catatan on line yang nantinya dapat saya jadikan sebagai bahan rujukan bila diperlukan.

Bila sobat blogger ingin membuat menu dengan ikon mengapung (floating menu with icons) atau biasa juga disebut menu dengan ikon melayang seperti pada gambar di atas, maka caranya adalah seperti pada langkah-langkah di bawah ini.

Pertama, login ke akun blogspot Anda kemudian buka “Template” -  “Edit HTML”. Selanjutnya cari kode ]]></b:skin> dan kemudian copy kode di bawah ini tepat di atasnya.

#eltelu { float:left; height:151px; margin:0; padding:0px 0 0 0px; position:fixed; left:0; text-align:left; top:70%; width:50px; } #eltelu a { display:block; float:left; padding-left:0px; border:none; } #eltelu a img { border:medium none; margin:0 0 6px; }

Kedua, cari kode </body> dan kemudian copy kode di bawah ini tepat di atasnya.

<div id='eltelu'> <a href='http://www.twitter.com/ID_TWITTER' target='_blank' title='Twitter'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuZu_4n69GQi-OgrM9Uye8Z5Kx5bSSybVETey8RjuUZgbjJn5J1IA0DIF48L75pkYZAwpC6sexBKG1h9mn9HCYxQke2ZtCPZbFLennlrdKGyTpTaNmXYxxqH3fIYNwmkuAKyvZL32oLzc/s800/twittericon.png'/></a> <a href='http://www.facebook.com/ID_FACEBOOK' target='_blank' title='Facebook'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglLHtlScvWFlcHwyNoYfwSGd7OwaX0rLQjy_7Uqcb7617iHX282bLPt5zjnTO-4yYONnsMFlhnGK5CD4OEjFx9FJiTiqPeluCrgEmctpmbueMZdEnTbXMXzugzRjj7gS2FPzxoXHJxw1Q/s800/facebookicon.png'/></a> <a href='/feeds/posts/default' target='_blank' title='RSS'><img alt='RSS' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQei-h2VEdRCWmgmprVoSLtiVIyQceJq7saOM8NQY2xAlRzsrX41mQf0WwJR0N-NGGzK9XEPQaIdZX6h7Vy9o3WzlPZ83kjJ8oXyIv72c4E-fwvNivnUonGTK_Q4_tjCi0SwVylQmQu4s/s800/rssicon.png'/></a> </div>

Catatan: Ganti ID_TWITTER dan ID_FACEBOOK dengan ID Twitter serta ID Facebook Anda.

Ketiga, simpan template blog Anda.