You must hear that social share is a very important factor for SEO, but wordpress default doesn't have any social share function, you must add some social share plugins.
But the questions I met are after I had installed the social share plugin on my site, the code of the plugins will make my site slower than before, and more issues I found, the social share cannot customize as I want, such as design the float share on wordpress blog post.
Fortunately, I found the best ways to add social share on my wordpress site, anywhere, and totally 100% customized, so, just follow my steps and see the best ways to add social share on wordpress site without any plugins.
My solution is to add the addtoany.com code to wordpress.
Addtoany is one of the wordpress social share plugins, but also this site supports custom code.
First step, we should click addtoany url and get the based social share button code.
And then click the “Any website” button.
Andtoany supports 12 kinds of sites, such as wordpress, joomla, tumblr etc.
We don’t click the wordpress button because that’s the plugin.
After we have clicked the any website button, we’ll get the new screen.
You can click the “Choose services” to decide which platforms you want to share.
Drag to the left to remove the icon and click on the left will add the social icon, and when finish, just click the “Done”, simple easy.
The default language of addtoany is English. If you want to change to another language such as French or Chinese, you can click the “More Options” link to change.
More than 50 languages to choose, very strong!
Finished all customized design, click “Get the Button Code”, we will get a code like this:
<!-- AddToAny BEGIN -->
<div class="a2a_kit a2a_kit_size_32 a2a_default_style">
<a class="a2a_dd" href="https://www.addtoany.com/share"></a>
<a class="a2a_button_facebook"></a>
<a class="a2a_button_twitter"></a>
<a class="a2a_button_linkedin"></a>
</div>
<script async src="https://static.addtoany.com/menu/page.js"></script>
<!-- AddToAny END -->
keep this code, next step we’ll open our wordpress site and paste this code.
I suggest pasting the share code on the widget, so the button will display on all single posts.
Open the widget on wordpress dashboard, and add the HTML block to main sidebar, like photo below:
Display on the frontend like this:
Add to any also support floating social icons, and just need to change the class attribute.
Remember the code we had copied on last section, just a2a_default_style to a2a_floating_style a2a_vertical_style, and add style="left:0px; top:150px;" after the class=”xxx”, and we’ll get new code like this:
<!-- AddToAny BEGIN -->
<div class="a2a_kit a2a_kit_size_32 a2a_floating_style a2a_vertical_style" style="left:0px; top:150px;" >
<a class="a2a_dd" href="https://www.addtoany.com/share"></a>
<a class="a2a_button_facebook"></a>
<a class="a2a_button_twitter"></a>
<a class="a2a_button_linkedin"></a>
</div>
<script async src="https://static.addtoany.com/menu/page.js"></script>
<!-- AddToAny END -->
The left:0px;top:150px means the icon position, you can change the number to edit the position.
Sometimes we need to add share counters to make the article have some social proof.
Addtoany has this function, add a2a_counter after each share icon class attribute and we’ll get the final share code:
<!-- AddToAny BEGIN -->
<div class="a2a_kit a2a_kit_size_32 a2a_floating_style a2a_vertical_style" style="left:0px; top:150px;" >
<a class="a2a_dd" href="https://www.addtoany.com/share"></a>
<a class="a2a_button_facebook a2a_counter "></a>
<a class="a2a_button_twitter a2a_counter "></a>
<a class="a2a_button_linkedin a2a_counter "></a>
</div>
<script async src="https://static.addtoany.com/menu/page.js"></script>
<!-- AddToAny END -->
So that’s all work to add a social share button to wordpress without any plugin, and it’s very easy, just try it yourself, and if you have any questions, comment let me know.