Cara Mengubah Blogger Share Buttons ke Cute Custom Images

Blogger sudah mempunyai pilihan untuk share button, tetapi buttons itu hanyalah biasa bagi saya. Saya akan buat tutorial untuk cantikkan dan serikan lagi gambarnya dengan beberapa butang comel kelabu yang sesuai di mana-mana blog.

Butang termasuk adalah untuk Facebook, Twitter, E-mel, dan Pinterest. Jika anda terus membaca terdapat juga kod untuk menambah pada butang Google + dan Tumblr juga.

Pertama sekali, anda akan perlu memadam Blogger share buttons yang anda letak di laman anda. Untuk melakukan ini, log masuk ke Dashboard Blogger anda, dan pergi ke tab Layout ini. Apabila di sana, anda akan melihat rangka blog anda. Mencari tempat di mana posting blog anda pergi, dan di bahagian bawah, anda akan melihat pautan mengatakan Edit. Klik pautan tersebut:

Setelah anda masuk, anda akan melihat tetingkap yang membolehkan anda edit blog. Salah satu pilihan adalah untuk Tunjukkan Butang Share. Pastikan butang ini TIDAK diklik.

Tekan save, Sekarang Blogger share buttons dikeluarkan, anda boleh menambah yang comel! Sekarang anda akan mahu pergi ke Template section blog anda.

