Cara Membuat Share Button Melayang Dengan Sumo Me

Share button atau tombol share sangatlah penting dalam sebuah blog, tombol share ini berfungsi untuk membagikan artikel kita di sebuah situs jejaring sosial.

Biasanya setelah setelah mengklik tombol share, maka tampilan situs jejaring sosial tersebut langsung akan muncul. Tombol share ini juga berguna untuk meningkatkan view, karena blog kita sudah ada di situs jejaring sosial yang kita miliki.

Tombol share ada banyak jenisnya, dari yang bawaan template yang kita pakai, ataupun yang bisa kita pasang secara manual.

(Baca juga : Cara Membuat Tombol Share Bergaya Flat di Blogger)

Tetapi kali ini saya tidak akan menjelaskan tentang tombol share bawaan template, tetapi tentang tombol share yang bisa di pasang secara manual. Disini saya akan memakai tombol share dari Sumo Me.

Sumo Me adalah tombol share yang sangat populer, karena banyak blog-blog yang sudah terkenal memakai tombol share ini.

Untuk contoh tampilannya, kalian bisa lihat di samping kiri pada blog Tutorial Umum. Terlihat jelas tombol share yang saya tampilkan untuk pengunjung.

Untuk cara memasang tombol share sumo me ini, ikuti langkah-langkah dari saya berikut ini.

Cara Membuat Share Button Melayang Dengan Sumo Me

1. Cara Mendaftar Sumo Me

Langkah pertama, silahkan masuk ke situs Sumo Me
Masukan url blog kalian di tengah form di halaman depan dengan http://, Seperti contoh berikut ini
Kemudian masukan email yang kalian miliki, dan password yang kalian inginkan, setelah itu pilih Sign Up
Setelah selesai mendaftar, silahkan klik 1 kali pada script yang sudah di tampilkan untuk mengcopy.

2. Cara Memasang Sumo Me di Blog

Buka akun Blogger kalian
Pilih menu Tema, kemudian pilih Edit HTML
Cari kode <head>, kemudian masukan script yang sudah di copy tadi tepat di bawahnya
masukan script yang sudah di copy tadi tepat di bawahnya
Jika berhasil, maka akan muncul 1 tombol di kanan atas blog, seperti ini.

3. Cara Menambahkan Share Button di Samping Kanan Layar

Klik tombol yang ada di kanan layar
Silahkan masukan kembali email dan password kalian, setelah itu pilih Log In
Setelah masuk, pilih pilihan free, kemudian pilih Continue
Di form SUMO, pilih Share, kemudian pilih ON
Setelah selesai, silahkan keluar, kemudian refresh halaman blog kalian, jika berhasil tombol share akan muncul di kiri layar, seperti contoh berikut ini

4. Cara Mengganti, Menghapus, dan Menambahkan Share Button Sumo Me

Klik tombol yang muncul di kanan atas blog kalian, kemudian klik Share
Pilih menu Settings, kemudian pilih tombol share yang ingin di ganti, dihapus, ataupun di tambahkan
Untuk memindahkannya silahkan tekan dan tahan pada mouse
Pilih tombol share yang di inginkan
Setelah selesai pilih tombol SAVE.

(Baca juga : Cara Membuat Widget Komentar Terbaru dengan Avatar)

Demikian tutorial dari saya mengenai cara membuat share button melayang dengan sumo me. Jika ada pertanyaan tentang cara memasangnya, atau tentang tombol share sumo me ini, silahkan masukan di kolom komentar.

Terima kasih sudah berkunjung di blog Tutorial Umum. Untuk tutorial yang lainnya dari saya, tetaplah kunjungi blog Tutorial Umum.

Postingan populer dari blog ini

Cara Mengganti Icon Favicon di Blogger

Pada tutorial kali ini saya akan membagikan tutorial tentang cara mengganti icon favicon yang ada di Blogger . Kita sering melihat icon favicon ini di atas address bar, biasanya pada saat awal pembuatan sebuah blog, kita akan mendapati tampilan default dari icon favicon tersebut. Baca juga : 2 Cara Termudah Mengganti Template Blog di Blogger Favicon sendiri berasal dari kata " Favorites Icon " yang berarti ikon favorit, tetapi jangan takut gambar yang kalian ingin masukan tidak sesuai, karena untuk mengupload icon ini, bisa menggunakan gambar format png ataupun gif . Favicon Icon ini bisa kalian buat sendiri menggunakan berbagai macam tools, asalkan ukuran tinggi dan lebar dari gambar tersebut sama. Kenapa sih kita harus mengganti Icon Favicon? Jawaban yang paling tepat adalah karena Icon ini melambangkan secara umum bagaimana karakter dari blog yang kita miliki, seperti dari warna, bentuk gambar ataupun bentuk teks. Lalu bagaimana cara membuat Favicon seperti blog Tutorial...

Baca Lebih Lanjut »

