floating social media Blogspot

Discussion in 'Blogger' started by Rivaiblog, Feb 7, 2014.

  1. Rivaiblog

    Rivaiblog Member

    Joined:
    Jun 7, 2013
    Messages:
    278
    Likes Received:
    1
    Trophy Points:
    18
    Cara membuat floating social media di blogspot - tutorial cara membuat floating social media di blogspot. cara membuat floating social media di blogspot ini sangat simpel ditambah dengan tampilan social media yang sederhana tapi tetap menarik. Untuk memastikan bagaimana tampilan tutorial cara membuat floating social di blogspot media kali ini silahkan klik icon demo dibawah, nah bila anda tertarik memasangnya silahkan simak tutorial dibawah ini. langsung saja menuju TKP...

    Demo Tutorial

    Pasang CSS
    1. Login ke dashboard anda
    2. Masuk ke "TEMPLATE" lalu klik " Edit HTML "
    3. Cari code ]]></b:skin> [/b]
    4. Copy Code script CSS dibawah ini, pastekan diatas code ]]></b:skin>&nbsp;tadi atau bila template blog anda memakai </style> silahkan pastekan kode CSSnya tepat diatas </style> template anda. Edit code tersebut dan save template anda.

    Code:
    /*****************************************
Name : floating social media
By : Rivai Silaban | Ide Blogspot | Blog Design
Update : Jumat 07 February 2014
*****************************************/
.floating-social-media {position: fixed;width: 100px;height: 200px;left: 10px;top: 100px;}
.floating-social-media a{padding: 10px 0;margin:0;text-decoration: none;}
.floating-social-media a:hover{ opacity: .5;}
/* floating social media CSS end */

    Bila anda ingin memasangnya pada bagian code template anda silahkan cari code <body> setelah ketemu, copy code dibawah ini lalu pastekan code tersebut tepat dibawah <body> yang anda cari sebelumnya. Edit codenya kemudian save dan lihat hasilnya, semoga bermanfaat.

    Code:
    