Apabila anda berada dalam HTML blog anda, klik dalam kod HTML anda dan tekan Ctrl F (PC) atau command F (mac, arahan ini butang dengan epal di atasnya). Ia akan membawa anda ke kotak carian di sudut kanan bahagian atas kod anda (jika petak carian muncul di sudut sebelah kanan browser anda, ia tidak akan berfungsi, anda perlu klik dalam kod HTML anda terlebih dahulu, dan kemudian klik ctrl F .

Ok, sekarang cari kode berikut <div class='post-footer'> Anda mungkin mendapati bahawa lebih daripada satu- jika demikian, anda mahu yang kedua klik enter sekali lagi . Letakkan kode dibawah ini dibawah kode yang anda cari tadi.

<!-- TambahThis Button BEGIN --><div style='text-align: left;'><div class='addthis_toolbox'><div class='custom_images'><a class='addthis_button_share'><img alt='Share this Post' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjguvt7u5iCvRnchxjMV1Wpt5gmYRkqgF1QWh6BCMAckLdFV90UmD5asEglsfMcHeP2ttx_ebFg-MzN3Yt0DiXKzv1vTWSP4Xrnn16omJr9VumIATruvLt3rRGdcsgqVh2jNdk-BxlfX-fU/s1600/Share+this+Post.png'/></a><a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share This On Facebook'><img alt='Facebook share' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitjxmqEAt6l075x6UX086FwQV2kA4Oyygz6yoKlTDJfe_8SnokkaPoYtkovqoWqUJpba4bN2Rl3wuH4kL6o9V_hmfBusjWHyszL2qUFrDkFgk8J1qVpRzSAQH6CkB4eXsGfmFrYN4RY4nf/s1600/Facebook+Button+Share.png'/></a><a class='twitter' expr:href='&quot;https://twitter.com/share?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Tweet This'><img alt='Twitter share' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbpu9aEcBPAW0rf7JdFqQCUWSdKH2-2YCObkVUonylwv6YjYysHCb2DY9xAcNbS_PbAiSELmuYjIdNFkjQovqKpVKgVXFbe1Z3ELSw2Fmg1d2vAP9t7aXtpej_xRz9g_Z-v-Owk98kKfkZ/s1600/Twitter+Button+Share.png'/></a><a class='addthis_button_pinterest_share'><img alt='Pin This' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHQZjREi6OGbBliCGdXQMZf9erXmgu5DER2Pqvif9KyjAxZoexVTu2PJVEbYQYCTAhBCIf_l_94IS_oUX5SSMy4L3k7w-yQM19Ptec4emeY21J5_t5O18ra2hTDXvZuprdyCAeaefjnFxn/s1600/Pinterest+Button+Share.png'/></a><a class='addthis_button_email'><img alt='Email This' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCwDMqlsVxMPZLQx-oaffavZrE4bB8yJwCTKQC4gmLPw4VhcPKZ143NGra9EqgzPibMY_AW7vw3UYgYodffqUqWFd8zECI__-pYaQ8ptHh3py9EOZWgXw8f2bFSR3ejP0gktLoCNn6CuVl/s1600/Email+Button+Share.png'/></a></div></div></div><script type='text/javascript'>var addthis_config = {&quot;data_track_addressbar&quot;:true};</script><script src='//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-511bbe8405a64ebd' type='text/javascript'/><!-- TambahThis Button END -->

Pastikan anda menekan "Preview" untuk memastikan semuanya kelihatan betul! Jika ia berlaku, klik save dan anda sudah bersedia! Ia kelihatan seperti ini:

Kode dibawah ditambah Google Plus dan Tumblr. Jika anda mahu ikon ini , copy kode dibawah :

  <!-- AddThis Button BEGIN --><div style='text-align: left;'><div class='addthis_toolbox'><div class='custom_images'><a class='addthis_button_share'><img alt='Share this Post' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjguvt7u5iCvRnchxjMV1Wpt5gmYRkqgF1QWh6BCMAckLdFV90UmD5asEglsfMcHeP2ttx_ebFg-MzN3Yt0DiXKzv1vTWSP4Xrnn16omJr9VumIATruvLt3rRGdcsgqVh2jNdk-BxlfX-fU/s1600/Share+this+Post.png'/></a><a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share This On Facebook'><img alt='Facebook share' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitjxmqEAt6l075x6UX086FwQV2kA4Oyygz6yoKlTDJfe_8SnokkaPoYtkovqoWqUJpba4bN2Rl3wuH4kL6o9V_hmfBusjWHyszL2qUFrDkFgk8J1qVpRzSAQH6CkB4eXsGfmFrYN4RY4nf/s1600/Facebook+Button+Share.png'/></a><a class='twitter' expr:href='&quot;https://twitter.com/share?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Tweet This'><img alt='Twitter share' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbpu9aEcBPAW0rf7JdFqQCUWSdKH2-2YCObkVUonylwv6YjYysHCb2DY9xAcNbS_PbAiSELmuYjIdNFkjQovqKpVKgVXFbe1Z3ELSw2Fmg1d2vAP9t7aXtpej_xRz9g_Z-v-Owk98kKfkZ/s1600/Twitter+Button+Share.png'/></a><a class='addthis_button_pinterest_share'><img alt='Pin This' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHQZjREi6OGbBliCGdXQMZf9erXmgu5DER2Pqvif9KyjAxZoexVTu2PJVEbYQYCTAhBCIf_l_94IS_oUX5SSMy4L3k7w-yQM19Ptec4emeY21J5_t5O18ra2hTDXvZuprdyCAeaefjnFxn/s1600/Pinterest+Button+Share.png'/></a><a class='addthis_button_tumblr'><img alt='Share on Tumblr' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8oS_xoAG-6xMZaZ5hmHbXU0f4-q5AkdworV3ywggSewfcwa0uhSPdiQ659u66tVvqiUtUbZs_Jvc3DdudRhyyUwh5lu4_jNUhaKzON-O9bWxNI-wLaiDjND2m7IxwjxTFBqTlkdXwi4qe/s1600/Tumblr+Icon.png'/></a><a class='addthis_button_google_plusone_share + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Share on Google Plus' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEip3CFwE7wBXGyNWPrT4FhSuTLjvy0hV7eq85NPS-W5eYZfkFPHcRXWojDAhaZGFJ2DSxyKiCrCfSYk74lAkVRXx2qNQ8ZW3f_NgPE56UEMxlrhZz5XDcwCzGGC-rKZLMqtimzY99Gimxhm/s1600/Google+Plus+Share.png'/></a><a class='addthis_button_email'><img alt='Email This' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCwDMqlsVxMPZLQx-oaffavZrE4bB8yJwCTKQC4gmLPw4VhcPKZ143NGra9EqgzPibMY_AW7vw3UYgYodffqUqWFd8zECI__-pYaQ8ptHh3py9EOZWgXw8f2bFSR3ejP0gktLoCNn6CuVl/s1600/Email+Button+Share.png'/></a></div></div></div><script type='text/javascript'>var addthis_config = {&quot;data_track_addressbar&quot;:true};</script><script src='//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-511bbe8405a64ebd' type='text/javascript'/><!-- AddThis Button END -->