Cara Memasang Icon Social Media dengan Teknik Floating

social-iconSetelah beberapa saat lalu saya sempat menulis artikel tentang triks theme 2, theme wordpress yang saya gunakan saat ini. Ada beberapa sobat satublog yang kemudian tertarik dan ikut mendownloadnya. Akan tetapi saat ini memang theme ini udah saya utak-atik dan saya ganti-ganti sesuai dengan selera saya.he…. Jadi yang pasti udah ga sama dengan link download yang saya bagikan dalam artikel tersebut.

Nah pada beberapa hari lalu ada seorang sobat satublog yang tertarik untuk memasang icon social media seperti di samping blog ini. Icon social media seperti google +, Facebook, Twitter, dan Feed RSS memang saya tambahkan sendiri karena sebelumnya hanya ada icon twitter dan rss di sidebar.

Sebenarnya untuk memasang icon social media di samping, saya merujuk pada tulisan sobat saya sukma ramadhani dari http://adhani.com dalam tulisan memasang social media dengan teknik floating. Teknik dan cara yang saya gunakan untuk satublog memang sama. Akan tetapi ada sedikit perbedaan dalam penempatan script dan penempatan gambar.

Daripada kelamaan, silahkan sobat liat dulu code di bawah ini.



Oke, sekarang saya kasih keterangan dikit2 biar bisa di pahami dengan mudah.

Url Profil Google Plus Sobat = Pada bagian ini silahkan sobat isi dengan URL profil sobat, misal punya saya https://plus.google.com/101839716706651758976

Title = Silahkan di isi sesuai dengan title/judul yg sobat inginkan saat mouse menyentuh icon social media

URL icon google plus sobat = Sobat isi dengan url dari link icon yang sobat gunakan. Misal icon sobat tempatkan di blog sendiri, ya tinggal pasang aja url nya. Atau di tempatkan di image hosting, silahkan pasang aja link iconnya.

Sekarang udah jelas kan? Kalau udah sekarang sobat buka dasboard blog wordpress sobat dan langsung ke bagian editor theme yaitu Dashboard -> Appearance -> Editor.

Sip, kalau udah di bagian kanan ada banyak file dari theme yang sobat gunakan. Untuk penempatan code di atas, lebih baik di bagian sidebar atau footer. Untuk penempatan codenya, silahkan letakkan di bagian paling bawah dari file sidebar.php. Kalau ingin di letakkan pada footer, sebelum </body> </html> di bagian footer.php. Akan tetapi kalau sobat ga mau repot, bisa di letakkan pada widget text yang udah disediakan oleh wordpress dibagian Dashboard -> Appearance -> Widget.  Jangan lupa di save ya?he…

Oke, sekarang coba buka blog sobat maka akan muncul icon2 social media yang sobat inginkan. Icon ini akan berada di sebelah kanan blog sobat. Kalau ingin di pindah bisa di lakukan dengan perubahan code position di atas. Oke, sebenernya icon media ini bisa sobat tambahkan maupun kurangi, terserah keinginan  sobat. D

Jadi ga harus sesuai dengan milik saya 😀

Oke segini dulu artikel ini, kaalau sobat bingung silahkan tinggalkan komentar di bawah. Atau mau langsung kirim email saya maupun contact saya by YM or FB.

Keep Blogging & Keep Sharing

Semoga Bermanfaat

Comments

  1. Akhirnya tutorial yang saya tunggu2 di publish jg, hehehe
    mas Adi
    Makasih Banget tutorialnya,

    1. Adi Wibowo says:

      @Farobi Afandi, oke mas farobi.
      langsung di pasang di blog ya? 😀

  2. colomnis says:

    gimana klo di blogspot kakak ? ga bisa kode PHP

    1. Adi Wibowo says:

      @colomnis, ya pasang di widget aja gan. bisa kok

  3. sayang klo di blogspot tidak bisa memakai PHP 🙁

    1. arif says:

      @Dynamic View Template, kode diatas setau saya cuma pake kode HTML dan CSS inline, jadi seharusnya blogspot juga bisa. gak ada kode PHPnya 🙂

      1. @arif, oiya, saya tidak memperhatikannya 😀

        1. Adi Wibowo says:

          @Dynamic View Template, udah di jawab mas arif kan? 😀

      2. Adi Wibowo says:

        @arif, makasih udah bantu jawab mas arif 😀

  4. sepatu says:

    udah nyo gan.tp suka gagal ,cb lg deh

    1. Adi Wibowo says:

      @sepatu, masak gan?
      gagal gimana ya?
      ada yg bisa sayabantu?

  5. ibnu ismadi says:

    nah baru nongol artikel baru na. dari kemarin ane ke sini lom ada artikel terbaru na. sips, artikel kali ini memang keren.
    dari pada floating blog2 lain, ploating blog ne keren banget, salut.

    1. Adi Wibowo says:

      @ibnu ismadi, sory kemarin baru sibuk kerjaan offline gan 😀
      Jadi lama ga update deh.
      Makasih deh kalau artikelnya keren, saya masih terus belajar kok 🙂

  6. adhani says:

    padat ulasannya mas,, saya suka ^^
    dulu saya memasang sosial media dengan teknik ini di blog,, dari hasilnya, icon yang tampil menarik (gambarnya unik) bakal mengundang orang untuk mengkliknya.. selain itu, fungsinya juga mengurangi penggunaan javascript.

    1. Adi Wibowo says:

      @adhani, iya mas, saya lebih suka ulasannya mas adhani, karena jadi terinspirasi untuk nulis 😀
      Maaf kalau kemarin ga izin dulu.he….

      1. adhani says:

        @Adi Wibowo, sudah kok mas minta izinnya, begitu mas publish, ada pemberitahuan link pingback dari blog ini. hehehe
        lagi pula saya tidak mencantumkan TOS/disclaimer di blog saya jika ingin mengutip isi di blog harus meminta izin dulu. jadi jangan khawatir, saya tidak menggigit kok, ^^
        malah saya senang, semakin ilmu itu disebar, semakin baik juga bukan ^^

  7. Aryo Seno says:

    keren nih mas hasilnya, jadi pengen praktekkin

    1. Adi Wibowo says:

      @Aryo Seno, silahkan di praktekin mas 😀

  8. sepatu says:

    wah keren nih mas,boleh dicoba nih

  9. andre says:

    keren mas, sudah kuikuti dan berhasil. kalo kumpulan icon social media nya ada ga?

    1. Adi Wibowo says:

      @andre, kalau saya ambil dari hxxp://iconarchive.com mas. Ya nyari di google juga banyak kok, kita sesuaikan dengan kesukaan kita 🙂

  10. sepatu kerja says:

    mantap gan,ana udah bisa pasangnya..makasih bnyak ya

  11. srulz says:

    makasih mas ya….. tipsnya…. salam kenal..
    ^_^

    1. Adi Wibowo says:

      @srulz, salam kenal juga mas 🙂
      makasih sudah berkunjung 😀

  12. Costume Idea says:

    boleh juga tipsnya 🙂
    sukses selalu bos 🙂

  13. pulsamurah says:

    ijin nyimak masbro, sukses slalu…

  14. qvaa says:

    oke bos sip manfaat untuk blog aku. makasih ya