How To Alteration Default Blogger Part Buttons To Attractive Custom Images?
Blogger formerly has an pick for share buttons, but it’s non really attractive. So I create upwards one's heed to part my ain tutorial on how I done it. I await this tutorial saves your fourth dimension .Finally, you lot tin forcefulness out brand especially this to create got your exceptional images as well as gibe your fonts or colors. If you're finding for an slow solution. I create got made some attractive greyish buttons that should larn amongst well-nigh whatever blog.
There included Facebook, Twitter, Email, Google+ ,Tumblr as well as Pinterest button.
READ MORE : How to Add Social media Sharing Button Under Every Blogger Post?
At first, you lot postulate to withdraw default Blogger part on your site or blog. To create this,
log inward to your Blogger Dashboard>> Layout tab >> Edit post.
From the window you lot postulate to organize the spider web log posts. There is an pick named “Show the Share Buttons”. Confirm this push clitoris is unchecked. Then click save. Now that the Blogger default part buttons are blank, similar a shot you lot tin forcefulness out add together the customize button.
Now larn to the Template purpose as well as click edit HTML, click within your HTML code as well as hitting Ctrl F to locate the next code:
<div class='post-footer'>
<!-- AddThis Key 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/AVvXsEjcF927XDCh65nUxXQfifh1Nm_fig0z8xwMZI9ViwXhsjcgD77_yiNa8apk_052wfdNMgh6e6ku290c5FlEz3N5rWzccldEaqpH0W66LIP0zSNz_N91QjPvHBDD6p6uGC1dtJW6_PChJaSL/s1600/Share+this+Post.png'/></a><a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&t=" + 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/AVvXsEhhYUsPp8sKQ2lQM-hco6dPgElHQlYlCAOTfWyOnALRYsmkr4LwzgCjU6LMG-7UBey2U8_ttoZADat8Oe51CTiWjAym7eUqZrhcYAsqdnCl9cYZOutqmwBfqnzTvBDDh4HsyNOVy-_dsryz/s1600/Facebook+Button+Share.png'/></a><a class='twitter' expr:href='"https://twitter.com/share?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Tweet This'><img alt='Twitter share' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhURNWNTT5WWgGeJBQzE2FyLZe9gIn93bQGXpuerB71zz3lCr0um__L0CHUNuzk-qxVSzyfM2_NDjlwnCDkHXdebIaik5QMOBh_fI1al6OjDB0_IYGhjNTAa1ED8WK_LPMDpnl76WsxZm6b/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/AVvXsEidPzQ-uP4WEIeU9UOccHJJIjhYmu2rMCFtQXSF27pa6mjS1nrRIPMkhIsoRn_TtxMjaMMQqZuV3bqyyE6xfSIBkHqRFcuzDLcSeA_53vLYj27MWQrldyz1J47_g8hLfdlr_2hIuOMkSr9V/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/AVvXsEgU4Tg245BQMuFRbH9EnAQnuxg7puIR4IavyNq95bZGvEHbz27rQcvoQxUaaQiMD9NCZ9p8eHABCQLtivvPrTLdoZ7J2bHNVHy_QwGYTabGKxlSQLxcoVQnxqiTrgYGhvAsPhN5uwHUt6fb/s1600/Tumblr+Icon.png'/></a><a class='addthis_button_google_plusone_share + data:post.url + "&t=" + data:post.title' rel='nofollow' target='_blank'><img alt='Share on Google Plus' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg20Zvb1vJLI1BbsS8xU2oo4klIrZ0D_Amw7tjQxZFn9WC5X25e9OjXwhUBrf0BGdwYVl25oWeVCN2PyLk-nkLDLJksq31hdTaa8X2JXJ_l0F6A_htnMVKgJvM8HiwOzyj4s_GLv7xMPApD/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/AVvXsEi6mrtZvKNB_0DFGoMP4aS9t7jqlAz6DKzFQI43wuQ0xx-9E_1caxA-n2_u7RyNqLIZgvg3is8L2rUajmNPJwEInmfme3LgZ7GXkO6aCVq7V8kvRLgVNBzGnE3Qwt1KIPg5r9B5ZB6QEDBg/s1600/Email+Button+Share.png'/></a>
</div></div></div><script type='text/javascript'>var addthis_config = {"data_track_addressbar":false};</script><script src='//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-511bbe8405a64ebd' type='text/javascript'/>
<!-- AddThis Key END -->
How to customize this code?
If you lot wishing to modify it, you lot tin forcefulness out modify the img src links amongst your ain images link. Here's an instance of how you lot tin forcefulness out customize this code. If your spider web log template has a boundary around your images, you lot mightiness desire to accept the regular edge off, but that's your call. If you lot desire it centered or aligned correct , detect the line:
<div style='text-align: left ;'>
And modify the left to "center" or “right".
If you lot desire to modify the linguistic communication of "Share this post". Right similar a shot this is saved equally an image. If you lot wishing to nation something another, you lot tin forcefulness out also brand your ain ikon or simply type inward your ain text. To fashion inward your ain detect the line:
<div class='addthis_toolbox'>
And type inward your novel passage correct below. For example: "Like this post or Share it to your friends". You volition thus desire to delete the Share this post ikon yesteryear deleting this line of piece of employment of code:
<a class='addthis_button_share'><img alt='Share this Post' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcF927XDCh65nUxXQfifh1Nm_fig0z8xwMZI9ViwXhsjcgD77_yiNa8apk_052wfdNMgh6e6ku290c5FlEz3N5rWzccldEaqpH0W66LIP0zSNz_N91QjPvHBDD6p6uGC1dtJW6_PChJaSL/s1600/Share+this+Post.png'/></a>
That’s all. Feel gratuitous to enquire whatever inquiry or quarry, brand a respond inward comment section.