Widget Sharing is Caring |
Pada kesempatan ini saya akan berikan tips blog cara membuat widget sharing is Caring di bawah postingan blog.
Apa fungsi widget sharing is caring?
Funginya sama seperti share button lainya, yaitu untuk memudahkan pengunjun untuk sharing atau berbagi artikel blog ke sosial media. Namun tampilan widget ini lebih cantik.
Bagaimana cara memasang widget sharing is caring?
Silahkan ikuti tips blogger berikut ini:1. Login Dasbor Blog.
2. Template > EDIT HTML > Centang Expand Widget Template.
3. Cari kode <data:post.body/>
Biar lebih mudah mencari pake CTR+F
4. Letakan kode berikut tepat dibawah <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<a href='http://blazerracing.blogspot.com/'><img alt='Blazer Blog' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg97LyDxORHIctTJe2pql1dk8lSMsjFDSJ0BfVS5nWKkyXSgHWfsamP5SzsfEPuFEZc3SwC4FW-no2tTL9T41D6VyImmZJkINRV-qiMTgvSL44841g3yK_iSavmf0Np0t_A5GzLZcq6cooq/s1600/best+blogger+tips.png'/></a><style>
img{border:0;}
#wrapper{width:488px; height:110px; background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhps-BRzSo29V4TehdihGaWg2h_2spvucNNk6TH5IfcSp_YVm34x2cZ8ERUFJvKifnwH32M1mJjlhCxe96JJa2w7blh7ikwrILMo_Zena-M7X5h6qpl2MubILcUGZpLVJb46hIN2qDTzHs/s1600/sharing+is+caring+hearts.jpg); position:relative; background-repeat:no-repeat; background-color:transparent;}
#wrapper ul{position:absolute; width:600px; top:42px; left:3px; list-style-type:none;}
#wrapper li{float:left;}
</style>
<div id='wrapper'>
<ul>
<li>
<!-- Facebook -->
<a expr:href='"http://www.facebook.com/share.php?u=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><img alt='Share On Facebook' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYu81174hIIgbc6xmziNBP_QSESDKoQAxztJ8bOcNZgYcoNxxoyRDcIs7ynQcqB2faNwU6NwCwhtVJFO1_hcCRB7JbaVta9EqG0CQzPbfvPbGkXVx7iaj-qO_p_6E3YtOACEKI_A33xzo/s1600/facebook.png' width='48'/></a>
</li>
<li>
<!-- Digg -->
<a expr:href='"http://digg.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><img alt='Digg This Post' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVNKlwCn-KWTSnv_qBEaavUx5bPlM0lXZwK0Icrmf0L3v7YvO0M1P5c6A2obQEVI13jfn3cF_ROT1NOh9x0ew6uEWEtQVRchEsMnT93pYGmm7NlBJDI07TNWPgB72Hb7E-ZHHr0A0vaHM/s1600/digg.png' width='48'/></a>
</li>
<li>
<!-- Stumbleupon -->
<a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><img alt='Stumble This Post' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSKpq2X1EhtsbW9N1cPwdA0HC0AfmdoleijHH6Npx71jLxOGFK7rGW3_X-I_QCQ90LryzOYvhAFUO3H02WVDm8NbASZS4Z-nYxyMk_o5yS2rF90yNbhfExaoRtuMWC9zSLKNI24BBz9tY/s1600/stumble.png' width='48'/></a>
</li>
<li>
<!-- Twitthis -->
<a expr:href='"http://twitthis.com/twit?url=" + data:post.url' rel='nofollow' target='_blank'><img alt='Tweet This Post' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdvRVNgUuqj8JB5I8615z4yGW9Cz39xeJItTBHyW9UIO6fAiE30RtfJqXHuE25zwcO0MlpW_FeHHHMfGNH2LVTiJGdSFXhfKlvSFO7FRHyugoEkOb7HTz3MHCwnMerJdcf6bOfgfSUCLA/s1600/twitter.png' width='48'/></a>
</li>
<li>
<!-- Delicious -->
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><img alt='Save Tis Post To Delicious' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBue_GyPP2_SF1g-e0LDh-QowLV9veTO51ChH9yzAu2QW_lpN_3Nlpas6zJvA1EvkVS8M8UOqfBzADx91Se6g0WkPHWVw8LL_WG3id60dBtwR2eaBmd26nOxPhRsK8HWlWWZveg1mXg-M/s1600/delicious.png' width='48'/></a>
</li><li>
<!-- Design Float -->
<a expr:href='"http://www.designfloat.com/submit.php?url="+ data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><img alt='Float This Post' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMF2-m6yhwmqsT_tEL2Q_Gsa2YPdt9wfMbN3lTwxA7ACEyhyQCtmWsdSP6iaFAh_7OLBWcxtXu3llVuI9i-47aPboOzeE-MmD4Ga9k7bx8PIeEPDRNgtKHjwsCS8ClmdPicLbJdykXbt8/s1600/designfloat.png' width='48'/></a>
</li><li>
<!-- Reddit -->
<a expr:href='"http://www.reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><img alt='Share On Reddit' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6iEOuyqILi5id7h_7t2u2LMEW2R6pKcxHvkL-_7TMpFQ_z5HfOZ7wf-u9ltWPBXmKCRDfqycWC0Ygyrtn90SGPmt0T4Xq9aU9y_rOARm27rKf2QUIf843QZ2y01DMZuuVH6U-QVHtxMU/s1600/reddit.png' width='48'/></a>
</li><li>
<!-- Technorati -->
<a expr:href='"http://technorati.com/faves?add=" + data:post.url' rel='nofollow' target='_blank'><img alt='Bookmark On Technorati' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNWx0Ld3g5H37-We_U5KHcRCXwxSVwv8yDEOkQecxMi0kpdUxf1UITsWU-WjznKwV4KYg4zB5VNM1pl47tJ5POZbAlVs1TcVs7DI-AT58jDH1SZrYXlfWpKJ-e1gsFrtyS7e9dsBVLWhc/s1600/technorati.png' width='48'/></a>
</li></ul></div>
</b:if>
5. Klik Preview.
Untuk melihat apa masih ada galat atau kesalahan. Bila ada kesalahan silahkan diulangi lagi dan pastikan kode diletakan sesuai petunjuk. Jika tidak ada kesalahan lanjutkan ke langkah berikutnya.
6. Save Template.
Sekarang widget sharing is caring di blog kamu sudah siap.
Terimakasih gan..
ReplyDeleteBermanfaat