Cara Mudah Membuat Widget Social Media Share Tanpa Edit HTML

Cara Mudah Membuat Widget Social Media Share Tanpa Edit HTML - Hai sobat bloger. Selamat sore. Ngomong-ngomong, rasanya saya sudah lama tidak membuat postingan. Yap, jika sobat bertanya kenapa lama tidak buat postingan dikarnakan saya sibuk sebentar lagi Ujian semester . Hari ini saya akan sempatkan untuk share beberapa artikel, salah satunya artikel mengenai Cara Mudah Membuat Social Media Share Tanpa Edit HTML. Buat sobat blogger yang sedang mencari-cari widget social media share, saya akan memberikan tutorial cara pembuatannya tanpa mengedit HTML yang ada di Template.

Untuk sobat blogger yang baru membuat blog, saya sarankan untuk menggunakan widget ini. Kenapa saya bilang begitu, karena menurut saya widget yang satu ini wajib untuk dimiliki dan dipasang di blog sobat untuk meningkatkan jumlah pengunjung blog sobat. Dengan menggunakan jasa jejaring sisial yang sedang populer saat ini bukan tidak mungkin kan untuk menambah jumlah pengunjung / visitor blog sobat. Selain untuk menambah jumlah pengunjung blog sobat, masih banyak kegunaan atau manfaat yang bisa sobat dapatkan dengan memasang widget ini. Untuk sobat yang ingin memasang widget ini di blog sobat, silahkan ikuti langkah-langkah yang saya buat berikut.

• Masuk / Login ke akun blog sobat.
• Pilih Tata Letak =>> Tambahkan Gedget.
• Pilih HTML/Javascript.
• Setelah itu sobat Copy kode dibawah ini dan Paste di kolom HTML/Javascript.

<style>
 
    .touchme a {
    display:block;
    height:50px;
    width:50px;
    padding:0 4px;
    float:left;
    background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEig5isROx-6_TQwEwzx0gsZ30q4KbWRqxw6MfTYPhiw5pOqI7qquupNUmk3DsCYtoW2bqj5AqUFOrzv-ol8KRCcfIdQLpba0qsHJ7Z9cCk1Nu10_pV1YG28qQHWSNV3r5Qzog_2uqwJENk/s1600/Sharing+Touch+Me.png) no-repeat;
    -webkit-transition: ease-in 0.2s all;  
    -moz-transition: ease-in 0.2s all;  
    -o-transition: ease-in 0.2s all;  
    -ms-transition: ease-in 0.2s all;  
    transition: ease-in 0.2s all;
    cursor:pointer;

    }

    .touchme a.googleplus {
    background-position: 0px -58px;

    }
    .touchme a.googleplus:hover {
    background-position: 0px 0px;
    }


    .touchme a.twitter {
    background-position: 0px -290px;

    }
    .touchme a.twitter:hover {
    background-position: 0px -232px;

    }
    .touchme a.facebook {
    background-position: 0px -406px;

    }
    .touchme a.facebook:hover {
    background-position: 0px -348px;

    }


    .touchme a.rss {
    background-position: 0px -174px;

    }
    .touchme a.rss:hover {
    background-position: 0px -116px;

    }


    </style>


    <div class='touchme'>

    <!--RSS-->
    <a class='rss' href="Link RSS Sobat" target='_blank'></a>

    <!--Google Plus-->
    <a class='googleplus' href="Link Goggle Plus Sobat" target='_blank'></a>

    <!--Facebook-->
    <a class='facebook' href="Link FACEBOOK Sobat" target='_blank'></a>

    <!-- Twitter -->
    <a class='twitter' href="Link TWITTER Sobat" target='_blank' ></a>


    </div>

• Silahkan sobat ganti tulisan yang berwarna Biru dengan Link Sosial Media sobat.
• Kemudian Simpan HTML/Javascript.

Contoh Widget

Demikian tutorial Cara Mudah Membuat Widget Social Media Share Tanpa Edit HTML dari saya. Somoga artikel yang saya buat ini dapat berguna dan bermanfaat untuk sobat blogger yang membutuhkan. Jika sobat mengalami kesulitan dalam membuat widget ini, silahkan hubungin saya lewat kolom komentar dibawah atau lewat chatbox atau bisa juga kirim Email ke saya. Terima Kasih dan Salam Blogger.