Cara Terbaik Memasang Sosial Media Sharing Di Blog

Di era algoritma hummingbird yang sangat ketat ini persaingan antar blog dan website semakin heboh, semuanya ingin menjadi nomor wahid di mesin search. banyak bermunculan blog baru yang muncul di halaman page one atau malah jadi #1 di mesin pencari seperti +Google. realitanya memang blog ber PR tinggi belum tentu masuk di page one dengan keyword yang dicari. sedangkan blog yang masih berumur jagung bisa jadi no #1.

Dengan berbagai pertimbangan yang matang, si burung akan mematok sebuah blog atau website yang dianggapnya paling tepat untuk diposisikan di no 1, 2, 3 dan seterusnya. tentunya bukan asal main patok sembarangan. ada banyak alasan kenapa si burung tersebut memilah dan memilih antara blog atau website satu dengan yang lainnya, salah satunya adalah kekuatan blog tersebut di sosial media. seberapa kuat page authority link tersebut dan seberapa banyak link tersebut di sharingkan ataupun di like disana. jika sobat pernah mengecek blog sobat di berbagai checker dan analyzer yang bonafide seperti moz dan ahrefs pasti disana akan ada jumlah berapa banyak share dan like facebook, twitter serta media sosial lainnya.

sumber: https://ahrefs.com/site-explorer/overview/subdomains/seotoolsoft.blogspot.com

Karena berbagai alasan diatas saya terpancing untuk membuat dan memasang kode html pembagi postingan di setiap bawah postingan di blog saya dan hal ini akan berguna untuk membagikan artikel atau postingan saya di berbagai media sosial. satu hal yang tidak pernah saya lupakan setiap selesai saya menulis postingan adalah postingan itu langsung akan saya sharingkan di berbagai media sosial tersebut

Lho.. kok pakai kode html? bukannya pakai script lebih rapi?

Benar, script memang lebih ringkas dan rapi ketika ditulis, akan tetapi kode html lebih cepat dan ringan loadingnya, hal ini dikarenakan script di hosting oleh sumber lain. script sendiri aslinya adalah untuk memendekkan kode kode panjang dengan ukuran yang sangat besar. satu hal yang menurut saya masuk akal, karena si burung ini badannya kecil maka dia tidak terlalu suka membawa beban yang berat-berat

Saya sudah pernah sering mencoba berbagai script widget sosial sharing seperti addthis, sharethis, po.st dan lainnya, akan tetapi terasa sekali perbedaannya ketika saya memakai kode html murni dengan memakai script yang dihosting dari sumber lain. bisa dikatakan skor 90 untuk html dan 30 untuk javascript dari jumlah keseluruhan skor 100. hal ini akan berdampak besar pada bounce rate blog sobat, silahkan baca postingan saya tentang bounce rate di Cara Ampuh Menurunkan Bounce Rate Dengan Cepat,

Terus media sosial apa saja yang bagus untuk sharing blog?

Semua media sosial bagus, ada ribuan media sosial di internet. karena halaman blog kita terbatas maka pilihlah yang terbaik, bagi saya, 7 besar media sosial yang paling tinggi di ranking alexa sudah cukup untuk menarik perhatian si burung. silahkan buka alexa top rank dan pilih yang terbaik.

Apakah ada batasnya untuk sharing di media sosial?

Sebagian media sosial membatasi jumlah sharing dengan external link, jika sobat mensharingkan satu link secara bertubi tubi alias spamming share, biasanya blog sobat akan di banned disana. jangan over share !!

Dan yang terakhir, inilah beberapa kode html yang saya pakai di blog SEO Tools ini