Cara Menggunakan Google Webmaster Tools Terbaru

Kita sering melihat banyak blog yang muncul di google.com . Biasanya untuk mencapai posisi teratas dari google, seorang blogger menggunakan berbagai cara seperti menggunakan Webmaster tools . Untuk itu, pada tutorial kali ini saya akan memberikan cara menggunakan google webmaster tools . Sebetulnya banyak webmaster tools yang bisa digunakan para blogger, tetapi untuk mempermudah para blogger, google telah menyediakan Webmaster Tools agar para blogger dapat dengan mudah mengideks artikel-artikel mereka. (Baca juga : Cara Menggunakan Bing Webmaster Tools Terbaru ) Apa itu Google webmasters tools ? Seperti yang sudah saya jelaskan tadi, Google Webmaster tools adalah fasilitas yang di berikan google agar mempermudah para pemilik sebuah situs dalam mesin pencari. Dalam hal ini Google juga memperlihatkan kinerja dari website atau situs yang kita miliki. Tidak usah panjang lebar menjelaskan, berikut adalah cara menggunakan Google webmaster tools. (Baca juga : Cara Mengatasi Webmas...

Baca Lebih Lanjut »

Cara Menambah Slot Widget Sidebar Template Evo Magz

Cara Menambah Slot Widget Sidebar Template Evo Magz - Widget adalah hal yang sangat penting dalam sebuah blog. Dengan sebuah widget, maka kelayakan dari blog tersebut untuk menjadi blog yang baik akan semakin terlihat. Banyak widget yang dapat di gunakan agar pengunjung dapat dengan mudah melihat halaman lain dari blog tersebut. Untuk itu menambah slot widget sangatlah di perlukan. (Baca juga : Cara Menghilangkan Garis Warna Warni Template Evo Magz ) Template Evo Magz buatan Mas Sugeng adalah template yang paling mudah untuk di kembangkan. Untuk itulah saya membuat tutorial cara menambah slot widget sidebar template evo magz . Tidak usah panjang lebar langsung saja ikuti langkah-langkah dari saya berikut ini. Cara Menambah Slot Widget Sidebar Template Evo Magz 1. Cara Menambah Slot Widget Sidebar Masuk ke akun blogger kalian Pilih menu Tata Letak , hapus semua widget yang ada di sidebar template evo magz Kemudian pilih menu Tema , pilih Edit HTML Cari skrip <b:section class='...

Baca Lebih Lanjut »

2 Cara Setting Robot.txt di Blogger & Mengatur Tag Tajuk Robot Khusus di Blogger

Mengatur robot.txt sangat di anjurkan karena ini adalah faktor yang paling penting apabila sobat ingin memudahkan blog sobat untuk di rayapi oleh mesin pencari. Dengan penerapan robot.txt ini blog sobat akan menjadi semakin SEO friendly . Untuk itu kali ini saya akan memberikan tutorial yaitu 2 cara setting robot.txt di blogger dan mengatur tag tajuk robot khusus di blogger . (Baca juga : Teknik Cara Memasukan Attribute Alt di Gambar Agar Artikel Menjadi SEO ) Untuk cara setting robot.txt yang aman di blogger , ikuti langkah-langkah dari saya berikut ini. 2 Cara Setting Robot.txt di Blogger 1. Cara Setting Robot.txt Default di Blog Sebetulnya settingan ini adalah settingan awal pada saat sobat membuat blog, tetapi jika sobat ingin menambahkannya juga tidak apa Langkah pertama masuk ke akun Blogger sobat Pilih menu Setelan , pilih Preferensi penelusuran Di kolom Perayap dan pengindeksan ada robot.txt khusus , kemudian pilih Edit , pilih Ya Kemudian masukan text robot.txt di bawah ini...

Baca Lebih Lanjut »

Cara Membuat HTML kbd tag dengan Efek Double click to select

Element <kbd> biasa di gunakan untuk membuat masukan perintah dari keyboard, dan bisa juga di gunakan untuk membuat perintah ( voice command ). Namun tag kbd ini juga di gunakan para pengguna situs web untuk membuat perintah di tengah teks, seperti blog Tutorial Umum sendiri juga menggunakan tag kbd untuk membuat sebuah perintah untuk pengunjung. Untuk itulah pada tutorial kali ini saya akan memberikan cara membuat HTML kbd tag dengan efek double click to select . (Baca juga : Cara Membuat Efek Tombol Keyboard di Blogger Dengan CSS ) Agan juga bisa mengatur warnanya sesuai keinginan agan. Dan juga untuk efek hover teksnya, agan juga bisa menggantinya sesuai keinginan agan. Apabila agan tidak ingin menggunakan JavaScript dari tag kbd ini, agan tidak perlu memasukan JavaScriptnya, karena JavaScript dari tag kbd ini di gunakan agar memudahkan pengunjung untuk memblok text kbdnya. Untuk tampilan element kbd tag ini, silahkan lihat di bawah ini. Langsung saja untuk cara memasang...

Baca Lebih Lanjut »

Download Tutor Green Magazine Blogger Template Premium Responsive Fast Loading

Setelah sebelumnya saya membagikan template tutor magazine responsive fast loading , kali ini saya akan membagikan template yang saya beri nama Tutor Green Magazine . Sesuai dengan namanya, template ini dibuat dengan warna hijau sebagai warna utamanya. (Baca juga : Download Template Premium Paling Laris 2017, Hijau Magazine V1.0 Template ) Template Tutor green magazine ini memiliki desain yang responsive, dimana template ini dapat tampil di berbagai device seperti handphone, smartphone, laptop, dan komputer. Sehingga akan membuat blog kalian akan lebih menarik. Dengan konsep bentuk daun dan warna daun yang saya buat, di harapkan para pengunjung blog dapat merasa tenang dan betah berlama-lama saat mengunjungi blog yang memakai template ini. Apalagi dengan fitur SEO otomatis serta kecepatan yang sudah dimiliki template ini dapat memudahkan kalian dalam membangun blog yang bagus, cepat, dan SEO tentunya. (Baca juga : Free Download Tutor Magazine Template Responsive Fast Load...

Baca Lebih Lanjut »

Cara Membuat Prism Syntax Highlighter untuk Menampilkan Script Code di Blogger

Untuk kalian yang gemar membagikan tutorial di blogger pastinya kalian membutuhkan Syntax Highlighter ini, apalagi kalian yang menerapkan blog dengan niche programming. Pada tutorial kali ini saya akan memberikan tutorial tentang cara membuat prism syntax highlighter untuk menampilkan script code di blogger . (Baca juga : Cara Membuat Syntax Highlighter Otomatis Tanpa Javascript di Blogger ) Syntax Highlighter ini sudah tidak saya pakai sekarang, tetapi syntax highlighter ini sangat cocok untuk membagikan tutorial-tutorial yang menggunakan coding. Syntax Highlighter ini saya temukan di blog Arlina Design yang menerapkan niche tutorial blog dan sering membagikan template yang responsive. Kata admin blog Arlina Design, syntax highlighter ini adalah kombinasi antara syntax highlighter yang di buat blog Kang Ismet dan fitur penomoran yang di buat blog Kompi Ajaib . Untuk lebih jelasnya ikuti langkah-langkah dari saya mengenai cara membuat prism syntax highlighter untuk menampilkan ...

Baca Lebih Lanjut »

2 Cara Membuat Sticky Widget Sidebar dengan CSS dan jQuery

Sticky widget adalah widget yang bisa di bilang melayang atau mengambang apabila kita menscroll layar browser. Sticky widget ini biasanya menggunakan jQuery tetapi kali ini saya tidak hanya membuat tutorial cara membuat yang jQuerynya saja tetapi ada juga yang menggunakan CSS , untuk itulah saya akan memberikan 2 cara membuat sticky widget sidebar dengan CSS dan jQuery . Sticky widget ini awalnya hanya support untuk template responsive saja, namun seiring berkembangnya kemajuan blog, kini hadir template AMP yang di sebut-sebut memiliki kecepatan yang tinggi di versi mobile. Untuk itulah sangat di butuhkan sticky widget sidebar dengan CSS, karena template AMP ini sangat anti jika di tempelkan script jQuery. (Baca juga : Cara Membuat Widget Recent Post Muncul Saat di Scroll ) 2 Cara Memasang Sticky Widget Sidebar dengan CSS dan jQuery di Blog Untuk cara yang pertama kita akan memasang sticky widget sidebar dengan jQuery terlebih dahulu. Untuk itu ikuti langkah-langkah dari saya ...

Baca Lebih Lanjut »

Cara Membuat Widget Recent Post Multi Color Keren di Blogger

Recent posts adalah widget untuk menampilkan artikel-artikel terbaru, widget ini adalah solusi terbaik agar pemirsa blog kita dapat melihat postingan terakhir yang kita buat. Pada tutorial kali ini saya akan memberikan cara membuat widget recent post multi color keren di blogger . Di artikel kali ini saya akan membuat recent post yang dapat membuat tampilan blog kalian lebih menarik serta mempermudah bagi viewer blog kalian membaca artikel-artikel terbaru dari blog kalian. (Baca juga : Cara Membuat Widget Recent Post Dengan Gambar, Keterangan Waktu & Komentar ) Recent post ini adalah widget yang paling sering dipakai oleh para blogger, karena widget ini dapat meningkatkan view pada suatu blog. Yang membuat recent post ini berbeda dari recent post yang lain adalah gambar thumbnail yang bulat serta setingan yang mudah. Kenapa dikatakan mudah, karena kalian hanya cukup mengaturnya tanpa menambahkan link blog kalian. Jadi widget recent post ini bisa di gunakan secara otomatis. Ti...

Baca Lebih Lanjut »