Hello Sobat IcloudZer bagaimana dengan kabarmu hari ini, semoga senantiasa sehat oke, hahaha, oke kali ini admin akan memberikan informasi bagaiamana caranya membuat Tombol Share melayang (Sticky) diblogger
Bagi kamu yang sudah penasaran yuk langsung aja ke TKP, maksudnya ke pembahasaan bagaiamana cara membuat tombol share melayang diblogger dengan mudah
Dibawah Postingan
Jika kamu memasang atau menggunakan tombol share yang sedang admin bahas sekarang ini, maka tombol share tersebut akan berada tepat dibawah postingan dan apabila discrool akan membuat tombol share tersebut menjadi melayang secara responsif dan keren
Info Gambar di atas adalah contoh tampilan dari Tombol sharenya
Mode Melayang
Tombol share atau fitur bagikan diblogger kali ini, jika kamu pasangkan diblog Kamu akan ditampilkan dalam posisi melayang atau disebut Sticky jika, pengguna menscroll layar kebawah, atau ketika pengguna menscroll layar hingga melebihi posisi tombol share tersebut
Cara pembuatannnya
Baiklah langsung aja kita membahas bagaimana cara membuat tombol share melayang diblogger dengan mudah, perhatikan setiap langkah yang admin berikan sebentar lagi ini, oke
Kode CSS
Yang Pertama yang bisa kamu lakukan adalah menyalin kode dibawah ini, kemudian kamu bisa letakkin tepat diatas kode ]]></bskin> atau menggunakan tag <style>
/* Icloudice Share btn ~ Responsif (Don't Remove Ok */
.rah-sharingBtn{position:relative;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-wrap:nowrap;align-items:center;background-color:#fff;color:#fff;padding:10px 0;border-top:7px dotted #f8000p;z-index:1;transition:all .3s ease}
.rah-sharingBtn.show{position:sticky;position:-webkit-sticky;bottom:0}
.rah-sharingBtn svg{width:17px;height:17px;margin:auto;text-align:center}
.ignielshare .facebook svg,.rah-sharingBtn .pinterest svg,.rah-sharingBtn .tumblr svg{margin:0}
.rah-sharingBtn svg path{fill:#fff}
.rah-sharingBtn .ct{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-wrap:nowrap;align-items:center;font-weight:500;color:red;font-size:1.5em;margin-right:20px}
.rah-sharingBtn .ct svg path{fill:#f80000}
.rah-sharingBtn i{font-style:normal;margin:0 3px;line-height:0}
.rah-sharingBtn a{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;width:100%;color:red;padding:7px;border-radius:25px;box-shadow:none;transition:all .3s ease}
.rah-sharingBtn a:not(:last-child){margin-right:7px}
.rah-sharingBtn a:hover{box-shadow:inset 0 0 0 99999px rgba(255,255,255,0.25)}
.rah-sharingBtn a.facebook{background-color:#3a579a}
.rah-sharingBtn a.twitter{background-color:#00abf0}
.rah-sharingBtn a.pinterest{background-color:#cd1c1f}
.rah-sharingBtn a.linkedin{background-color:#2554BF}
.rah-sharingBtn a.tumblr{background-color:#314358}
.rah-sharingBtn a.whatsapp{background-color:#4dc247}
.rah-sharingBtn a.messenger{background-color:#448aff}
.rah-sharingBtn i{display:none}
.rah-sharingBtn .facebook svg,.rah-sharingBtn .pinterest svg,.rah-sharingBtn .tumblr svg{margin:auto}
/* Icloudice Share btn ~ Mode 900 */
@media screen and (max-width:900px){
.rah-sharingBtn i{display:block}
.rah-sharingBtn .facebook svg,
.rah-sharingBtn .pinterest svg,
.rah-sharingBtn .tumblr svg{margin:0}
}
/* Icloudice Share btn ~ Mode 680 */
@media screen and (max-width:680px){
.rah-sharingBtn{justify-content:space-between}
.rah-sharingBtn a i{display:none}
.rah-sharingBtn a{justify-content:center}
.rah-sharingBtn a:not(:last-child){margin-right:5px}
.rah-sharingBtn .facebook svg,.rah-sharingBtn .pinterest svg,.rah-sharingBtn .tumblr svg{margin:auto}
}
/* Icloudice Share btn ~ Mode 480 */
@media screen and (max-width:480px){
.rah-sharingBtn a:not(:last-child){margin-right:3px}
.rah-sharingBtn .ct{margin-right:15px}
}
/* Icloudice Share btn ~ Mode Malam */
.Night .rah-sharingBtn{background-color:#292e38}// Jika kamu menggunakan class .Night
.dark-mode .rah-sharingBtn{background-color:#292e38} // Jika kamu menggunakan class .dark-mode
.darkMode .rah-sharingBtn{background-color:#292e38} // Jika kamu menggunakan class .darkMode
Kode HTML
Langkah selanjutnya yang bisa kamu lakukan adalah, meletakkan kode HTML dari tombol share nya
Info Tombol Share yang sudah terpasang diblog kamu sebelumnya, bisa kamu hapus terlebih dahulu sebelum memasang kode html yang akan saya berikan sebentar lagi
Berikut ini adalah kode dari tombol shaharenya
<div class='rah-sharingBtn'>
<span class='ct'>
<svg viewbox='0 0 24 24'>
<path d='M18,16.08C17.24,16.08 16.56,16.38 16.04,16.85L8.91,12.7C8.96,12.47 9,12.24 9,12C9,11.76 8.96,11.53 8.91,11.3L15.96,7.19C16.5,7.69 17.21,8 18,8A3,3 0 0,0 21,5A3,3 0 0,0 18,2A3,3 0 0,0 15,5C15,5.24 15.04,5.47 15.09,5.7L8.04,9.81C7.5,9.31 6.79,9 6,9A3,3 0 0,0 3,12A3,3 0 0,0 6,15C6.79,15 7.5,14.69 8.04,14.19L15.16,18.34C15.11,18.55 15.08,18.77 15.08,19C15.08,20.61 16.39,21.91 18,21.91C19.61,21.91 20.92,20.61 20.92,19A2.92,2.92 0 0,0 18,16.08Z'/>
</svg> <i/> </span>
<a class='facebook' expr:href='"https://www.facebook.com/sharer.php?u=" + data:blog.url' onclick='window.open(this.href,"sharer"," toolbar=0,status=0,width=626,height=436");return false;' rel='nofollow' title='Share to Facebook'>
<svg viewbox='0 0 24 24'>
<path d='M17,2V2H17V6H15C14.31,6 14,6.81 14,7.5V10H14L17,10V14H14V22H10V14H7V10H10V6A4,4 0 0,1 14,2H17Z'/>
</svg><i/></a>
<a class='whatsapp' expr:href='"https://api.whatsapp.com/send?phone=&text=" + data:post.title + "%20%2D%20" + data:post.url' onclick='window.open(encodeURI(this.href)," sharer" ,"toolbar=0,status=0,width=626,height=500"); return false;' rel='nofollow' title='Share to WhatsApp'>
<svg viewbox='0 0 24 24'>
<path d='M16.75,13.96C17,14.09 17.16,14.16 17.21,14.26C17.27,14.37 17.25,14.87 17,15.44C16.8,16 15.76,16.54 15.3,16.56C14.84,16.58 14.83,16.92 12.34,15.83C9.85,14.74 8.35,12.08 8.23,11.91C8.11,11.74 7.27,10.53 7.31,9.3C7.36,8.08 8,7.5 8.26,7.26C8.5,7 8.77,6.97 8.94,7H9.41C9.56,7 9.77,6.94 9.96,7.45L10.65,9.32C10.71,9.45 10.75,9.6 10.66,9.76L10.39,10.17L10,10.59C9.88,10.71 9.74,10.84 9.88,11.09C10,11.35 10.5,12.18 11.2,12.87C12.11,13.75 12.91,14.04 13.15,14.17C13.39,14.31 13.54,14.29 13.69,14.13L14.5,13.19C14.69,12.94 14.85,13 15.08,13.08L16.75,13.96M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C10.03,22 8.2,21.43 6.65,20.45L2,22L3.55,17.35C2.57,15.8 2,13.97 2,12A10,10 0 0,1 12,2M12,4A8,8 0 0,0 4,12C4,13.72 4.54,15.31 5.46,16.61L4.5,19.5L7.39,18.54C8.69,19.46 10.28,20 12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4Z'/>
</svg></a>
<a class='messenger' href='fb-messenger://share?link= data:post.url' rel='nofollow' title='Share to WhatsApp'>
<svg viewbox='0 0 24 24'><path d='M12,2C6.5,2 2,6.14 2,11.25C2,14.13 3.42,16.7 5.65,18.4L5.71,22L9.16,20.12L9.13,20.11C10.04,20.36 11,20.5 12,20.5C17.5,20.5 22,16.36 22,11.25C22,6.14 17.5,2 12,2M13.03,14.41L10.54,11.78L5.5,14.41L10.88,8.78L13.46,11.25L18.31,8.78L13.03,14.41Z'/>
</svg></a>
<a class='twitter' expr:href='"https://twitter.com/intent/tweet?text=" + data:post.title + "&url=" + data:post.url' onclick='window.open(this.href," sharer" ," toolbar=0,status=0,width=626,height=436" ); return false;' rel='nofollow' title='Share to Twitter'>
<svg viewbox='0 0 24 24'>
<path d='M22.46,6C21.69,6.35 20.86,6.58 20,6.69C20.88,6.16 21.56,5.32 21.88,4.31C21.05,4.81 20.13,5.16 19.16,5.36C18.37,4.5 17.26,4 16,4C13.65,4 11.73,5.92 11.73,8.29C11.73,8.63 11.77,8.96 11.84,9.27C8.28,9.09 5.11,7.38 3,4.79C2.63,5.42 2.42,6.16 2.42,6.94C2.42,8.43 3.17,9.75 4.33,10.5C3.62,10.5 2.96,10.3 2.38,10C2.38,10 2.38,10 2.38,10.03C2.38,12.11 3.86,13.85 5.82,14.24C5.46,14.34 5.08,14.39 4.69,14.39C4.42,14.39 4.15,14.36 3.89,14.31C4.43,16 6,17.26 7.89,17.29C6.43,18.45 4.58,19.13 2.56,19.13C2.22,19.13 1.88,19.11 1.54,19.07C3.44,20.29 5.7,21 8.12,21C16,21 20.33,14.46 20.33,8.79C20.33,8.6 20.33,8.42 20.32,8.23C21.16,7.63 21.88,6.87 22.46,6Z'/>
</svg></a>
<a class='pinterest' data-pin-config='beside' expr:href='"https://pinterest.com/pin/create/button/?url=" + data:post.canonicalUrl + "&media=" + data:post.firstImageUrl + "&description=" + data:post.title' onclick='window.open(this.href," sharer" ," toolbar=0,status=0,width=626,height=500" ); return false;' rel='nofollow' title='Share to Pinterest'><svg viewbox='0 0 24 24'><path d='M9.04,21.54C10,21.83 10.97,22 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2A10,10 0 0,0 2,12C2,16.25 4.67,19.9 8.44,21.34C8.35,20.56 8.26,19.27 8.44,18.38L9.59,13.44C9.59,13.44 9.3,12.86 9.3,11.94C9.3,10.56 10.16,9.53 11.14,9.53C12,9.53 12.4,10.16 12.4,10.97C12.4,11.83 11.83,13.06 11.54,14.24C11.37,15.22 12.06,16.08 13.06,16.08C14.84,16.08 16.22,14.18 16.22,11.5C16.22,9.1 14.5,7.46 12.03,7.46C9.21,7.46 7.55,9.56 7.55,11.77C7.55,12.63 7.83,13.5 8.29,14.07C8.38,14.13 8.38,14.21 8.35,14.36L8.06,15.45C8.06,15.62 7.95,15.68 7.78,15.56C6.5,15 5.76,13.18 5.76,11.71C5.76,8.55 8,5.68 12.32,5.68C15.76,5.68 18.44,8.15 18.44,11.43C18.44,14.87 16.31,17.63 13.26,17.63C12.29,17.63 11.34,17.11 11,16.5L10.33,18.87C10.1,19.73 9.47,20.88 9.04,21.57V21.54Z'/>
</svg><i/></a>
<a class='linkedin' expr:href='"https://www.linkedin.com/shareArticle?mini=true&url=" + data:post.canonicalUrl' onclick='window.open(this.href," sharer" ,"toolbar=0,status=0,width=626,height=500"); return false;' rel='nofollow' title='Share to Linkedin'>
<svg viewbox='0 0 24 24'>
<path d='M21,21H17V14.25C17,13.19 15.81,12.31 14.75,12.31C13.69,12.31 13,13.19 13,14.25V21H9V9H13V11C13.66,9.93 15.36,9.24 16.5,9.24C19,9.24 21,11.28 21,13.75V21M7,21H3V9H7V21M5,3A2,2 0 0,1 7,5A2,2 0 0,1 5,7A2,2 0 0,1 3,5A2,2 0 0,1 5,3Z'/>
</svg></a>
<a class='tumblr' data-notes='right' expr:href='"https://tumblr.com/share/link?url=" + data:post.canonicalUrl + "&name=" + data:post.title + "&description=" + data:post.snippet' onclick='window.open(this.href," sharer" ,"toolbar=0,status=0,width=626,height=500"); return false;' rel='nofollow' title='Share to Tumblr'><svg viewbox='0 0 24 24'>
<path d='M17,11H13V15.5C13,16.44 13.28,17 14.5,17H17V21C17,21 15.54,21.05 14.17,21.05C10.8,21.05 9.5,19 9.5,16.75V11H7V7C10.07,6.74 10.27,4.5 10.5,3H13V7H17'/>
</svg><i><i/></i></a>
</div>
Info: Untuk tata peletakkan nya kamu bisa mempelajarinya dengan membaca artikel ini hingga selesai oke
Peletakkan kode
Jika kamu bingung untuk meletakkan kode HTML kamu bisa mencari kode seperti dibawah ini
<b:includable id='postsharebutton' var='post'>
<div id='share-container'><!-- Templekan kode HTML disini-->
</div>
</b:includable>
Info: Kemudian simpan atau letakkan kode HTML tepat seperti contoh kode di atas, oke
Langkah Langkah
Berikut ini kami akan merangkum setiap langkah langkah yang bisa kamu lakukan untuk membuat tombol share melayang diblogger
- Login ke blogger
- Pergi ketemplate kemudian pilih edit html
- Salin kode CSS dibawah ini, kemudian tempelkan diatas kode ]]></bskin>
- Selanjutnya Cari kode seperti dibawah ini
- Salin dan letakkan kode HTML berikut ini tepat diatas kode tersebut
/* Icloudice Share btn ~ Responsif (Don't Remove Ok */
.rah-sharingBtn{position:relative;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-wrap:nowrap;align-items:center;background-color:#fff;color:#fff;padding:10px 0;border-top:7px dotted #f8000p;z-index:1;transition:all .3s ease}
.rah-sharingBtn.show{position:sticky;position:-webkit-sticky;bottom:0}
.rah-sharingBtn svg{width:17px;height:17px;margin:auto;text-align:center}
.ignielshare .facebook svg,.rah-sharingBtn .pinterest svg,.rah-sharingBtn .tumblr svg{margin:0}
.rah-sharingBtn svg path{fill:#fff}
.rah-sharingBtn .ct{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-wrap:nowrap;align-items:center;font-weight:500;color:red;font-size:1.5em;margin-right:20px}
.rah-sharingBtn .ct svg path{fill:#f80000}
.rah-sharingBtn i{font-style:normal;margin:0 3px;line-height:0}
.rah-sharingBtn a{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;width:100%;color:red;padding:7px;border-radius:25px;box-shadow:none;transition:all .3s ease}
.rah-sharingBtn a:not(:last-child){margin-right:7px}
.rah-sharingBtn a:hover{box-shadow:inset 0 0 0 99999px rgba(255,255,255,0.25)}
.rah-sharingBtn a.facebook{background-color:#3a579a}
.rah-sharingBtn a.twitter{background-color:#00abf0}
.rah-sharingBtn a.pinterest{background-color:#cd1c1f}
.rah-sharingBtn a.linkedin{background-color:#2554BF}
.rah-sharingBtn a.tumblr{background-color:#314358}
.rah-sharingBtn a.whatsapp{background-color:#4dc247}
.rah-sharingBtn a.messenger{background-color:#448aff}
.rah-sharingBtn i{display:none}
.rah-sharingBtn .facebook svg,.rah-sharingBtn .pinterest svg,.rah-sharingBtn .tumblr svg{margin:auto}
/* Icloudice Share btn ~ Mode 900 */
@media screen and (max-width:900px){
.rah-sharingBtn i{display:block}
.rah-sharingBtn .facebook svg,
.rah-sharingBtn .pinterest svg,
.rah-sharingBtn .tumblr svg{margin:0}
}
/* Icloudice Share btn ~ Mode 680 */
@media screen and (max-width:680px){
.rah-sharingBtn{justify-content:space-between}
.rah-sharingBtn a i{display:none}
.rah-sharingBtn a{justify-content:center}
.rah-sharingBtn a:not(:last-child){margin-right:5px}
.rah-sharingBtn .facebook svg,.rah-sharingBtn .pinterest svg,.rah-sharingBtn .tumblr svg{margin:auto}
}
/* Icloudice Share btn ~ Mode 480 */
@media screen and (max-width:480px){
.rah-sharingBtn a:not(:last-child){margin-right:3px}
.rah-sharingBtn .ct{margin-right:15px}
}
/* Icloudice Share btn ~ Mode Malam */
.Night .rah-sharingBtn{background-color:#292e38}
.dark-mode .rah-sharingBtn{background-color:#292e38} // Jika kamu menggunakan class .dark-mode
.darkMode .rah-sharingBtn{background-color:#292e38} // Jika kamu menggunakan class .darkMode
<b:includable id='postsharebutton' var='post'>
<div id='share-container'><!-- Templekan kode HTML disini-->
</div>
</b:includable>
<div class='rah-sharingBtn'>
<span class='ct'>
<svg viewbox='0 0 24 24'>
<path d='M18,16.08C17.24,16.08 16.56,16.38 16.04,16.85L8.91,12.7C8.96,12.47 9,12.24 9,12C9,11.76 8.96,11.53 8.91,11.3L15.96,7.19C16.5,7.69 17.21,8 18,8A3,3 0 0,0 21,5A3,3 0 0,0 18,2A3,3 0 0,0 15,5C15,5.24 15.04,5.47 15.09,5.7L8.04,9.81C7.5,9.31 6.79,9 6,9A3,3 0 0,0 3,12A3,3 0 0,0 6,15C6.79,15 7.5,14.69 8.04,14.19L15.16,18.34C15.11,18.55 15.08,18.77 15.08,19C15.08,20.61 16.39,21.91 18,21.91C19.61,21.91 20.92,20.61 20.92,19A2.92,2.92 0 0,0 18,16.08Z'/>
</svg> <i/> </span>
<a class='facebook' expr:href='"https://www.facebook.com/sharer.php?u=" + data:blog.url' onclick='window.open(this.href,"sharer"," toolbar=0,status=0,width=626,height=436");return false;' rel='nofollow' title='Share to Facebook'>
<svg viewbox='0 0 24 24'>
<path d='M17,2V2H17V6H15C14.31,6 14,6.81 14,7.5V10H14L17,10V14H14V22H10V14H7V10H10V6A4,4 0 0,1 14,2H17Z'/>
</svg><i/></a>
<a class='whatsapp' expr:href='"https://api.whatsapp.com/send?phone=&text=" + data:post.title + "%20%2D%20" + data:post.url' onclick='window.open(encodeURI(this.href)," sharer" ,"toolbar=0,status=0,width=626,height=500"); return false;' rel='nofollow' title='Share to WhatsApp'>
<svg viewbox='0 0 24 24'>
<path d='M16.75,13.96C17,14.09 17.16,14.16 17.21,14.26C17.27,14.37 17.25,14.87 17,15.44C16.8,16 15.76,16.54 15.3,16.56C14.84,16.58 14.83,16.92 12.34,15.83C9.85,14.74 8.35,12.08 8.23,11.91C8.11,11.74 7.27,10.53 7.31,9.3C7.36,8.08 8,7.5 8.26,7.26C8.5,7 8.77,6.97 8.94,7H9.41C9.56,7 9.77,6.94 9.96,7.45L10.65,9.32C10.71,9.45 10.75,9.6 10.66,9.76L10.39,10.17L10,10.59C9.88,10.71 9.74,10.84 9.88,11.09C10,11.35 10.5,12.18 11.2,12.87C12.11,13.75 12.91,14.04 13.15,14.17C13.39,14.31 13.54,14.29 13.69,14.13L14.5,13.19C14.69,12.94 14.85,13 15.08,13.08L16.75,13.96M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C10.03,22 8.2,21.43 6.65,20.45L2,22L3.55,17.35C2.57,15.8 2,13.97 2,12A10,10 0 0,1 12,2M12,4A8,8 0 0,0 4,12C4,13.72 4.54,15.31 5.46,16.61L4.5,19.5L7.39,18.54C8.69,19.46 10.28,20 12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4Z'/>
</svg></a>
<a class='messenger' href='fb-messenger://share?link= data:post.url' rel='nofollow' title='Share to WhatsApp'>
<svg viewbox='0 0 24 24'><path d='M12,2C6.5,2 2,6.14 2,11.25C2,14.13 3.42,16.7 5.65,18.4L5.71,22L9.16,20.12L9.13,20.11C10.04,20.36 11,20.5 12,20.5C17.5,20.5 22,16.36 22,11.25C22,6.14 17.5,2 12,2M13.03,14.41L10.54,11.78L5.5,14.41L10.88,8.78L13.46,11.25L18.31,8.78L13.03,14.41Z'/>
</svg></a>
<a class='twitter' expr:href='"https://twitter.com/intent/tweet?text=" + data:post.title + "&url=" + data:post.url' onclick='window.open(this.href," sharer" ," toolbar=0,status=0,width=626,height=436" ); return false;' rel='nofollow' title='Share to Twitter'>
<svg viewbox='0 0 24 24'>
<path d='M22.46,6C21.69,6.35 20.86,6.58 20,6.69C20.88,6.16 21.56,5.32 21.88,4.31C21.05,4.81 20.13,5.16 19.16,5.36C18.37,4.5 17.26,4 16,4C13.65,4 11.73,5.92 11.73,8.29C11.73,8.63 11.77,8.96 11.84,9.27C8.28,9.09 5.11,7.38 3,4.79C2.63,5.42 2.42,6.16 2.42,6.94C2.42,8.43 3.17,9.75 4.33,10.5C3.62,10.5 2.96,10.3 2.38,10C2.38,10 2.38,10 2.38,10.03C2.38,12.11 3.86,13.85 5.82,14.24C5.46,14.34 5.08,14.39 4.69,14.39C4.42,14.39 4.15,14.36 3.89,14.31C4.43,16 6,17.26 7.89,17.29C6.43,18.45 4.58,19.13 2.56,19.13C2.22,19.13 1.88,19.11 1.54,19.07C3.44,20.29 5.7,21 8.12,21C16,21 20.33,14.46 20.33,8.79C20.33,8.6 20.33,8.42 20.32,8.23C21.16,7.63 21.88,6.87 22.46,6Z'/>
</svg></a>
<a class='pinterest' data-pin-config='beside' expr:href='"https://pinterest.com/pin/create/button/?url=" + data:post.canonicalUrl + "&media=" + data:post.firstImageUrl + "&description=" + data:post.title' onclick='window.open(this.href," sharer" ," toolbar=0,status=0,width=626,height=500" ); return false;' rel='nofollow' title='Share to Pinterest'><svg viewbox='0 0 24 24'><path d='M9.04,21.54C10,21.83 10.97,22 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2A10,10 0 0,0 2,12C2,16.25 4.67,19.9 8.44,21.34C8.35,20.56 8.26,19.27 8.44,18.38L9.59,13.44C9.59,13.44 9.3,12.86 9.3,11.94C9.3,10.56 10.16,9.53 11.14,9.53C12,9.53 12.4,10.16 12.4,10.97C12.4,11.83 11.83,13.06 11.54,14.24C11.37,15.22 12.06,16.08 13.06,16.08C14.84,16.08 16.22,14.18 16.22,11.5C16.22,9.1 14.5,7.46 12.03,7.46C9.21,7.46 7.55,9.56 7.55,11.77C7.55,12.63 7.83,13.5 8.29,14.07C8.38,14.13 8.38,14.21 8.35,14.36L8.06,15.45C8.06,15.62 7.95,15.68 7.78,15.56C6.5,15 5.76,13.18 5.76,11.71C5.76,8.55 8,5.68 12.32,5.68C15.76,5.68 18.44,8.15 18.44,11.43C18.44,14.87 16.31,17.63 13.26,17.63C12.29,17.63 11.34,17.11 11,16.5L10.33,18.87C10.1,19.73 9.47,20.88 9.04,21.57V21.54Z'/>
</svg><i/></a>
<a class='linkedin' expr:href='"https://www.linkedin.com/shareArticle?mini=true&url=" + data:post.canonicalUrl' onclick='window.open(this.href," sharer" ,"toolbar=0,status=0,width=626,height=500"); return false;' rel='nofollow' title='Share to Linkedin'>
<svg viewbox='0 0 24 24'>
<path d='M21,21H17V14.25C17,13.19 15.81,12.31 14.75,12.31C13.69,12.31 13,13.19 13,14.25V21H9V9H13V11C13.66,9.93 15.36,9.24 16.5,9.24C19,9.24 21,11.28 21,13.75V21M7,21H3V9H7V21M5,3A2,2 0 0,1 7,5A2,2 0 0,1 5,7A2,2 0 0,1 3,5A2,2 0 0,1 5,3Z'/>
</svg></a>
<a class='tumblr' data-notes='right' expr:href='"https://tumblr.com/share/link?url=" + data:post.canonicalUrl + "&name=" + data:post.title + "&description=" + data:post.snippet' onclick='window.open(this.href," sharer" ,"toolbar=0,status=0,width=626,height=500"); return false;' rel='nofollow' title='Share to Tumblr'><svg viewbox='0 0 24 24'>
<path d='M17,11H13V15.5C13,16.44 13.28,17 14.5,17H17V21C17,21 15.54,21.05 14.17,21.05C10.8,21.05 9.5,19 9.5,16.75V11H7V7C10.07,6.74 10.27,4.5 10.5,3H13V7H17'/>
</svg><i><i/></i></a>
</div>