<b:if cond='data:blog.pageType == "item"'> <div class='sharing'> <ul class='social' id='cssanimation'> <li class='facebook'> <a expr:href='"http://www.facebook.com/share.php?v=4&src=bm&u=" + data:post.url + "&t=" + data:post.title ' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow'><strong>Facebook</strong></a> </li> <li class='twitter'> <a expr:href='"http://twitter.com/home?status=" + data:post.title + " -- " + data:post.url ' rel='nofollow' target='_blank'><strong>Twitter</strong></a> </li> <li class='googleplus'> <a expr:href='"https://plusone.google.com/_/+1/confirm?hl=en&url=" + data:post.url' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow' target='_blank'><strong>Google+</strong></a> </li> <li class='pinterest'> <a href='javascript:void((function()%7Bvar%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)%7D)());' rel='nofollow' target='_blank'><strong>Pinterest</strong></a> </li> <li class='stumbleupon'> <a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' target='_blank'><strong>StumbleUpon</strong></a> </li> <li class='delicious'> <a expr:href='"http://delicious.com/post?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' target='_blank'><strong>Delicious</strong></a> </li> <li class='linkedin'> <a expr:href='"http://www.linkedin.com/shareArticle?mini=true&url=" + data:post.url + "&title=" + data:post.title + "&summary=&source="' rel='nofollow' target='_blank'><strong>LinkedIn</strong></a> </li> <li class='reddit'> <a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow'><strong>Reddit</strong></a> </li> </ul></div> <style> ul.social { list-style:none; display:inline-block; margin:15px auto; } ul.social li { display:inline; float:left; background-repeat:no-repeat; } ul.social li a { display:block; width:50px; height:50px; margin-left: -20px; position:relative; text-decoration:none; } ul.social li a strong { font-weight:400; position:absolute; left:50px; top:-1px; color:#fff; z-index:9999; text-shadow:1px 1px 0 rgba(0,0,0,0.75); background-color:rgba(0,0,0,0.7); -moz-border-radius:3px; -moz-box-shadow:0 0 5px rgba(0,0,0,0.5); -webkit-border-radius:3px; -webkit-box-shadow:0 0 5px rgba(0,0,0,0.5); border-radius:3px; box-shadow:0 0 5px rgba(0,0,0,0.5); padding:3px; } ul.social li.facebook { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRFbavCda4K1jK5LOUDeNUeS60iQzCV02ivbm22jomK4nKJ925Ltllzf5pqb69eMYzxjtXMgHKjHKVSm8Dy2YrDI9c5bAMEcidCoFVa9BMZqmoUSrGVPO0kokfVuLPlU1mglnxnht3K54/20/facebook.png); } ul.social li.twitter { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBgY0EYX6eieSs6k6_pYFLJbYeEU1aXYHxfLCn-OESieE4sAoDKDxGRB48qoda_rT3rcczGXudMYhjRH2FfEhHSYe3otpFq8bt9Um0pWN0v6mPDIYOn3wKF9nEn-Ps3KpsdONEiIjnwqo/20/twitter.png); } ul.social li.googleplus { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8TEGSk3GBlKTGy8iIjY74eQlNId84IlArDviYPawOB7ALgHWinU4LFnpDNGanY7p189Ob-K7KofIfy9Ga-n4_4VkwMrYdkhupry-Ak8HzWZn9tXgGo-Z6GXMwjCvxNB2ByFTIgh71BoI/s20/google%252B.png); } ul li.pinterest { background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1W8HGs5YxKkmzllrsXoV-GipJez7_iYjCTgnWRao-aDSpXkCPTa2tZU9jKumdNVGokZfWVjeI3MzJW2_5r9m9Djf2KzeGbbd9CxEkFzLIyaASoCH6eSIb3mMgrzX0Jg73wJf451uiipM/20/pinterest.png); } ul.social li.stumbleupon { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipRpT6Eiq4z8Q9_JO0fHE_hAU8VpooUSYxV7VzADLNPSmmy1NP8E6tnfx_m0yh3Yu6thyphenhyphenm6OhYu4fo3Cn8BJy_ZrPSR-OXj7bJx6ycHez3dL31Uo_HMyt-E-pMAtVdWgnRk0p20Rq5ELg/20/stumbleupon.png); } ul.social li.delicious { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNyYlkK7-wr-_ET8EuDtLzFZ2EKjLozGsGNnERWIn5gYIefIg1MWG5TNW9rUCEsdawgGuxrfiDMXEq4qaTh5Xv-cZ4cE2ywp_Fs02VaTf9RZmtoal2_TBrpoa8GQs_K0a3GR5kQJNSqLU/20/delicious.png); } ul.social li.linkedin { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJAolt-wOvxSMNgyEcVIJwqnMPq9-RrvN1U_4416nnR6gds8z83mEuKhVcLAhgJLxn6VO8A5vvwNVSeWIMRRrjBEmYrFIYfmrAGIGQ6AhCcb0YrusMFQe_ylrf09Ho71aBGzZWWmggeCY/20/linkedin.png); } ul.social li.reddit { background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgY8ZXvi73TnXFyDXlliFG6pg87bDrNQCRL6-h8uoU-_T2diuyQaD61kflhSsE0ZOi7PSAJoQVPG-ni3U-Gg3RVMS0YpbSez9BuEGvUn_2BwjHb8sUXLFJw-SlDKc82IOhoBjCA5V_bmBk/20/reddit.png); } #cssanimation:hover li { opacity:0.2; } #cssanimation li { -webkit-transition-property:opacity; -webkit-transition-duration:500ms; -moz-transition-property:opacity; -moz-transition-duration:500ms; } #cssanimation li a strong { opacity:0; -webkit-transition-property:opacity, top; -webkit-transition-duration:300ms; -moz-transition-property:opacity, top; -moz-transition-duration:300ms; } #cssanimation li:hover { opacity:1; } #cssanimation li:hover a strong { opacity:1; top:-10px; } .headinglordhtml{ font-size:18px; font-variant: small-caps; } transition: background .777s; -webkit-transition: background .777s; -moz-transition:background .777s; -o-transition: background .777s; -ms-transition: background .777s; background:#D9D6FF; } .sharing:hover { background:white; }  </style> </b:if>

Ganti yang saya tandai merah, 20 dengan ukuran yang sesuai menurut sobat. kemudian pasang kode html tadi di antara <div class='post-footer-line post-footer-line-1'> kode </div> atau diantara

Software SEO | SEO Tools