<div class="floating-social-media">
<span><a href="URL GPLUS" target="_blank" rel="nofollow" title="Gplus"><img alt="Gplus invite" src="http://2.bp.blogspot.com/-R6IAOOCViyQ/UvSBdRvdF9I/AAAAAAAACOU/H_tXC-IJDcY/s1600/G+.png" title="Gplus"/></a></span>
<span><a href="URL FACEBOOK" target="_blank" rel="nofollow" title="Facebook"><img alt="Facebook like" src="http://3.bp.blogspot.com/-qUTLJh7WqXw/UvSBc-GhAVI/AAAAAAAACOM/huP-LFOlsGo/s1600/FB.png" title="Facebook"/></a></span>
<span><a href="URL TWITTER" target="_blank" rel="nofollow" title="RSS"><img alt="feed rss" src="http://2.bp.blogspot.com/-XmUeDuHupd4/UvSBfOfwjcI/AAAAAAAACOk/d5aISdI0zm4/s1600/TW.png" title="RSS"/></a></span>
<span><a href="URL FEED ( RSS )" target="_blank" rel="nofollow" title="Twitter"><img alt="Follow Twitter" src="http://4.bp.blogspot.com/-nuFFZVszo7M/UvSBdqa5pMI/AAAAAAAACOY/3fBs1pzya9I/s1600/RSS.png" title="Twitter"/></a></span></div>

    Buat sobat blogger yang masih belum memahami tata cara pemasangannya di tag html template/xml blog anda silahkan kunjungi laman sumbernya untuk tehnik pemasangannya pada layout gadged blogspot anda.
    Sumber : http://www.ideblogspot.com/2014/02/floating-social-media.html
    Semoga tutorial itu bermanfaat,,,,
    Saya pribadi mohon maaf kepada teman teman admin Bersosial dan teman teman share disini, atas kesalahan yang telah saya lakukan kemarin, yang memang peraturan Forum kita ini masih kurang saya pahami, Atas perhatiannya saya ucapkan terimakasih.
     
    Rivaiblog, Feb 7, 2014
    #1
  2. zouero

    zouero Member

    Joined:
    Jan 25, 2014
    Messages:
    363
    Likes Received:
    9
    Trophy Points:
    18
    Google+:
    Keren gan

    Keren gan icon sosmed nya.. Keliatannya juga enteng kayanya.. Btw, kalo ane mau coba di Wordpress kita-kita bisa gak yah ?
     
    zouero, Feb 7, 2014
    #2
  3. Rivaiblog

    Rivaiblog Member

    Joined:
    Jun 7, 2013
    Messages:
    278
    Likes Received:
    1
    Trophy Points:
    18
    zouero wrote:

    bisa juga gan, coba pasang codenya di
    Code:
    single.php
    gan
     
    Rivaiblog, Feb 7, 2014
    #3
  4. shofighter

    shofighter Member

    Joined:
    Mar 6, 2013
    Messages:
    236
    Likes Received:
    9
    Trophy Points:
    18
    Google+:
    Quote:

    Kode ini buat apaan gan?
    Maklum masih newbie..
     
    shofighter, Feb 7, 2014
    #4
  5. pram

    pram Well-Known Member

    Joined:
    Sep 23, 2013
    Messages:
    3,099
    Likes Received:
    161
    Trophy Points:
    63
    Google+:
    shofighter wrote:

    itu di hapus jika tidak ngaruh....
    Tidak ada fungsinya, hanya untuk menandai
     
    pram, Feb 7, 2014
    #5
  6. Rivaiblog

    Rivaiblog Member

    Joined:
    Jun 7, 2013
    Messages:
    278
    Likes Received:
    1
    Trophy Points:
    18
    shofighter wrote:

    itu hanya code lisensi DMCA Protectnya gan, tanggal pembuatan dan owner.. itu bisa di pasang atau di hapus terserah gan tidak akan ngaruh kok ...
     
    Rivaiblog, Feb 7, 2014
    #6
  7. Rivaiblog

    Rivaiblog Member

    Joined:
    Jun 7, 2013
    Messages:
    278
    Likes Received:
    1
    Trophy Points:
    18
    Quote:

    tepat gan code itu hanya berisi data pembuatan saja, tidak ngaruh, bila istilah dalam pemprograman hanya comment codenya saja..
     
    Rivaiblog, Feb 7, 2014
    #7
  8. cayun

    cayun Member

    Joined:
    Feb 5, 2013
    Messages:
    661
    Likes Received:
    27
    Trophy Points:
    28
    sip keren banget dah cocok

    sip keren banget dah cocok untuk blogcpot saya :)

    kalau untuk wordpress saya pke plugin biar mudah *jail*
     
    cayun, Feb 7, 2014
    #8
  9. Ardilas

    Ardilas Super Level

    Joined:
    Feb 18, 2013
    Messages:
    4,243
    Likes Received:
    317
    Trophy Points:
    83
    Google+:
    shofighter wrote:

    Kita tau, dalam pemrograman ada kode komen dengan kode pembuka /* dan kode penutup */ Diantara kode tersebut adalah isi komen. Biasanya digunakan sebagai catatan oleh si programmer.
     
    Ardilas, Feb 7, 2014
    #9
  10. Rivaiblog

    Rivaiblog Member

    Joined:
    Jun 7, 2013
    Messages:
    278
    Likes Received:
    1
    Trophy Points:
    18
    thx

    tepat sekali gan, tapi bila kita memakai banyak plugins di WP akan memberatkan gan, belum lagi sebuah plugins akan meninggalkan link juicer ke pemiliknya...
     
    Rivaiblog, Feb 8, 2014
    #10
  11. Rivaiblog

    Rivaiblog Member

    Joined:
    Jun 7, 2013
    Messages:
    278
    Likes Received:
    1
    Trophy Points:
    18
    Tepat sekali...

    tepat sekali mastah,,
    thx atas penjelasannya..
     
    Rivaiblog, Feb 8, 2014
    #11
Loading...
Similar Threads - floating social media
  1. KBlogger

    Cara Membuat Floating Button Sosial Media

    KBlogger, Mar 9, 2014, in forum: Blogger
    Replies:
    2
    Views:
    962
    KBlogger
    Mar 9, 2014
  2. sentanawalian

    Daftar List Social Bookmarking Indonesia

    sentanawalian, Feb 4, 2015, in forum: Blogger
    Replies:
    3
    Views:
    2,866
    rajautan
    Sep 16, 2015
  3. Rivaiblog

    Sliding social media share

    Rivaiblog, Feb 25, 2014, in forum: Blogger
    Replies:
    20
    Views:
    2,389
    KBlogger
    Mar 9, 2014
  4. Rivaiblog

    Social share blogspot style

    Rivaiblog, Dec 26, 2013, in forum: Blogger
    Replies:
    4
    Views:
    842
    Rivaiblog
    Dec 30, 2013
  5. wphoet

    Social icon melayang berputar (spin) 2x360 derajat

    wphoet, May 14, 2013, in forum: Blogger
    Replies:
    16
    Views:
    2,687
    wphoet
    May 16, 2013

Share This Page